FROM要素 と 加えたいパラメーターがある場合の注意点。
勘違いしていてえらい目に合いました・・。
1 2 3 4 |
<form> <input type="input" value="テスト" name="test" /> <input type="button" value="ボタン" name="button" /> </form> |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
$("button").on('click', function() { var $this = $("form"); var id = 1; /* 1 */ var params = $.extend(true, {}, $this.serializeArray(), [{"name":"id", "value": id}]); /* 2 */ var params = $.merge($.merge([], $this.serializeArray()), [{"name":"id", "value": id}]); $.ajax( { type: "POST", url: $this.attr('action'), data: params }).done(function(html) { if (html) { alert('更新しました。'); } else { alert('更新するデータがありませんでした。'); } }); }); |
1 の paramsに代入されるオブジェクトが今回の問題点です。
それぞれをPOSTした場合の値を表示してみると・・。
1 2 3 4 5 6 7 8 9 10 11 12 13 |
/* params 1 */ Array ( [id] => 1 ) /* params 2 */ Array ( [test] => テスト [id] => 1 ) |
配列を結合しようとした場合、
$.extend ・・ 上書き
$.merge ・・ 追加
こうなるんですね。
PHPと同じで $.extendで 配列の場合(添字が数字)は 追加になるもんだと思ってました。
参考URL