投稿フォームがjqueryフィールドで機能しない

Question

動的フィールドを使用して別のスクリプトに変数を投稿するフォームを取得できませんか？

編集：スクリプトは入力フィールドの新しい行を作成しますが、PHPスクリプトに変数を投稿することはできません。

jqueryの：

<script type="text/javascript"> 
    $(function(){ 

      var newRowNum = 2; 


      $('#addnew').click(function(){ 
        // increment the counter 
        newRowNum += 1; 

        var addRow = $(this).parent().parent(); 


        var newRow = addRow.clone(); 


        $('input', addRow).val($(this).val()); 
        $('name', addRow).val('os' + newRowNum); 


        $('td:last-child', newRow).html('<a href="" class="remove">Remove<\/a>'); 


        $('input', newRow).each(function(i){ 
          var newID = 'os' + newRowNum + i; 
          $(this).attr('id',newID).attr('name',newID); 
        }); 



        addRow.before(newRow); 


        $('a.remove', newRow).click(function(){ 
          $(this).parent().parent().remove(); 
          return false;       
        }); 


        return false; 
      }); 
    }); 

HTML：

<tr> 
<td> 
<input name="os21" type="text" id="os21" value="" size="24" maxlength="60" /></td> 
<td> 
<input name="os22" type="text" id="os22" value="" size="24" maxlength="60" /></td> 
<td> 
<input name="os23" type="text" id="os23" value="" size="10" maxlength="60" /></td> 
<td><a id="addnew" href="">Add +</a></td> 
</tr> 
<tr><td colspan="3" align="left" style="text-align: right; padding-top: 10px;"> 
<input type="submit" value="Update"> 
</td></tr> 

Answer 1

<script language="text/javascript"> 
    function postMyForm() 
    { 
     $.ajax({ 
      url: "url from your file to post to", 
      data: $('#myForm').serialize(), 
      type: 'post', 
      success: function(data) { 
       // do stuff when request is done 
      } 
     }); 
    } 

    function AddNewRule() { 
     // get last ID 
     // convert to a int to count with it 
     var LastID = parseInt($('#myTable tr:last td input').attr('id').replace(/os/gi, '')); 
     // add 1 to get next ID 
     LastID += 1; // OR LastID = LastID + 1; what you wanna use 

     // create new rule and set the next ID 
     var newRule = $('<tr><td><input name="os'+ LastID +'" type="text" id="os'+ LastID +'" value="" size="10" maxlength="60" /></td></tr>'); 

     // append/insert at the end of your table 
     $('#myTable').append(newRule); 
    } 
</script> 

<form id="myForm"> 
<table id="myTable"> 
    <tr> 
     <td> 
      <input name="os21" type="text" id="os21" value="" size="24" maxlength="60" /> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      <input name="os22" type="text" id="os22" value="" size="24" maxlength="60" /> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      <input name="os23" type="text" id="os23" value="" size="10" maxlength="60" /> 
     </td> 
    </tr> 
</table> 
    <a id="addnew" onclick="AddNewRule();" href="javascript:void(0);">Add +</a> 
<table> 
    <tr> 
     <td colspan="3" align="left" style="text-align: right; padding-top: 10px;"> 
      <input type="submit" onclick="postMyForm();" value="Update"> 
     </td> 
    </tr> 
</table> 
</form> 

Answer 2

私は、変数を初期化i表示されません。私たちはすべての情報源を見ることはできませんが、おそらくこれが問題だと思います。内部要素のはず

Answer 3

入力要素...

Answer 4

なぜあなたはちょうどカウンターを失い、このようにそれをしない：あなたが行を追加した後

<input name="os[]" type="text" class="os" value="" size="24" maxlength="60" /> 

を動的にあなたがバインドする必要があります（」クリック）するか、単にlive（）メソッドを使用します。