SHOEISHA iD

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

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

ASP.NET Dynamic Data活用編

ASP.NET Dynamic Dataのエンティティテンプレートのカスタマイズと勘所

ASP.NET Dynamic Data活用編(4)

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

エンティティテンプレートのカスタマイズ

 以下に手順を記します。少しトリッキーな部分がありますのでご注意ください。

1.ユーザーコントロールの追加

 EntityTemplatesフォルダー上で右クリックし、[追加]-[新しい項目]を選択して、新しい項目の追加ダイアログからWebユーザーコントロールを選択します。名前を"Customers.aspx"と設定して追加します。

2.ユーザーコントロールの修正

 Customers.ascx.csファイルの以下の記載を修正します。

/EntityTemplates/Customers.ascxファイルの一部
// 修正前
public partial class Customers : System.Web.UI.UserControl

// 修正後
public partial class Customers : System.Web.DynamicData.EntityTemplateUserControl

 継承元をエンティティテンプレートで使用するユーザーコントロールのクラス"EntityTemplateUserControl"へと変更させます。

3.HTMLデザイナ上でtr/tdタグと内容を記載

 エンティティテンプレートで適用される内容をCustomers.aspxファイルに記載します。

 今回は以下のように記載します。

/EntityTemplates/Customers.ascxファイルの一部
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="Customers.ascx.cs" Inherits="CustomizeDD4.DynamicData.EntityTemplates.Customers" %>
<tr>
  <td class="DDLightHeader">
        <asp:Label ID="Label1" runat="server" Text="CompanyName" />
  </td>
  <td>
    <asp:DynamicControl ID="DynamicControl1" runat="server" 
        DataField="CompanyName" />
  </td>
  <td class="DDLightHeader">
    <asp:Label ID="Label2" runat="server" Text="ContactName" />
  </td>
  <td>
    <asp:DynamicControl ID="DynamicControl3" runat="server" 
        DataField="ContactName" />
  </td>
</tr>
<tr>
  …以下略
</tr>

 Default.ascxとの違いとして、1行に2項目表示しています。他には、DynamicControlのDataFieldプロパティにCustomersテーブルの項目名を指定します。後は繰り返し実施するだけです。編集・新規作成のDynamicControl記載例は以下のとおりです。

/EntityTemplates/Customers_Edit.ascxファイルの一部
<asp:DynamicControl ID="DynamicControl1" runat="server" Mode="Edit"
    DataField="CompanyName" />
/EntityTemplates/Customers_Insert.ascxファイルの一部
<asp:DynamicControl ID="DynamicControl1" runat="server" Mode="Insert"
    DataField="CompanyName" />

 ご覧のとおり、ModeプロパティでEdit/Insertの指定をするだけです。コードビハインド側での処理は一切不要です。全てDynamic Data側で処理します。

 以上で設定完了です。実行すると図4~5のような画面を確認できます。

 なお、エンティティテンプレート内でもデータフィールドのカスタマイズは反映されるので、前回ご紹介した方法で入力補助などを簡略化させることもできます(図6)。

図6 エンティティテンプレート内でのAJAX Control Toolkitの利用
図6 エンティティテンプレート内でのAJAX Control Toolkitの利用

 エンティティテンプレートはそれほどハードルが高くないので、3列くらいのテーブルとしてカスタマイズしてみるといいでしょう。

まとめ

 今回はフィルター作成とエンティティテンプレートのカスタマイズについてご紹介しました。フィルター作成はGetQueryableメソッドの実装があるためハードルが高く感じたかもしれませんが、作成の流れ部分を押さえることが重要です。多くのデータから特定データを抽出するためにはフィルター機能の作成は必須ですので、Dynamic Dataを活用する際にはフィルター作成にも挑戦してみてはいかがでしょうか。

 エンティティテンプレートはカスタマイズできる範囲が限られているため歯がゆく感じる方も多いとは思いますが、すぐに見栄えを変更できると考えれば悪くはない機能です。こちらも現場でDynamic Dataを使うことになるならば、ぜひ利用をご検討ください。

 連載の最初にも記載しましたがLightSwitchとは違い、プラグインなしで利用でき、イントラネット内でもブラウザがあれば利用できるDynamic Dataは確実にニーズがあると言えます。ASP.NET Web FormやASP.NET MVCのバックグラウンドをサポートするアプリケーションとしてASP.NET Dynamic Dataを一度検討していただければ幸いです。

参考文献

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

  • X ポスト
  • このエントリーをはてなブックマークに追加
ASP.NET Dynamic Data活用編連載記事一覧

もっと読む

この記事の著者

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

静岡県榛原町生まれ。一橋大学経済学部卒業後、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プロジェクト ナオキ(ナオキ)

WINGSプロジェクトについて>有限会社 WINGSプロジェクトが運営する、テクニカル執筆コミュニティ(代表 山田祥寛)。主にWeb開発分野の書籍/記事執筆、翻訳、講演等を幅広く手がける。2018年11月時点での登録メンバは55名で、現在も執筆メンバを募集中。興味のある方は、どしどし応募頂きたい。著書記事多数。 RSS X: @WingsPro_info(公式)、@WingsPro_info/wings(メンバーリスト) Facebook

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

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

この記事をシェア

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

おすすめ

アクセスランキング

アクセスランキング

イベント

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

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

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

メールバックナンバー

アクセスランキング

アクセスランキング