-1

我想使用 jQuery 使用 AJAX 发布 JSON 和 HTML 代码。它使用输入数组。

我的 HTML

<table width="200" border="1">
    <tr>
        <td>table</td>
        <td>
            <input name="table[]" type="text" id="table[]" value="5" />
        </td>
    </tr>
    <tr>
        <td>menu</td>
        <td><input name="menu[]" type="text" id="menu[]" value="noodle" /></td>
    </tr>
    <tr>
        <td>number</td>
        <td><input name="number[]" type="text" id="number[]" value="1" /></td>
    </tr>
    <tr>
        <td>note</td>
        <td><input name="note[]" type="text" id="note[]" value="no " /></td>
    </tr>
    <tr>
        <td>table</td>
        <td><input name="table[]" type="text" id="table[]" value="1" /></td>
    </tr>
    <tr>
        <td>menu</td>
        <td><input name="menu[]" type="text" id="menu[]" value="beer" /></td>
    </tr>
    <tr>
        <td>number</td>
        <td><input name="number[]" type="text" id="number[]" value="2" /></td>
    </tr>
    <tr>
        <td>note</td>
        <td><input name="note[]" type="text" id="note[]" value="-" /></td>
    </tr>
</table>
<button id="save-menu">menu</button>
<button id="cal">cal</button>

查询。我已经编写了 jQuery 代码，但它不会发送数组中的所有值。

$('#save-menu').click(function () {
    $.post('menu/order', {
        'table': $('select#workplace-table').val(),
        'mid[]': $('input#order-mid').val(),
        'number[]': $('input#order-number').val(),
        'note[]': $('input#order-note').val(),
    });
});

$('#cal').click(function () {
    $.post('cal', {
        'table': $('select#workplace-table').val(),
        'mid[]': $('input#order-mid').val(),
        'number[]': $('input#order-number').val(),
    });
});

如何修复这个 jQuery 代码？

4

2 回答 2

0

兄弟！！就是这么简单。您需要将您的表格包装在一个表单中，并使用很棒的 jQuery 让一切变得甜蜜：

您可以检查以下工作代码：

Html 和 jQuery 代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src='http://code.jquery.com/jquery-latest.min.js' type='text/javascript'></script>
<script type="text/javascript">    
$(function () {
    $('#form').submit(function () {
        console.log($('#form').serializeArray());       
            $.post('ajaxtest.php', $('#form').serializeArray(), function(d){
                console.log(d);
            }); 
        return false;
    });
});
</script>
<title>Form</title>
</head>
<body>
<form name="myForm" method="post"  id='form'>
    <table width="200" border="1">
    <tr>
        <td>table</td>
        <td>
            <input name="table[]" type="text" id="table[]" value="5" />
        </td>
    </tr>
    <tr>
        <td>menu</td>
        <td><input name="menu[]" type="text" id="menu[]" value="noodle" /></td>
    </tr>
    <tr>
        <td>number</td>
        <td><input name="number[]" type="text" id="number[]" value="1" /></td>
    </tr>
    <tr>
        <td>note</td>
        <td><input name="note[]" type="text" id="note[]" value="no " /></td>
    </tr>
    <tr>
        <td>table</td>
        <td><input name="table[]" type="text" id="table[]" value="1" /></td>
    </tr>
    <tr>
        <td>menu</td>
        <td><input name="menu[]" type="text" id="menu[]" value="beer" /></td>
    </tr>
    <tr>
        <td>number</td>
        <td><input name="number[]" type="text" id="number[]" value="2" /></td>
    </tr>
    <tr>
        <td>note</td>
        <td><input name="note[]" type="text" id="note[]" value="-" /></td>
    </tr>
</table>    
<input type="submit" value="Submit">
</form>
</body>
</html>

发送 JSON 数据：

[
Object { name="table[]", value="5"}, 
Object { name="menu[]", value="noodle"}, 
Object { name="number[]", value="1"}, 
Object { name="note[]", value="no "}, 
Object { name="table[]", value="1"}, 
Object { name="menu[]", value="beer"}, 
Object { name="number[]", value="2"}, 
Object { name="note[]", value="-"}
]

Ajax 响应数据：

Array
(
    [table] => Array
        (
            [0] => 5
            [1] => 1
        )

    [menu] => Array
        (
            [0] => noodle
            [1] => beer
        )

    [number] => Array
        (
            [0] => 1
            [1] => 2
        )

    [note] => Array
        (
            [0] => no 
            [1] => -
        )

)

ajaxtest.php 代码：

print_r($_POST);
于 2013-11-07T10:58:53.417 回答
0

把你的表格放在表格之间并序列化它

参考

serializeArray => http://api.jquery.com/serializeArray/

序列化 => http://api.jquery.com/serialize/

于 2013-11-07T10:46:23.130 回答