值未通過使用Ajax

Question

到PHP我有以下腳本：

<script type="text/javascript" > 

$('form').each(function() { 
    $(this).on('submit', function() { 

var first_firstname = $(".first_firstname", this).val(); 
var first_lastname = $(".first_lastname", this).val(); 
var second_firstname = $(".second_firstname", this).val(); 
var second_lastname = $(".second_lastname", this).val(); 
var TeamName = $(".TeamName", this).val(); 
var dataString = 'first_firstname='+ first_firstname + '&first_lastname=' + first_lastname + 
'&second_firstname=' + second_firstname + '&second_lastname=' + second_lastname + '&TeamName=' + TeamName; 

$.ajax({ 
type: "POST", 
url: "data.php", 
data: dataString, 
success: function(){ 
window.setTimeout(function(data) 
{ 
$('#propspectDiv').html('Team Name Added!'); 
$('#data').css("display","block"); 
$('#data').html(data); 
}, 2000); 
} 

}); 

return false; 
}); 

</script> 

而下面的PHP，使用mysql數據庫

<?php  

echo '<table class="greensmalltbl" cellspacing="10px" cellpadding="5px"><div id="propspectDiv"></div>'; 

    for ($i=1, $o=$totalEntrants; $i<=$half; $i++, $o=$o-1) { 

    $formid = $i; 


echo "<div style='border:3px;'><form action='' method='post'> 
<tr><td><input type='text' name='first_firstname' id='first_firstname' value='$firstName[$i]' /> 
<input type='text' name='first_lastname' id='first_lastname' value='$lastName[$i]' /> 
    Skill Level : ".$skill[$i]."</td></tr>"; 
echo "<tr><td>WITH</td></tr>"; 
echo "<tr><td><input type='text' name='second_firstname' id='second_firstname' value='$firstName[$o]' /> 
<input type='text' name='second_lastname' id='second_lastname' value='$lastName[$o]' /> Skill Level ".$skill[$o]."</td></tr>"; 
echo "<tr><td>Enter Team Name : <input type='text' name='TeamName' id='TeamName' value='' /> 
<input type='submit' name='submit' value='Submit'></form></td></tr>"; 

    } 

echo '</table>'; 

>

產生了一些頁面上的形式？

我想用每個表格中的TEAM NAME更新db表

問題是隻有f第一種形式的輸入通過所有其他形式不做任何事 我已經嘗試了一些變種的ajax代碼，但都沒有工作。 任何人都可以在這裏找到問題

Answer 1

此行不會返回表單。

var parent = $(this).parent('form'); 

，因爲你的提交按鈕被包裹在裏面tr和td標籤。無論是擺脫這些標籤的（他們反正invallid，因爲你不是在table使用它們），或更新您的代碼：

var parent = $(this).closest('form'); 

closest()搜索它的方式，以一個元素的所有祖先，和將返回選擇器的第一個匹配項。 看看這裏的文檔：http://api.jquery.com/closest/

或者，如果你只需要在你的頁面的單一形式，你可以隨便去：

var parent = $('form'); 

::編輯::

確定。忘記以上所有。看起來你甚至沒有在代碼中使用父變量。 更重要的問題是，即使您正在捕獲表單提交按鈕上的Click事件，您可能確實想要做的是捕獲表單的提交事件。

所以，你的第一行代碼改成這樣：

$('form').on('submit', function() { 

而且，在你的HTML，你的代碼是無效的。

<form action'' method='post' id='$formid'> 

action''應該是action = ''

機會是這並不能真正解決您的問題，因爲可能有更多的錯誤。下次在發佈問題前嘗試驗證您的代碼。

::編輯::

最後編輯，我保證。我很快就再次瀏覽了你的代碼，看起來你會有多種形式。這意味着，你將獲得具有相同ID的不同形式的元素。 id在整個頁面中應該是唯一的。所以當你試圖獲得像這樣的值$("#second_firstname").val();這是行不通的。因爲jQuery不知道你說的是什麼元素，所以在頁面中多次出現的所有元素都需要有一個類並且不能有一個id。

然後，您可以您的形式改變的事情循環槽：

$('form').each(function() { 
    $(this).on('submit', function() { 

     var first_firstname = $(".first_firstname", this).val(); // . instead of # and use 'this' as context 

     // and so on.. 
     // the rest of your code here. 
    } 
}); 

table with forms can be seen here