web-dev-qa-db-ja.com

ノックアウト+ mvc 3+検証

コントローラで、モデルのクライアント検証ルールにアクセスできるようにしたいと思います。データアノテーションを使用していくつかの属性を添付しましたが、ajax呼び出しを介してクライアントに何かを返し、jquery検証オプションを自動的に構築できるようにしたいと考えています。

通常、これは目立たないもので無料で行われますが、サーバーとクライアントの両方で検証ルールを複製する必要がなく、ノックアウトバインディングを活用しようとしています。

モデルサーバー側でリフレクションを使用しないと、これを実現する方法が少しわかりません。

asp.net-mvcasp.net-mvc-3jquery-validateknockout.js
44
RubbleFord

私の Mvc Controls Toolkit では、ノックアウトライブラリに基づいてヘルパーを開発しました。これらのヘルパーは、ノックアウトコードの記述を支援するだけでなく、控えめな検証とグローバリゼーションによってノックアウトライブラリを強化します。さらに、バインディングメカニズムが拡張され、DatetimePickerなどの複雑なコントロールやその他の「複雑な」（さまざまなhtmlパーツで作成された）コントロールが含まれるようになりました。

最後に、ノックアウトテンプレートはRazorヘルパーを介して定義できます。

ドキュメントを参照してください ここ 、 ここ 、 ここ および ここ 。ヘルパーを使用して高度な機能を実装する方法を示すチュートリアルもいくつかあります。

Mvc Controls Toolkitのクライアント側テンプレートを使用した低帯域幅転送

クライアント側のテンプレートを使用した大量のデータの処理

クライアント側テンプレート2を使用した大量のデータの処理

26
Francesco Abbruzzese

正確に何をする必要があるかに応じて、 Breeze js が最善の解決策になります。特に、EFを使用している場合は、サーバーEFのDbContextの機能のほとんどをクライアント側で複製できます。これには、もちろん検証だけでなく、変更の追跡も含まれます。.saveChanges、 LINQクエリ、キャッシュ、シリアル化、逆シリアル化に似た単純な構文で、オフラインでの作業を可能にします。

Breezejsを使用するための基本的な手順は次のとおりです。

  • サーバーでEFモデルを作成する
  • サーバーにNuGetパッケージを追加して、モデルをクライアント側に公開するWebAPIサービスを作成します。これは、驚くほど少ない数のC＃コードで実行されます。これが行うことの1つは、メタデータを公開することです。オブジェクトの定義、関係、およびデータ注釈の検証情報などの追加情報です。
  • クライアント側でEFの動作を複製するために使用されるクライアント側のjsNugetパッケージを追加します。

もちろん、サーバーのすべての機能がクライアントに複製されるわけではありませんが、多くのことができます。

  • クライアント側で新しいエンティティを作成する
  • クライアント側でクエリを実行します。これはサーバーで実行され、クライアントに返されます。
  • クライアント上のエンティティの変更：作成、変更、削除...
  • クライアント側でリレーションを作成します。たとえば、親オブジェクトに新しいchlidエンティティを作成します。
  • クライアント側でsaveChangesを呼び出します。これにより、追跡されたすべての変更がサーバーに転送され、バックエンドが更新されます。
  • もちろん、これを実行している間は、クライアントの自動検証と、.saveChangesを呼び出すたびに追加のサーバー検証が行われます。

最後に、サーバーコードを拡張および変更して、ビジネスロジックを含めることができるため、EFモデルをクライアントに公開するだけでは不十分です。

1
JotaBe

それはかなりの作業です。それぞれのデータ型変換などを使用して、C＃コードをJavascriptに変換できるようにする必要があります。サーバー側とクライアント側の両方で2つの別々の検証セットを書き留めたほうがよいでしょう。独自の変換フレームワークをすべて自分で作成して維持するよりも、維持する方がはるかに簡単です。

0
neebz

モデルで、必要な属性検証を使用します。

 public class ModelWithValidation
 {
    public int Id { get; set; }

    [Required]
    public string Name { get; set; }
 }

Mvcフォームで

@using( Html.BeginForm())
{    
     @Html.TextBoxFor(m => m.Name, new {data_bind = "value: name"})
     @Html.ValidationMessageFor(m => m.Name)
}

JQueryテストで、フォームがonSubmitで有効かどうか、またはノックアウト保存関数で次のコードを呼び出して入力を検証します。 jQuery.unobtrusive *およびjQuery.validate *ライブラリを含める必要があります。サーバー側でも入力を検証することを忘れないでください！

var form = $("form");
form.removeData('validator');
form.removeData('unobtrusiveValidation');
$.validator.unobtrusive.parse(form);

$("form").valid() //true false
0
Jernej Novak