2011-01-05 7 views
16

私はいくつかの要素と2つの送信ボタンを持つフォームを持っています。 「削除」ボタンで、jQueryダイアログを使用して、削除したいことを確認しています。そして彼らが確認すれば、私はフォームを提出します。問題はjQuery.submit()が投稿時に元の送信ボタンを含んでいないため、サーバーが同じフォームを使用しているため、保存から削除を区別できません。 jQueryダイアログを削除すると、送信ボタンの値が期待通りに表示されます。これは非常に一般的であり、誰かが解決策を共有できることを望んでいます。私は周りに検索したと有益な何かを見つけることができません(それ私だけですか、Googleが最近吸っている?)任意の助けjQuery submit()にサブミットされたボタンが含まれていません

おかげで...

EDIT:

送信ボタン名前と値を設定してください。

+0

送信ボタンにIDを組み込んで、jQuery /サーバー側のチェックで保存/削除を区別する – benhowdle89

+0

ありがとうございますが、これは問題ではありません。私は送信ボタンの値を持っています。 jquery.submit()を使わないとうまく動作します。 –

+1

この問題は、 'serialize()'メソッドにも存在します。サブミットボタンには通常の属性がすべて設定されていても、認識されません。私はそれらを手動で処理しなければならなかった。 –

答えて

14

karim79の回答に基づいて:

$("input[type=submit], input[type=button], button").click(function(e) { 
    var self= $(this), 
     form = self.closest(form), 
     tempElement = $("<input type='hidden'/>"); 

    // clone the important parts of the button used to submit the form. 
    tempElement 
     .attr("name", this.name) 
     .val(self.val()) 
     .appendTo(form); 

    // boom shakalaka! 
    form.submit(); 

    // we don't want our temp element cluttering up the DOM, do we? 
    tempElement.remove(); 

    // prevent default since we are already submitting the button's form. 
    e.preventDefault(); 
}); 

UPDATE:

私は上記のコードを実現し、あなたが探しているものはおそらくありません:あなたがCであれば

エイリングフォーム要素自体($("form").submit();)あなたはこのようなものが必要になりますに提出:右のフォームが送信される前に、DOMに最初ボタン要素の名前と値を追加します

$("form").submit(function(){ 
    var form = $(this); 
    $("input[type=submit], input[type=button], button", form).eq(0).each(function(){ 
     var self= $(this), 
      tempElement = $("<input type='hidden'/>"); 

     // clone the important parts of the button used to submit the form. 
     tempElement 
      .attr("name", this.name) 
      .val(self.val()) 
      .appendTo(form); 
    }); 
}); 

(私はしませんよデフォルトブラウザの動作がここにあることを確認してください)。これによりDOMからtempElementが削除されないことに注意してください。エラーがあり、フォームが送信されない場合、要素は残っています。これを処理しないと問題が発生します。

+0

良い見えます、私はこれを試してみましょう。助けを賞賛する...時には最も簡単なもの... –

+0

ボタン値を取得するためにサーバー側のrequest.getParameter()を行うことができます – devdar

+1

jQueryの 'submit'はボタンの値を含みません。 –

1

このようなことは、何らかの形で「アクション」パラメータを組み込むことで解決できます。これは、送信者の目的をサーバーに伝えるものです。たとえば、フォームがGET経由で送信されると仮定すると:

$("form :input").click(function() { 
    var $form = $(this).closest("form"); 
    var submitTo = $form.attr("action") + '?action=' + $(this).val(); 
    alert(submitTo); 
    // window.location.href = submitTo; 
    return false; 
}); 

http://jsfiddle.net/karim79/JT3GV/5/

+0

私は郵便で提出しています。それは重要ですか? –

+3

フォームを送信する直前に、「クリックされた」入力ボタンと同じ「名前」の隠れた入力要素を追加してみませんか?その後、隠された入力が提出された後にそれを削除します。そうすれば、フォームはnon-jsとjsの送信に対して同じように動作し、GETまたはPOSTを使用しても同様に動作します。 –

+0

@David Murdoch - 良い提案。私は当初、これらの行に沿って何かを投稿していました。余分なパラメータを使用できることを実証するための簡単な例を提供しました。 – karim79

3

それがクリックされた場合は、ボタンデータのみが提出される提出します。送信ボタンをクリックするのではなく、誰かが入力を押した場合、あなたは運が悪くなります。

フォームから削除ボタンを削除することを強くお勧めします。これは、フォームの情報の大部分(削除するデータレコードのIDのみ)を必要としないため、ボタンに変更してくださいwith type="button")、別のフォームを送信するか、できればそこにリンクを設定します。 (これは削除ページにリンクします - 削除オプションからフォーカスを削除し、誤って削除ボタンをクリックするリスクを減らすため、これは利便性の理由から優れています)

+0

良いアイデア。私は、クリックをして別のフォームを提出することで、異なるフォームルートに行きましたが、これを一般化しようとするといくつかの問題に遭遇しました。私はダイアログがあるので、私は(これ).closest( "フォーム")を使っていて、それを送信していました。これは、ボタンが独自のフォームに含まれていた場合に効果的でした。しかし、いったん標準形式に組み込むと、間違った形式を提出していたので動作しませんでした。 Re:別のページに削除します。それは私にとって理にかなっていますが、この場合はユーザーはそれに向かないでしょう。彼らは余分なステップを避けたい。 –

+0

私はあなたが別のページで削除機能を持っている必要が示唆されていません。同じページ、フォームの外にあるか、またはリンクを使用して削除することができます(削除を実行するページにユーザーをリダイレクトします)。 「一般化」の問題は何ですか? (私があなたが意味するものは分かりません) – Sebastian

+0

私が一般化することは、削除の確認を処理してフォームを提出する集中化された場所があることです。したがって、general.jsファイルでは、deleteConfirmationクラスを持つボタンのclickイベントをフックします。私は自分のフォームにボタンを移動し、私は他のボタンの隣にそれを整列させるためにCSSを使用しようとしています –

関連する問題