SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

実例で学ぶASP.NET 4.5 Webフォーム 新機能活用法

ASP.NET 4.5の「モデル検証」を活用する

実例で学ぶASP.NET 4.5 Webフォーム 新機能活用法 第4回

  • X ポスト
  • このエントリーをはてなブックマークに追加

データバインドコントロールでモデル検証を有効にする

 次に、モデル検証を使用したいデータバインドコントロールでモデル検証を有効にするため、EnableModelValidationプロパティにtrueを設定します(リスト2)。

リスト2 場所追加処理でモデル検証を有効にする(LocationsAdd.aspx)
<asp:FormView ID="LocationsFormView" runat="server"
  DefaultMode="Insert" ItemType="MRRS.Entity.Location"
  InsertMethod="InsertLocation" EnableModelValidation="true">

 なお、モデル検証の結果を表示するため、ページにはValidationSummaryコントロールも追加しておきましょう(リスト3)。

リスト3 モデル検証結果表示用ValidationSummaryコントロール追加(LocationsAdd.aspx)
<asp:HyperLink ID="BackHyperLink" runat="server"
  NavigateUrl="Locations.aspx">戻る</asp:HyperLink>
<asp:ValidationSummary ID="ValidationSummary1" runat="server" ForeColor="Red" />

モデルバインドで実行されるCRUD処理のなかで、検証結果を判定する

 最後に、モデル検証の検証結果を追加処理の中で判定し、エラーがあれば処理を中断するようにします(リスト4)。

リスト4 モデル検証結果判定処理(LocationsAdd.aspx.cs)
// 登録処理
public void InsertLocation(Location location)
{
  …(中略)…

  // モデル検証でエラーがあれば処理中断
  if (!ModelState.IsValid) return;

  // ビジネスロジックの追加処理実行
  var logic = new LocationLogic();
  logic.Insert(location);

  // 場所参照画面に戻る
  Response.Redirect("~/Locations.aspx");
}

 検証結果判定には、Page.ModelStateプロパティのIsValidプロパティを使います。モデル検証の中で1つでもエラーがあると、このプロパティはfalseを返します。

 なお、ModelStateプロパティは、前回の『ASP.NET 4.5の「モデルバインド」を活用するでも少し登場しましたが、その役割はモデル検証の検証結果を判定するというものでした。そして前回記事のとおり、AddModelErrorメソッドを使うことで、独自にモデル検証のエラーを追加することもできます。

モデル検証の動作確認

 以上でもっともシンプルな形でのモデル検証の実装が終わりました。実際に動作させてみましょう。

 まず、場所新規入力画面を開き、場所名が空のまま追加ボタンを押してみましょう(図3)。

図3:場所名空での追加処理実行
図3:場所名空での追加処理実行

 すると、サーバーサイドで検証処理が行われ、場所名の必須入力エラーが表示されます(図4)。

図4:場所名必須入力エラー表示
図4:場所名必須入力エラー表示

ASP.NET Dynamic Dataを用いたクライアントサイド検証

 ここまででモデル検証を使った検証処理を見てきましたが、実は重大な問題があります。それは、このままではクライアントサイド検証が行われないことです。検証コントロールを使った場合は、クライアントサイド検証とサーバーサイド検証がともに行われますが、これまでの手順だけだと、モデル検証ではサーバーサイド検証しか行われないのです。

 ではどうすればよいのかというと、「ASP.NET Dynamic Data」(以下Dynamic Data)と組み合わせる、がその答えです。

 Dynamic Dataとは、データベースの構造を表すモデルクラスを元に、自動的にそのデータを扱う画面を生成する機能です。そのDynamic Dataの機能の一部を使うことで、モデルのフィールドの型と検証属性により、自動的にクライアントサイド検証処理を行うよう、検証サーバーコントロールが実行時に自動生成されます。

Dynamic Dataを用いた例

 実際に場所編集画面で実装した例を見てみましょう(リスト5)。場所編集画面では、Dynamic Dataの機能の一部である「Dynamicコントロール」を使っています。

