如何选择表格中的所有输入字段答案

【问题标题】：How to select all input fields that sits in a table如何选择表格中的所有输入字段
【发布时间】：2016-09-16 10:42:58
【问题描述】：

我有一个“坐在”表格内的表格

                <form id="form">
            <input type="submit" value="send" class="btn btn-w-m btn-primary" style="float: left;">Add transaction</input>
            <table class="table table-striped table-bordered table-hover " id="editable" >
                <thead>
                <tr>
                    <th>Date</th>
                    <th>Name<br>(Last name, Firstname,<br>
                        or Business name)
                    </th>
                    <th>Address</th>
                    <th>Phone</th>
                    <th>Price with VAT</th>
                    <th>VAT</th>
                    <th>Transaction type</th>
                    <th>Currency</th>
                    <th>Installments</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td><input type="date" name="date"/></td>
                    <td><input type="text" name="name"/></td>
                    <td><input type="text" name="address"/></td>
                    <td><input type="text" name="phone"/></td>
                    <td><input type="text" name="price_with_vat"/></td>
                    <td>25%(from database)</td>
                    <td class="exclude"><select name="transaction_type">
                            <option>value1</option>
                            <option>value2</option>
                            <option>value3</option>
                        </select></td>
                    <td class="exclude"><select name="currency">
                            <option>Euro</option>
                            <option>USD</option>
                            <option>Pound</option>
                        </select></td>
                    <td class="exclude"><select name="installments">
                            <option>Yes</option>
                            <option>No</option>
                        </select></td>
                </tr>
                </tbody>

我想要的是选择所有输入值并将 Ajax 请求发送到 php 端。问题是在我的 jquery 函数（以下代码）中，我无法收集所有输入。虽然我有一个preventDefault 页面，但仍然会刷新。

    var request;
$('#form').submit(function(event){

    if (request){
        request.abort();
    }

    var form = $(this)

    var $inputs = $form.find("input, select, button, textarea");
    var serializedData = $form.serialize();
    $inputs.prop("disabled", true);
    console.log(serializedData);
    event.preventDefault();
});

【问题讨论】：

可以使用数据：$('#formName').serialize()。见链接api.jquery.com/serialize
我对@987654325@进行了编辑，请看一下（见最后一句话）
var form = $(this) 应该是 $form

标签： javascript php jquery ajax forms

【解决方案1】：

试试这个代码

对于要包含在序列化字符串中的表单元素的值，该元素必须具有名称属性。

$(document).ready(function() {
  //Form submit event
  $('#form').on('submit', function(e){

    // validation code here
    if(!valid) {
      e.preventDefault();
    }

    //Serialized data 
    var datastring = $("#form").serialize();

    //Ajax request to send data to server
    $.ajax({
        type: "POST",
        url: "your url.php",
        data: datastring,
        success: function(data) {
            alert('Data send');
        }
    });
  });
});

【讨论】：

最后一个问题。为什么select 输入不能从serialieze() 函数中收集？
@dios231 ：仅序列化具有 name 属性的“拾取”元素。为您的选择标签提供一个名称以进行序列化。

【解决方案2】：

尝试使用此代码：

$('#form').on('submit', function (e) {
e.preventDefault();
$.ajax({
  type: 'post',
  url: 'yourpage.php',
  data: $('#form').serialize(),
  success: function(){
          alert('success');
              },
});
 });
});
});

只需将 url: 'yourpage.php' 更改为您要发送表单值的 php 页面

【讨论】：