1

こんにちは、 Validateの submitHandler内で ajax を使用してフォームを送信しようとしています。複数の選択を美化するChosenライブラリも使用しています。以下の作品：

submitHandler: function(form) {
    var     form = $(this.currentForm);

    var     data = {
        first_name    : form.find('#first_name').attr('value'),
        last_name     : form.find('#last_name').attr('value'),
        chosen_people : form.find('#chosen_people').val(),
    };

    $.ajax({
        type : "POST",
        url : "formhandler.php",
        data : data,
        success : function(response) {
            console.log(response);
        }
    });
}

サーバーの応答:

array(
    ['first_name'] => 'John'
    ['last_name'] => 'Smith'
    ['chosen_people'] => array(
        [0] => 37
        [1] => 42
    )
)

問題は、フォームが大きくて頻繁に変更されるため、すべての入力要素と選択要素を列挙し続ける必要がないことです。私はちょうど次のようなことを言いたい:

var     inputs = form.find('input').serializeArray();
var     selects = form.find('.chzn-select').val();
var     data = $.merge(inputs, selects );

...

次のような手動で入力することのすべての組み合わせを試しました。

for(var select in selects)
    selects[select] = {'name' : select, 'value' : selects[select]};

var     serializedSelects = {'name' : 'chosen_people', 'value' : selects };
var     data = $.merge(inputs, serializedSelects);

しかし、サーバーがポスト変数に正しい配列構造を持つように、配列を適切にネストすることはできません。

問題の要点は、jQuery は要素に対して $.serializeArray() を提供しますが、連想配列を取得してそれをシリアル化された配列に変換する $.paramArray() のようなものを提供しないことです。出力できるのはシリアル化された文字列のみであり、これ以上の操作は困難です。別の ajax フレームワークを含めたくないので、簡単な解決策があることを願っています。

PS私はphp5とjQuery 1.8.3を使用しています。これが私がこれまでに見つけたものです。おそらく、追加しようとする前にselects配列のフォーマットを台無しにしているだけです:

jQuery post() でシリアライズと追加データを使用

JavaScript連想配列をシリアライズするには?

Jquery.SerializeArrayにパラメータを追加する方法は?

ありがとう！

4

2 に答える 2

2

必要なのは、メイン フォーム自体をシリアル化することです。

$('form').submit(function() {
  var data = $(this).serialize();
  e.preventDefault();
$.ajax({
    type : "POST",
    url : "formhandler.php",
    data : data,
    success : function(response) {
        console.log(response);
    }
});
});
于 2013-01-10T20:45:51.673 に答える
0

なぜこれが私にとって非常に苦痛だったのかはわかりませんが、最終的に配列を ajax 用にフォーマットする方法を見つけました。配列が urlencoded される方法は私を投げました..深い入れ子が本当に普遍的にサポートされているかどうかはわかりません。ajax が取得できる配列データのさまざまなバージョンを次に示します。

var     associativeData = {'first_name' : 'John', 'last_name' : 'Smith', 'chosen_people' : Array('37', '42')};
var     nameValueData = Array(
    {'name' : 'first_name', 'value' : 'John'},
    {'name' : 'last_name', 'value' : 'Smith'},
    {'name' : 'chosen_people[0]', 'value' : 37},
    {'name' : 'chosen_people[1]', 'value' : 42}
);
var     serializedData = "first_name=John&last_name=Smith&chosen_people[]=37&chosen_people[]=42"

そして、これが私が自分の配列を追加するために働いたものです。if(values) 行はオプションですが、それがないと、else ケースが起動しないため、何も選択されていない場合、サーバーで selected_people 変数をまったく取得しません。

var     data = form.find('input').serializeArray();
var     values = form.find('#chosen_people').val();
if(values)
for(var value in values)
    data.push({'name' : 'chosen_people[' + value + ']', 'value' : values[value]});
else
    data.push({'name' : 'chosen_people[]', 'value' : ''});

誰かに役立つことを期待して、この回答を投稿するだけです。

于 2013-01-10T23:54:36.420 に答える