リスト5 Dynamicコントロールを使用(LocationsDetail.aspx)
<EditItemTemplate>
  <p>
    場所名 :
    <asp:DynamicControl ID="LocationNameDynamicControl" runat="server"
      DataField="LocationName" Mode="Edit" />
  </p>
  …(中略)…
</EditItemTemplate>

 Dynamicコントロールでは、DataFieldプロパティにバインド先のプロパティ名を指定する必要があります。また、本画面は編集画面なので、ModeプロパティにはEditを指定します。他にもInsert、ReadOnlyが選べ、それぞれ追加処理用、表示用の形式が選べます。以上の2つのプロパティを指定することで、バインド先プロパティの型、検証属性に応じて、テキストボックスなどの入力項目と検証検証コントロールを実行時に自動的に生成してくれます。

Dynamic Dataを用いた実行結果

 それでは、実際に実行してみましょう。先ほどと同様に、今度は編集画面で場所名を空にして「更新」ボタンをクリックしてみます。すると、サーバーサイドには処理が映らずに、クライアントサイド検証によってエラーが表示されます(図5)。

図5:場所名必須入力エラー表示(クライアントサイド検証)
図5:場所名必須入力エラー表示(クライアントサイド検証)

 この時表示されるエラーメッセージは、リスト1でLocationクラスのLocationプロパティに設定したメッセージです。また、エラーとなった項目の脇には"*"によるマークも付きます。

 なお、今回はDynamicコントロールを使いましたが、FormViewコントロールではなくDetailsViewコントロールを使用する場合、DynamicFieldクラスが使えますので、興味がある方は試してみてください。また、Dynamic Dataはその動作をカスタマイズすることができます。詳しくは『ASP.NET Dynamic Dataのカスタマイズのポイントを知ろう!』などの記事を参照してください。

次のページ
複雑な画面のモデル検証

この記事は参考になりましたか?

  • X ポスト
  • このエントリーをはてなブックマークに追加
実例で学ぶASP.NET 4.5 Webフォーム 新機能活用法連載記事一覧

もっと読む

この記事の著者

山田 祥寛(ヤマダ ヨシヒロ)

静岡県榛原町生まれ。一橋大学経済学部卒業後、NECにてシステム企画業務に携わるが、2003年4月に念願かなってフリーライターに転身。Microsoft MVP for Visual Studio and Development Technologies。執筆コミュニティ「WINGSプロジェクト」代表。主な著書に「独習シリーズ(Java・C#・Python・PHP・Ruby・JSP&サーブレットなど)」「速習シリーズ(ASP.NET Core・Vue.js・React・TypeScript・ECMAScript、Laravelなど)」「改訂3版JavaScript本格入門」「これからはじめるReact実践入門」「はじめてのAndroidアプリ開発 Kotlin編 」他、著書多数

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

WINGSプロジェクト 高野 将(タカノ ショウ)

<個人紹介>新潟県長岡市在住の在宅リモートワークプログラマー。家事や育児、仕事の合間に長岡IT開発者勉強会(NDS)、Niigata.NET、TDDBCなどのコミュニティに関わったり、Web記事や書籍などの執筆を行ったりしている。著書に『アプリを作ろう! Visual C#入門 Visual C# 2017対応』(日経BP社、2017)など。<WINGSプロジェクトについて>有限会社 WINGSプロジェクトが運営する、テクニカル執筆コミュニティ(代表 山田祥寛)。主にWeb開発分野の書籍/記事執筆、翻訳、講演等を幅広く手がける。2018年11月時点での登録メンバは55名で、現在も執筆メンバを募集中。興味のある方は、どしどし応募頂きたい。著書記事多数。 RSS Twitter: @yyamada(公式)、@yyamada/wings(メンバーリスト) Facebook

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

この記事は参考になりましたか?

この記事をシェア

  • X ポスト
  • このエントリーをはてなブックマークに追加
CodeZine(コードジン)
https://codezine.jp/article/detail/7412 2013/10/11 14:00

おすすめ

アクセスランキング

アクセスランキング

イベント

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー

アクセスランキング

アクセスランキング