使用jQuery AJAX通過PHP將表單數組傳遞給Javascript

Question

我正在通過AJAX提交表單並使用jQuery ，我需要了解如何將form arrays傳遞給它。

例如，我的html是這樣的：

<input id="standard_field" type="text" name="standard_name">
<input id="some_id_1" type="text" name="my_array[my_name_1]">
<input id="some_id_2" type="text" name="my_array[my_name_2]">
<input id="some_id_3" type="text" name="my_array[my_name_3]">

現在，我知道您可以使用類似以下方法輕松獲取jQuery中標准字段的名稱：

var foo = $('standard_field').val();

但是我不確定如何獲取數組數據？ 同樣，它需要從ajax傳遞到PHP腳本，其方式與PHP腳本獲得它的方式完全相同，就好像表單是在沒有 ajax的情況下提交的。

因此，我通常如何傳遞數據的示例：

var foo = $('standard_field').val();

var loadUrl = "some_script.php";
var dataObject = { foo: foo };    

getAjaxData(loadUrl, dataObject, 'POST', 'json')

    .done(function(response) {
        //..........
    })

    .fail(function() {
        //......
    });

// End  

function getAjaxData(loadUrl, dataObject, action, type) {

    return jQuery.ajax({
        type: action,
        url: loadUrl,
        data: dataObject,
        dataType: type
    });    

}

因此，首先我如何才能從表單傳遞數據，其次我如何才能將其從jQuery傳遞給PHP腳本，這樣PHP就可以像直接將POST傳遞到PHP腳本一樣將其作為數組來獲取？

Answer 1

您應該使用serialize

HTML：

<form id="form1" action="" method="post">
    <input id="standard_field" type="text" name="standard_name">
    <input id="some_id_1" type="text" name="my_array[my_name_1]">
    <input id="some_id_2" type="text" name="my_array[my_name_2]">
    <input id="some_id_3" type="text" name="my_array[my_name_3]">
</form>

JS：

var dataObject = $('#form1').serialize();
var loadUrl = "some_script.php";

getAjaxData(loadUrl, dataObject, 'POST', 'json')

    .done(function(response) {
        //..........
    })

    .fail(function() {
        //......
    });

// End  

function getAjaxData(loadUrl, dataObject, action, type) {

    return jQuery.ajax({
        type: action,
        url: loadUrl,
        data: dataObject,
        dataType: type
    });    

}

Answer 2

您可以使用此插件http://malsup.com/jquery/form/

示例代碼：

JS：

$('#your_button').change(function() {
    var options = {
        url: 'your_url',
        type: 'POST',
        dataType: 'json',
        beforeSubmit: function() {
            //  Callback function to be invoked before the form is submitted
        },
        success: function(data) {
            //  Callback function to be invoked after the form has been submitted
        },
        error: function() {
            //  Callback function to be invoked upon error
        }
    };

    //  do something
});

PHP：

var_dump($_POST);

Answer 3

您可以使用String.slice方法提取標簽名稱。

var input = $('#myform input');
var data = [];
var name, label, value = '';
for(var i in input) {
    name = input.eq(i).attr('name');
    label = name.splice(9, -1);
    value = input.eq(i).val();
    data[label] = value;
}
data = JSON.stringify(data);

為了檢測何時是數組，您可以使用String.indexOf（'['）

對於未知的數組結構：

array_name = name.splice(0, name.indexOf('['));
label = name.splice(name.indexOf('['), name.indexOf(']'));