weixin_33691700 2020-02-14 07:54 采纳率: 0%
浏览 45

Ajax表单数据传递

How can I pass the form data on my PHP file? I have tried the below solution but it was not worked for me. I need to pass all checkboxes on my PHP function.I have tried but not getting the perfect value that I need?

Please check the issue and guide me where I was wrong.

<form id="filterForm" method="post">

          <div class="dropdown">
            <button class="btn btn-secondary dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
            Beer Brands
            </button>
            <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
              <ul>
                <li><input class="clickBox" type="checkbox" name="beer_brands[]" value="valu1" />Test</li>
                <li><input class="clickBox" type="checkbox" name="beer_brands[]" value="valu2"/>Test</li>
                <li><input class="clickBox" type="checkbox" name="beer_brands[]" value="value3"/>Test</li>
              </ul>
            </div>
          </div>

          <div class="dropdown">
            <button class="btn btn-secondary dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
            Locations
            </button>
            <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
              <ul>
                <li><input class="clickBox" type="checkbox" name="locations[]" value="value4" />Test</li>
                <li><input class="clickBox" type="checkbox" name="locations[]" value="value5"/>Test</li>
                <li><input class="clickBox" type="checkbox" name="locations[]" value="value6"/>Test</li>
              </ul>
            </div>
          </div>

          <div class="dropdown">
            <button class="btn btn-secondary dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
            Sort By
            </button>
            <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
              <ul>
                <li><input class="clickBox" type="checkbox" name="sort_by[]" value="value7" />Test</li>
                <li><input class="clickBox" type="checkbox" name="sort_by[]" value="value8"/>Test</li>
                <li><input class="clickBox" type="checkbox" name="sort_by[]" value="value9"/>Test</li>
              </ul>
            </div>
          </div>

        </form>

JQuery

<script type="text/javascript">
jQuery(document).ready(function(){

  jQuery(".clickBox").click(function(e){ 

      var b_b_Array  = []
      var location_Array  = []
      var sort_by_Array  = []

      jQuery('.clickBox').each(function ()
      {
          //debugger;
          jQuery("input[name='beer_brands[]']").each( function () {
              if(jQuery('input[name="beer_brands[]"]').is(':checked')) {
                b_b_Array.push(jQuery(this).val());
              }
          });

          jQuery("input[name='locations[]']").each( function () {
              if(jQuery('input[name="locations[]"]').is(':checked')) {

                location_Array.push(jQuery(this).val());
              }
          });

          jQuery("input[name='sort_by[]']").each( function () {
              if(jQuery('input[name="sort_by[]"]').is(':checked')) {

                sort_by_Array.push(jQuery(this).val());
              }
          });

      });

      console.log(b_b_Array);
      console.log(location_Array);
      console.log(sort_by_Array);

      var ajaxurl = "<?php bloginfo('url');?>/wp-admin/admin-ajax.php";

      jQuery.ajax({
          url: ajaxurl,
          type : 'post',
          data: {
            'action':'all_give_aways_filter',
            'data' : jQuery("filterForm").serialize(),
          },
          success : function( response ) {
              console.log(response);
              // jQuery("div#errMsg").css({'background-color':'white','color':'red'});
              // jQuery("div#errMsg").html(response);
          }
      });

  });

});

</script>

Please Help me to solve this issue.

  • 写回答

1条回答 默认 最新

  • elliott.david 2020-02-14 08:27
    关注

    Can you try replace this JavaScript. Hope this help you

    function get_checkbox_value(){
        var array = [];
        jQuery(':checkbox:checked').each(function(i, _this){
          var checkboxname = jQuery(_this).attr('name'); checkboxname = checkboxname.replace('[]','');
          array[checkboxname]=[];
          array[checkboxname].push(jQuery(this).val());
        });    
        return array;
    }
    
    jQuery(document).ready(function(){
    
        jQuery("#filterForm").submit(function(e){
            e.preventDefault();
    
            var formdata = get_checkbox_value();
            var ajaxurl = "<?php bloginfo('url');?>/wp-admin/admin-ajax.php";
    
          jQuery.ajax({
              url: ajaxurl,
              type : 'POST',
              data: {
                'action':'all_give_aways_filter',
                'data' : formdata,
              },
              success : function( response ) {
                  console.log(response);
              }
          });
      });
    });
    
    评论

报告相同问题?

悬赏问题

  • ¥30 STM32 INMP441无法读取数据
  • ¥100 求汇川机器人IRCB300控制器和示教器同版本升级固件文件升级包
  • ¥15 用visualstudio2022创建vue项目后无法启动
  • ¥15 x趋于0时tanx-sinx极限可以拆开算吗
  • ¥500 把面具戴到人脸上,请大家贡献智慧
  • ¥15 任意一个散点图自己下载其js脚本文件并做成独立的案例页面,不要作在线的,要离线状态。
  • ¥15 各位 帮我看看如何写代码,打出来的图形要和如下图呈现的一样,急
  • ¥30 c#打开word开启修订并实时显示批注
  • ¥15 如何解决ldsc的这条报错/index error
  • ¥15 VS2022+WDK驱动开发环境