Question

我想发送带有来自html表单的数据的帖子请求，该表格将由用户填写。我想使用jquery来实现这一目标。这是我的尝试（不工作）：

<table class="agenda">
  <thead>
    <tr>
      <th></th>
      <th>August 4</th>
      <th>August 5</th>
      <th>August 6</th>
      <th>August 7</th>
      <th>August 8</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Morning</td>
      <td>Day 1 Morning</td>
      <td>Day 2 Morning</td>
      <td>Day 3 Morning</td>
      <td>Day 4 Morning</td>
      <td>Day 5 Morning</td>
    </tr>
    <tr>
      <td>Afternoon</td>
      <td>Day 1 Afternoon</td>
      <td>Day 2 Afternoon</td>
      <td>Day 3 Afternoon</td>
      <td>Day 4 Afternoon</td>
      <td>Day 5 Afternoon</td>
    </tr>
    <tr>
      <td>Evening</td>
      <td>Day 1 Evening</td>
      <td>Day 2 Evening</td>
      <td>Day 3 Evening</td>
      <td>Day 4 Evening</td>
      <td>Day 5 Evening</td>
    </tr>
  </tbody>
</table>

$(function () {
    $("#create").click(function (event) {
        event.preventDefault();
        $.ajax({
            type: "POST",
            url: "/home/new",
            data: $(this).serialize(),
            success: function (data, textStatus, jqXhr) {
                //call "home/new" with data from html form as json and update current view with returned data
                console.log("success");
            },
            error: function () {
                alert("error");
            }
        });
    });
});

Answer 1

我相信这应该可以解决问题：

使用jQuery循环输入，以提取您的值。
将值存储在新对象中。
将此对象传递给Ajax调用。

您只需要添加这段代码（来源：Obtain form input fields using jQuery?）

var values = {};

$.each($('#myForm input').serializeArray(), function(i, field) {
values[field.name] = field.value;
});

将values作为数据传递给Ajax调用。

以下是JSFiddle中的示例：https://jsfiddle.net/gsdfoyu5/6/

如何使用jquery发送html表单数据

1 个答案: