0

Ajax.BeginForm強く型付けされたビューで使用しています。このフォーム内には、独自のモデルとエディター テンプレートを使用するモデル プロパティを保持するいくつかのパネルがあります。最後にAjaxを使用してモデル全体をサーバーに投稿したいのですが、その前にパネルからパネルへと移動し、別のパネルに進む前にそれぞれを検証する必要があります。

[次へ] ボタンをクリックしたときに、各パネルと各モデル プロパティの部分的な (サーバー側の) 検証 (コントローラー アクションで) を行うにはどうすればよいですか?

各 [次へ] ボタンをクリックしたときに何らかの方法でコントローラー アクションを呼び出すことはできますか? また、検証している特定のタブの値を渡すにはどうすればよいですか? ページを更新する必要はありません。

モデル:

public class OrderItem
{
    public int ItemId { get; set; }
    public ItemBasic BasicDetails { get; set; }
    public ItemSpecifics Specification { get; set; }
}

public class ItemBasic
{
    [Required]
    public string Type { get; set; }

    [Required]
    [StringLength(30)]
    public string SerialNumber { get; set; }
}

景色:

@model OrderItem

@Ajax.BeginForm(...)
{
    @Html.AntiForgeryToken()
    @Html.HiddenFor(x => x.ItemId)
    <div class="tab">
        @Html.EditorFor(x => x.ItemBasics)
        <input type="button" value="Next" />
    </div>
    <div class="tab">
        @Html.EditorFor(x => x.ItemSpecifics)
        <input type="button" value="Next" />
    </div>
    <input type="submit" value="Add to order" />
}

ページ全体はそれよりもはるかに複雑です。この質問のために単純化しました。

以前は、(エディター テンプレートの代わりに) 各プロパティに PartialViews を使用していましたが、PartialView を使用すると、最後にフォームを投稿するときに、親モデルがプロパティ モデルを表示できません。

また、フィールドでのユーザー入力/選択に応じて、いくつかのパネルにさらにデータをロードする必要があり、それをサーバーからロードする必要があるため、本質的に、特定のフィールドでアクションを呼び出し、アクション結果を他のフィールドに入力する必要があります。

例えば。アイテム固有のパネルで、ユーザーがモデルの List プロパティにいくつかのアイテムを追加すると、それらはパネル内の行のリストとして表示され、コントローラー アクションを呼び出してそれぞれを編集または削除できます。

アクションをPartialView実行したところ、リストに新しいアイテムを追加するユーザー入力が追加され、パネルに追加されたアイテムのリストのみを表示する特定のパネルに関してモデルItemSpecific全体が返されました。ItemSpecificsPartialViewResultItemSpecific

public class ItemSpecifics
{
    public string Name { get; set; }
    public string Description { get; set;}
    public string Ref { get; set;}
    public IEnumerable<ItemSpecifics> Items { get; set;}
}
4

2 に答える 2

0

最も簡単な方法は、クライアントの検証に JavaScript を使用し、バックエンドの POST アクションで、送信されたモデルを検証するためのカスタム ロジックを使用することです。

別の方法は、部分ビューを使用して元のアプローチに戻ることですが、フォームに Razor ヘルパーを使用する代わりに、必要な入力フィールドに対して通常の jquery post ($ajax({...})) を実行します。

于 2015-07-20T08:07:47.940 に答える
0

サーバー上で分離された各パネルを検証するのは複雑であるため、最も簡単な方法は、クライアント側で Java スクリプトを使用して検証を行うことです。ただし、サーバー側で検証を行い、コントローラーでチェックを実行できます。値が検証に合格しない場合は、一致するエラー メッセージを含む json 結果を返すことができます。

この回答が何らかの形であなたに役立つことを願っています

サーバー側の検証については、次のようなものを試してください。

if(validation one == false)
{
    errorList.Add("validation one error");
}
if(validation two == false)
{
    errorList.Add("validation two error");
}
if(validation three == false)
{
    errorList.Add("validation three error");
}
if(errorList.Any)
{
    return JsonReturn(false, "you failed");
}
return JsonReturn(true, "success!");
于 2015-07-17T09:35:55.047 に答える