用jQuery.ajax（）分别在多个表格行中提交数据 [英] Submit data within multiple table rows separately with jQuery.ajax()

问题描述

目前，只要我在表格中只有一行，我就可以提交表格。如果我添加第二行，它将无法正常工作，并且出现错误。我想要实现的是分别在每个表格行中发布数据，但只需按一下按钮。您可以在下面看到我的HTML标记。

Currently I am able to submit my form as long as I only have one row within the table. If I add a second row it won't work and I get an error. What I want to achieve is to post the data within each table row separately, but with only a single button press. You can see my HTML mark-up below.

<form>
  <table>
    <tr>
      <td><input type="hidden" name="FirstName" id="FirstName" value="Bob">Bob</td>
      <td><input type="hidden" name="Surname" id="Surname" value="Hoskins">Hoskins</td>
    </tr>

    <tr>
      <td><input type="hidden" name="FirstName" id="FirstName" value="Bruce">Bruce</td>
      <td><input type="hidden" name="Surname" id="Surname" value="Wayne">Wayne</td>
    </tr>
  </table>
</form>

我被告知可以使用jQuery AJAX提交数据。我想知道是否有办法编写这个jQuery，使它定位到第一个表格行，提交数据，然后是第二行，再次提交数据，依此类推，直到所有行在循环中分开提交。下面是我提交数据的基本代码，但它需要使用我的HTML。

I've been told that I can use jQuery AJAX to submit the data. I'm wondering if there's a way to write this jQuery so that it targets the first table row, submits the data, then the second row, submits the data again, and so on until all the rows are submitted separately in a loop. Below is the basic code I have for submitting the data but it needs to work with my HTML.

$.ajax({
   type: "POST",
   cache: false, 
   url: "WuFoo.aspx",
   data: data,
   success: success
});

推荐答案

我认为你可以这样做，首先应用ID到你的表格，并循环遍历每一个 tr 。

I think you can do this way, first apply an ID to your table and loop through each tr.

$('#TableID > tr').each(function() {
    var postData = {
    'FirstName':$(this).find('#FirstName').val(),
    'SurName':$(this).find('#Surname').val()
    };
    $.ajax({
    type: "POST",
    cache: false, 
    url: "WuFoo.aspx",
    data: postData ,
    success: success
    });
 });

编辑：我已更新我的回答，我不确定是最好的方法，但这将会发布您的数据。

EDIT : I have updated my answer, I'm not sure this is the best way to do, but this will work to post your data.

这篇关于用jQuery.ajax（）分别在多个表格行中提交数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！