多维数组的多复选框组值jQuery post数组AJAX

Multidimensional array of multi checkbox group values jQuery post array AJAX

本文关键字：数组 jQuery AJAX post 复选框      更新时间：2023-09-26

我有以下代码。我想添加/删除复选框值到数组，并传递给JavaScript ajax调用。我希望能够将所有排序数组传递给ajax调用的数组。每次更改复选框时，它都会更新数组，而数组又会更新传递给ajax的数组。

<input class='sort1' type='checkbox' value='' name='sort1' />
<input class='sort1' type='checkbox' value='' name='sort1' />
<input class='sort1' type='checkbox' value='' name='sort1' />
<input class='sort2' type='checkbox' value='' name='sort2' />
<input class='sort2' type='checkbox' value='' name='sort2' />
<input class='sort3' type='checkbox' value='' name='sort3' />
<input class='sort3' type='checkbox' value='' name='sort3' />
<input class='sort3' type='checkbox' value='' name='sort3' />
<input class='sort3' type='checkbox' value='' name='sort3' />

var arr_sort = {}
var arr_sort1 = {};
var arr_sort2 = {};
var arr_sort3 = {};
    $(".sort1").delegate("input[type='checkbox']", 'change', function() {
        var $this = $(this);
        if ($this.prop('checked')) {
            arr_sort1[$this.attr('name')] = $this.val();
        } else {
            delete arr_sort1[$this.attr('name')];
        }
        ajax_call();
    });
$(".sort2").delegate("input[type='checkbox']", 'change', function() {
        var $this = $(this);
        if ($this.prop('checked')) {
            arr_sort2[$this.attr('name')] = $this.val();
        } else {
            delete arr_sort2[$this.attr('name')];
        }
        ajax_call();
    });
$(".sort3").delegate("input[type='checkbox']", 'change', function() {
        var $this = $(this);
        if ($this.prop('checked')) {
            arr_sort3[$this.attr('name')] = $this.val();
        } else {
            delete arr_sort3[$this.attr('name')];
        }
        ajax_call();
    });
function ajax_call(){
    $.ajax({
         type: 'POST',
         url: "file.php",
         data: { thisaction: thisaction, sort: arr_sort},
         success: function(data){ 
             $("#results").html(data);
            }
        }); 
}

我也许可以这样做，但我想把数组传递给php来处理，特别是如果有更多的复选框组添加。

结果

array (
   "sort1" => array("1","2","3"),
   "sort2" => array("this","that"),
   "sort3" => array("other","ok")
)
or
array (
   "sort1" => array("1","2","3"),
   "sort2" => array("this")
   "sort3" => array()
)

答:http://jsfiddle.net/morrison/XS48K/

指出:

  • 每个name需要唯一。无论如何，这是一个好形式。我把它们命名为box#，但是你应该用更合适的名字来描述它们。
  • 使用data属性对对象进行分组。这是语义上的方法。
  • 你的input应该在form标签和id .这有助于你使用jQuery选择器来获得你想要的对象。
  • 我删除了value属性。如果你愿意，你可以把一个值放回去。我只是不希望在那里看到value属性。
  • 您应该将它们全部存储在对象或数组中。这样你就可以在一个地方管理所有的检查状态。
相关文章：