Question

这应该找到表单中的所有字段并将它们提交到将插入到mysql的PHP页面，但我得到的只是一个空数组。这里缺少什么？我不需要.val（）吗？

<form id="form">
<table width="100%">
<tbody><tr><th>Displayname</th><th>URL</th><th>Parent</th><th>Sort Order</th><th>Active</th></tr>
<tr class="even"><td width="200">Settings</td><input type="hidden" value="1" id="Settings[0]"><td><input type="textbox" value="settings.php" size="75" id="Settings[1]"></td><td><select id="Settings[2]"><option selected="" value="0">No Parent</option><option value="1">Settings</option><option value="2">Grid Demo</option><option value="3">TEST</option><option value="4">Grid Options</option><option value="5">setGridOptions</option><option value="6">Menu Items</option><option value="7">Ajax Menu</option></select></td><td><input type="textbox" value="0" size="5" id="Settings[3]"></td><td><input type="hidden" value="INACTIVE" id="Settings[4]"> <input type="checkbox" value="ACTIVE" id="Settings[4]"></td></tr>
<tr class="odd"><td width="200">Grid Demo</td><input type="hidden" value="2" id="Grid_Demo[0]"><td><input type="textbox" value="grid.php" size="75" id="Grid_Demo[1]"></td><td><select id="Grid_Demo[2]"><option selected="" value="0">No Parent</option><option value="1">Settings</option><option value="2">Grid Demo</option><option value="3">TEST</option><option value="4">Grid Options</option><option value="5">setGridOptions</option><option value="6">Menu Items</option><option value="7">Ajax Menu</option></select></td><td><input type="textbox" value="100" size="5" id="Grid_Demo[3]"></td><td><input type="hidden" value="INACTIVE" id="Grid_Demo[4]"> <input type="checkbox" value="ACTIVE" id="Grid_Demo[4]"></td></tr>
</tbody></table>
 <input type="submit" id="formsubmit">
</form>
<br><br>
<div class="contentarea2"></div>

 <script>
$("#form").submit(function(e) {
    console.log('Submit Clicked');
    e.preventDefault();
    var $form = $(this);
    var $inputs = $form.find("input, select, button, textarea");
    var postData = $form.serialize();
    request = $.ajax({
        url: "saveform.php",
        type: "POST",
        data: postData
    })
    .done(function(response, textStatus, jqXHR) {
        // do something
        console.log('Submit Done');
    }//return what was found into <div>
    ,function (data) {
                $( ".contentarea2" ).html( data );
            },"html")
    .fail(function(jqHXR, textStatus, errorThrown) {
        console.error('Error: ' + textStatus, errorThrown);

    });
});
</script>

Answer 1

documentation for the .serialize() method说：

仅限＆＃34;成功控制＆＃34;序列化为字符串...要使表单元素的值包含在序列化字符串中，元素必须具有name属性。

您的表单元素没有name="something"属性。给他们一个名字，然后他们就会被提交。

请注意，您不需要$inputs变量（无论如何在设置之后您都不会使用它）。一旦给出了元素名称，postData = $form.serialize()就足够了。

Answer 2

我在另一个问题上以不同的方式提出正确的答案。如上所述，您确实需要名称=＆＃34;某些内容＆＃34;，然后您可以使用普通的PHP表单提交，并将其粘贴在底部。无需进行其他更改。

$('form').on('submit', function(){
    var $this = $(this);
    $.ajax({
        type: $this.prop('method'),
        url: $this.prop('action'),
        data: $this.serialize(),
        success: function(data){
          //do something with the return of the php script
        }
    });
    return false; //prevent the form from causing the page to refresh
});

查找所有表单值并提交

2 个答案: