2009-07-15 17 views
6

JQueryを使用して4段階のサインアッププロセス間を移動するナビゲーションバーがあります。フォームを投稿してアクションにリダイレクトするASP.NET MVC

しかし、すべてがJSが無効になっていることを確認する必要があります。

ページの下部にこれらの4つのリンクイメージがあり、クリックすると現在のアクションに投稿されるので、すべてのフォームデータを保存して次の段階にリダイレクトできるようにする必要があります。

リダイレクトは、ルートまたはフォームでパラメータを渡すだけで十分ですが、アクションリンクを使用してメソッドを投稿する方法はわかりません。

イメージの背景などに異なるクラスの4つの異なる送信ボタンを置くことができましたが、これは間違っています。

アイデア?

答えて

2

をあなたの上に複数の送信ボタンを持つことができます形式:

<input type="submit" name="step1" value="Step 1"/> 
<input type="submit" name="step2" value="Step 2"/> 
<input type="submit" name="step3" value="Step 3"/> 

とあなたのアクションで:

public ActionResult Action(FormCollection form) 
{ 
    if (!string.IsNullOrEmpty(form["step1"])) 
    { 
     // Step 1 button was clicked 
    } 
    else if (!string.IsNullOrEmpty(form["step2"])) 
    { 
     // Step 2 button was clicked 
    } 
    else if (!string.IsNullOrEmpty(form["step3"])) 
    { 
     // Step 3 button was clicked 
    } 
    ... 
} 
3

Javascriptを使用しないと、単純なリンクはPOST経由で送信できません。それを行うには、送信ボタンを使用する必要があります。幸いなことに、HTMLは、画像投稿ボタンを行う簡単な方法を提供します:

<input type="image" src="http://url/to/image" alt="Step 1" id="btnStep1" /> 

あなたはいつものJavascript可能なため取り扱いにjQueryを追加することができます。

$('#btnStep1').click(function(){...}); 
+0

私は4つの送信ボタンでフォームを持っているように見える。 どうすればどのボタンがクリックされたのか知ることができますか? – ddd

+1

ボタンに名前と値を渡すと、他のフォーム入力と同じように渡されます。 btnStep1 = 1。 – tghw

2

the netにある属性を使用して、同じフォーム上の複数のボタンを処理できます。これにより、コントローラー上で実行されるアクションが決定されます。コントローラには4つのアクションがあり、呼び出された場所に関係なくクリックされたボタンに応じて正しいアクションが実行されます。

少しの例です。コントローラでのその後のマークアップ...

<input type="submit" name="action" value="step1"/> 
<input type="submit" name="action" value="step2"/> 
<input type="submit" name="action" value="step3"/> 
<input type="submit" name="action" value="step4"/> 

...

[HttpPost] 
    [MultiButton(MatchFormKey = "action", MatchFormValue = "step1")] 
    public ActionResult Step1(/* parameters */) { ... } 

    [HttpPost] 
    [MultiButton(MatchFormKey = "action", MatchFormValue = "step2")] 
    public ActionResult Step2(/* parameters */) { ... } 

    [HttpPost] 
    [MultiButton(MatchFormKey = "action", MatchFormValue = "step3")] 
    public ActionResult Step3(/* parameters */) { ... } 

    [HttpPost] 
    [MultiButton(MatchFormKey = "action", MatchFormValue = "step4")] 
    public ActionResult Step4(/* parameters */) { ... } 

検証が行われ、あなたが各を通じて行ってきた、おそらく一度あなたはその後、(サインアッププロセスの任意のステップの間でクリックすることができます最初に)比較的簡単に。

これは誰かを助けることを望みます。私はちょうど日付の後の質問をクロックしたが、とにかくこれを投稿すると思った:-)

関連する問題