1

SmartWizard jQuery プラグインを使用して、ウィザードのような ASP.Net MVC アプリケーションを作成します。ユーザーは複数の手順を経てデータを入力します。

[明確にするために編集]

各ステップは部分ビューである必要があります。

ViewModel はすべてのビューに共通です。

public class myViewModel
{
    [Required]
    public int BM { get; set; }

    [Required]
    public int Cylindre { get; set; }        
}

最初の部分ビューにはフィールド BM が表示されます (もちろん、わかりやすくするためにここでは簡略化しています)。

@model MvcApplication3.Models.QuoteViewModel
    <div class="editor-label">
      @Html.LabelFor(model => model.BM)
    </div>
    <div class="editor-field">
      @Html.EditorFor(model => model.BM)
      @Html.ValidationMessageFor(model => model.BM)
 </div>

2 番目の部分ビューには、フィールド Cylindre (上記と同じコード) が表示されます。

メイン ビューは次のようになります。

@model MvcApplication3.Models.QuoteViewModel

@using (Html.BeginForm())
{
@Html.ValidationSummary(true)
<div id="wizard" class="swMain">
    <ul>
        <li><a href="#step-1">
            <label class="stepNumber">
                1</label>
            <span class="stepDesc">Step 1<br />
               </span></a></li>
        <li><a href="#step-2">
            <label class="stepNumber">
                2</label>
            <span class="stepDesc">Step 2<br />
                </span></a></li>
    </ul>

    <div id="step-1">
        <h2 class="StepTitle">
            Step 1 Content</h2>
      
        <!-- step content -->
        @Html.Partial("QuoteStep1", Model)

    </div>
    <div id="step-2">
        <h2 class="StepTitle">
            Step 2 Content</h2>
      
        <!-- step content -->
        @Html.Partial("QuoteStep2", Model)

    </div>
</div>

}

これはすべてうまくいきます。しかし、ご覧のとおり、両方の部分ビューが同時にレンダリングされます。

私がやりたいのは、最初の部分ビューをロードすることです。次に、ユーザーが次のステップに進むと、AJAX 呼び出しを使用して 2 番目の部分ビューがロードされます。

問題は、手順を通じてモデルの状態をどのように維持するかです。

[編集 2 - 新しいバージョン]

AJAX 呼び出しを使用して部分ビューを読み込むことができました。

$('#wizard').smartWizard({ contentURL: '/home/getstep', transitionEffect: 'slideleft', onLeaveStep: leaveAStepCallback, onFinish: onFinishCallback });

そしてコントローラーでは、次のことを行います。

 public ActionResult GetStep()
    {
        ActionResult pv = null;

        switch (Convert.ToInt16(Request["step_number"]))
        {
            case 1:
                pv = PartialView("QuoteStep1");
                break;
            case 2:
                pv = PartialView("QuoteStep2");
                break;
            default:
                break;
        }
        return pv;
    }

今私が抱えている問題は、SmartWizard の次のボタンを押すと、必須フィールドに入力しなくてもコントローラーが実際に押されることです! これは、コンテンツを取得するための ajax 呼び出しの後に SmartWizard プラグインが検証を行っているように見えるためです。

誰かがこの問題に直面したか、ここで何か間違ったことをしていますか?

4

1 に答える 1