jQuery-送信時にパラメーターを追加します(ajaxではありません)


206

jQueryの「送信」を使用しています-フォームに追加のパラメーターを渡す方法はありますか?私はこれをAjaxで行うつもりはありません。これは通常の更新の典型的なフォーム送信です。

$('#submit').click(function () {
    $('#event').submit(function () {
        data: { 
        form['attendees'] = $('#attendance').sortable('toArray').toString();
    });
});

どのサーバー側のテクノロジーを使用していますか?
Enrique

送信する前にシリアル化されたフォームに追加する私の回答[ここ] [1]を参照してください。[1]:stackoverflow.com/questions/17809056/...
ジェフ・ロウリー

回答:


371

これは私のためにそれをしました:

var input = $("<input>")
               .attr("type", "hidden")
               .attr("name", "mydata").val("bla");
$('#form1').append(input);

ダフの回答に基づいていますが、NAMEコレクションを追加してフォームコレクションに表示し、VALUEをVALに変更しました。FORMのID(私の場合はform1)も確認しました

Firefoxファイアバグを使用して、要素が挿入されたかどうかを確認しました。

非表示の要素はフォームコレクションにポストバックされ、読み取り専用フィールドのみが破棄されます。

ミシェル


46
「あなたは私の太陽です」をバイナリで歌うにはどうすればよいですか?どうもありがとうございます。これは非常に多くのことを解決します。
シエル、

38
読みやすさを少し改善できます:var input = $( "<input>"、{type: "hidden"、name: "mydata"、value: "bla"}); $( '#form1')。append($(input));
Konstantine Kalbazov 2013

2
$( "<input>")。attr( "type"、 "hidden")。attr( "name"、 "mydata")。val( "bla")。appendTo( '#form1'); もう1つの方法
キエフ

6
$( "<input>"、{type: "hidden"、name: "mydata"、value: "bla"})。appendTo( "#form1");の組み合わせが好きです。
gabeio 2016

データサイズに制限はありませんか?JSON.stringify(obj)とこのメソッドを使用していくつかの大きなオブジェクトを送信しましたが、切り捨てられたようです。
omikron

26

あなたの場合、別の非表示フィールドをフォームに動的に追加するだけで十分です。

var input = $("<input>").attr("type", "hidden").val("Bla");
$('#form').append($(input));

提出する必要があるデータがフォームに対応していません。サーバー側でキャプチャして処理する必要があります。
シエル

「フォーム非対応」とはどういう意味ですか?
Vincent Ramdhanie 2010年

すみません-これはまったく機能しませんでした。データを強制しただけでも、フォームに挿入されません。
Ciel

フォームフィールドには配置できません。
Ciel

2
文字列の場合、フォームフィールドに入力できます
PetersenDidIt

19

これも使えます。私にとってはうまくいった

$("#registerform").attr("action", "register.php?btnsubmit=Save") 
$('#registerform').submit();

これにより、btnsubmit = GET値として保存してregister.phpフォームに送信されます。


これはよりエレガントなソリューションのようです。encodeURIComponent()データのタイプに応じて、パラメータ値に使用することを忘れないでください。
Andres SK

1
これは、ユーザーがフォームを複数回送信できるようにする場合に実際に優れています。フォームは、異なる値を持つ複数の非表示フィールドを取得しません。
Mellon

11

非表示フィールドをフォームに追加できるjQuery関数を作成できます。

// This must be applied to a form (or an object inside a form).
jQuery.fn.addHidden = function (name, value) {
    return this.each(function () {
        var input = $("<input>").attr("type", "hidden").attr("name", name).val(value);
        $(this).append($(input));
    });
};

送信する前に非表示フィールドを追加します。

var frm = $("#form").addHidden('SaveAndReturn', 'Save and Return')
                    .submit();

1
addHiddenのより高度なバージョンについては、stackoverflow.com / questions / 2601223 /…を参照してください
Jonathan

1
このソリューションのシンプルさが気に入っています。それは多くのケースを処理しませんが、うまく処理するケースをうまく処理します。
Phil

11

送信ボタンをクリックして送信イベントをバインドする必要はありません。送信イベントをバインドするだけで、トリガー方法に関係なく送信イベントをキャプチャします。

あなたが望んでいるのは、ajax経由で行うのと同じように、ソータブルを送信することです。次のようなことを試してください:

var form = $('#event').submit(function () {
    $.each($('#attendance').sortable('toArray'),function(i, value){
        $("<input>").attr({
            'type':'hidden',
            'name':'attendace['+i+']'
        }).val(value).appendTo(form);
    });
});

まだサーバー側のformcollectionに表示されていません...非表示のフィールドをサーバーに表示するために私がしなければならない特別なことはありますか?これは、FormCollectionオブジェクトを使用してC#/ ASP.NET MVCを通過します。
Ciel

私の答えを更新しました、私があなたがやろうとしていることを理解していると思います。
PetersenDidIt

name生成された非表示フォーム入力に属性を追加していますか?あたりとしてstackoverflow.com/questions/504681/... FormCollectionオブジェクトは、すべての必要のように見える<input>の名前を持っている要素を。
npdoty 2010年

はい、ソート可能なものをコンマ区切り値の文字列としてformcollectionにプッシュしようとしています。更新を試しましたが、まだ投稿されません。私は何が間違っているのかわかりません...私は助けに感謝します。
Ciel

問題はクライアント側ではなくサーバー側にあるようです。
PetersenDidIt

2

同様の答えですが、簡単/迅速なテストで利用できるようにしたかっただけです。

var input = $("<input>")
               .attr("name", "mydata").val("go Rafa!");

$('#easy_test').append(input);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script>



<form id="easy_test">
  
</form>

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.