2014-07-05 87 views
1

我有一個php頁面,其中包含一個表格中排列的輸入框數組。每一行都包含有關基金每個成員的信息。不同的專欄涉及他們在不同的負責人下所付的錢。我想用它來更新包含成員帳戶的mysql表。如何使用jquery創建一個數組併發送一個post請求?發送數組使用jquery post

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
<title>Untitled Document</title> 
<script type="text/javascript" src="js/jquery-ui-1.10.4.custom/js/jquery-1.10.2.js"></script> 
<script type="text/javascript"> 


jQuery.noConflict(); 
jQuery.validator.setDefaults({ 
    submitHandler: function() { 

     //create an array of values in each row 
     jQuery.post("scripts/update.php", { 

      //send array to the script 
     }, function (data) { 

      alert(data); 
     }); 
    } 
}); 



</script> 

</head> 

<body> 
<form id="form1" name="form1" action=""> 
<table><tr><th>Mem No.</th><th>Subcription</th><th>Loan</th><th>Interest</th></tr> 
<tr><td> 
<input type="text" id="memberno1" value="1001"/></td><td><input type="text" id="sub1" /></td><td><input type="text" id="loan1"/></td><td> <input type="text" id="int1" /></td></tr> 

<tr><td> 
<input type="text" id="memberno2"value="1002" /></td><td><input type="text" id="sub2" /></td><td><input type="text" id="loan2"/></td><td> <input type="text" id="int2" /></td></tr> 
<tr><td> 
<input type="text" id="memberno3" value="1003"/></td><td><input type="text" id="sub3" /></td><td><input type="text" id="loan3"/></td><td> <input type="text" id="int3" /></td></tr> 
<tr><td> 
<input type="text" id="memberno4" value="1004"/></td><td><input type="text" id="sub4" /></td><td><input type="text" id="loan4"/></td><td> <input type="text" id="int4" /></td></tr> 
<tr><td> 
<input type="text" id="memberno5" value="1005"/></td><td><input type="text" id="sub5" /></td><td><input type="text" id="loan5"/></td><td> <input type="text" id="int5" /></td></tr> 
<tr><td> 
<input type="text" id="memberno6" value="1006"/></td><td><input type="text" id="sub6" /></td><td><input type="text" id="loan6"/></td><td> <input type="text" id="int6" /></td></tr> 
<tr><td> 
<input type="text" id="memberno7" value="1007"/></td><td><input type="text" id="sub7" /></td><td><input type="text" id="loan7"/></td><td> <input type="text" id="int7" /></td></tr></table> 
<input type="submit" valueue="Save" id="submit"/> 
</form> 
</html> 
+0

形式的名稱/值對提交他們的數據。每個控件都需要一個名稱 - 用name =替換id =。如果你想使用數組來傳遞數據,那麼使用name ='int []',因爲php會處理這些數組。 – jeff

回答

0

好,遍歷所有錶行和每個迭代所有輸入字段:

var arr = $('#form1 tr:gt(0)').map(function() { 
    return [$('input', this).map(function() { 
     return this.value; 
    }).get()]; 
}).get(); 

Demo

一個需要注意的是,你必須依靠每個字段的順序。

+0

我檢查了演示,沒有得到輸出。我在我的腳本中嘗試過,但返回的數組是用逗號分隔的所有輸入框的值,而不是多維數組 – mansoondreamz

+0

@mansoondreamz我認爲你用我的答案的第一個版本運行它,因爲它寫入的代碼以上產生多維數組。 –

+0

我沒有任何修改就使用了上面的代碼。看到這個http://jsbin.com/netayaga/2/edit如果我輸入一些值,它不是採取 – mansoondreamz

0

您需要創建一個空的array並將其中的每個輸入都推送到那裏,然後將其用於您的POST。事情是這樣的:

jQuery.noConflict(); 
jQuery.validator.setDefaults({ 
    submitHandler: function() { 

     var inputArray = []; 

     $('#form').find('input[type=text]').each(function() { 
      // get the value or something from each input 

      inputArray.push($(this).val()); 
     }) 

     //create an array of values in each row 
     jQuery.post("scripts/update.php", { 
      'inputs' : inputArray //send array to the script 
     }, function (data) { 
      alert(data); 
     }); 
    } 
}); 

你應該得到inputs與您輸入的文本值的數組。希望幫助

0

使用jQuery.post(網址,數據,回調)

通過使用序列化,你可以自動發送整個表單。

jQuery.post("scripts/update.php", 
       $("form#form1").serialize(), 
       function (data) { 
       alert(data); 
       }); 
0
$.ajax({ 
url: 'ajax-post-url.php', 
type: 'POST', // or GET method 
dataType: 'json', 
data: $('.form').serialize(), // all data 
success: function(response) { 
    console.log(response); 
} 
}); 

$.post('ajax-post-url.php', $('.form').serialize(), function(response) { 
console.log(response); 
});