多个复选框组值的多维数组jQuery post array AJAX [英] Multidimensional array of multi checkbox group values jQuery post array AJAX

问题描述

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

I have the following code. I want to add/remove check-box values to an array and pass to a JavaScript ajax call. I want to be able to pass all sort array to on array for the ajax call. Each time a checkbox is changed it updates the array, which in turn should update the array that's passed to 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处理，特别是如果有更多的复选框组添加。

i could maybe do this, but I want to pass the array to php to handle especially if there are more check-box groups added.

结果

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/

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

注意：

• 每个 name 需要是唯一的。无论如何，这是一个很好的形式。我将它们命名为box＃，但你应该使用更合适的名称来描述它们是什么。


• 使用数据属性到组对象。这是执行此操作的语义方式。


• 您的输入 s应位于表单标记中一个 id 。这有助于你使用jQuery选择器来获取你想要的对象。


• 我删除了值属性。如果您愿意，可以重新输入值。我只是不希望在那里看到value属性。


• 你应该将它们全部存储在一个对象或数组中。这样你就可以管理所有在一个地方检查状态。

• Each name needs to be unique. This is good form anyway. I named them box# but you should use more appropriate names that describe what they are.
• Use data attribute to group objects. This is the semantic way to do this.
• Your inputs should be in a form tag with an id. This helps you use jQuery selectors to get the objects that you want.
• I erased the value attribute. You can put a value back in if you'd like to. I just would prefer not see the value attribute in there.
• You should store all of them in an object or array. This is so you can manage ALL of the checked states in one place.

这篇关于多个复选框组值的多维数组jQuery post array AJAX的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！