jquery ajaxで配列を渡す

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;      

}); 

のように見えます。これは、それが

<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> 

を生成するHTML、彼らはリンクの上に新しいリスト項目をクリックするたびに次のとおりです。リンクは次のようになりますが加えられる。私もそれらを数え、名前に数を入れて、各入力項目が一意であるようにします。

入力値が1つ以上のリスト項目がある可能性があります。送信ボタンがクリックされると、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文字列として送信サブアレイ、及び配列として存在し、それをデコードし、 JavaScriptライブラリ任意のJSONを試し、 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(); 

もちろん、あなたのニーズに合わせてカスタマイズすることができます。