Question

当有人点击某个特定链接时，我有jquery生成一个带有几个输入字段的列表项。链接如下所示：

<a href="#" id="add_sublink" data-sublink_count = "0">Click Here to add more sub links</a>

jquery看起来像这样

$('#add_sublink').live("click", function(){

    var count  = $(this).attr('data-sublink_count');
    var form = "<li>Link Name:<br />" +
           "<input type='text' size = '40' id='sublinkname' name='sub_link_name_" + count + "' value=''/><br />" +
           "Link URL:<br />" +
           "<input type='text' size = '40' id='sublinkurl' name='sub_link_url_" + count + "' value=''/>" +            
           "</li>";


        $('#sublink_list').append(form);
        var newcount = ( Number(count) + Number(1) );
        $(this).attr('data-sublink_count', newcount)

    return false;                       

});

这是它生成的html

<li>Link Name:<br>
<input type="text" value="" name="sub_link_name_0" id="sublinkname" size="40"><br>
Link URL:<br>
<input type="text" value="" name="sub_link_url_0" id="sublinkurl" size="40"><br>
</li>

每次点击链接时，都会添加一个新的列表项。我也在计算它们并将计数放在名称上，因此每个输入项都是唯一的。

我可能有一个或多个列表项，其中包含输入值。单击提交按钮后，我将使用jquery收集信息并尝试通过ajax发送信息。

    $('.save_link').live('click', function() {
    var linkID = $(this).attr('data-link_id');

        $('#sublink_list').children().each(function(index) {
            var this_sublink_name = $(this).find('#sublinkname').val();
            var this_sublinkurl = $(this).find('#sublinkurl').val();        

            sub_array[index]['name'] = this_sublink_name;
            sub_array[index]['url'] = this_sublinkurl;                          

            var index = ( Number(index) + Number(1) );

        }); 

        //send the info
        $.ajax({
            url: 'update_link.php', 

            data: jQuery.extend(
                {linkID: linkID},                                           
                {sub_array: sub_array}),        
            type: 'POST',    
            success: function(results) {        
                if (results == "error"){
                    //then display an error                                                     
                }else{                          
                    //display success                                                       
                }                                           
            }
        });


return false;
});

一切正常，但ajax没有正确发送数组sub_array。

我已经阅读了其他建议像这样发送数组的地方

{'sub_array[index][name]': 'value'} //value would be replaced with the actual value

但由于列表项是动态的，我不知道会有多少，也不知道它的价值。

我也试过发送这样的数据：

data: 'linkID=' + linkID +                                          
      '&sub_array=' + sub_array,

但它也没有用。

在这种情况下，发送具有未知数量的数组项和未知值的多维数组的最佳方法是什么？

Answer 1

将子阵列作为JSON字符串发送到后端，并将其解码为数组，尝试任何JSON JavaScript库， http://www.json.org/

另一个相关问题：

Why doesn't jquery turn my array into a json string before sending to asp.net web method?

Answer 2

我通常使用jQuery plugin AjaxForm自动将表单中的所有数据发送到ajax“端点”。为此，您只需要执行以下操作：

$('#yourForm').ajaxForm();

当然，可以根据您的需求进行定制。

通过jquery ajax传递数组

2 个答案: