ホーム > .NET, ASP.NET 4.5, ASP.NET 備忘録 > 最新の GridView ならページングもソーティングも楽々!

最新の GridView ならページングもソーティングも楽々!

この記事は One ASP.NET Advent Calender の20日のエントリーです

GridView は便利なんですけど、ページングやソーティングをしっかり実装しようとするとなかなか手ごわいですよね。
データ量が限られてるのがわかってるなら SqlDataSource でさくっと動かしてもいいんですけど、のちのち問題になるのわかりきってますしねぇ。。。

と、面倒だった実装が最新(4.5)版の GridView なら楽々です。
ということでとにかく動かしてみましょう。

さて、まずは新しい Web サイトで ASP.NET Web フォームサイトを作って DB を追加します。
DB じゃなくてもいけるはずですが、明日もこの環境使うために DB で。
そして WebForms で CodeFirst で簡単に DbContext 作る方法がわかってないので DB First で Entity Framework 使っていきたいと思います。

#ASP.NET MVC なら POCO のクラス書くだけであとはスキャッフォールディングにおまかせで DbContext 作ってくれるんですけどね。。。

と、気を取り直して DB 作成。

image

そそ、この新しいテーブルデザイン画面いいですよね。
なにがいいって IDENTITY の設定がワンクリックでできること。
最初は項目表示されてないので右クリックして表示項目を追加してあげるひつようがありますが。
あと、CREATE 文もぱっと目に入ってくるので SQL の勉強にもいいですよね。
つい保存ボタン押したくなっちゃうんですが、専用の「更新」メニューをクリックして DB つか Member テーブル作成、っと。
で、GridView でページングとソーティングの話ですから適当にデータつっこんでおきましょう。

さて、DB First ですから次は EDM 追加します。

image

image

もうデフォルト設定のままウィザードたたいて突っ走ってしまいますよ、と。。。

image

はい、できました、っと。
なんかセキュリティの警告でますけど、T4テンプレートでソース生成するときって出るみたいです。
なぜか連続2回。
まぁ、とにかく EDM できたけどタブに[*]ついてるので一回ビルド走らせておきます。

で、今回かなり優秀になってるな、と思ったのが

image

へんな名前空間とかなしで、Member クラスを生成してくれます。
これなら使い勝手いいですよね。

と、GridView はどうしたんだ、といわれそうなので新規でWebページを追加します。
で、いきなりコードを表示させて次のようなデータを呼び出してくるメソッドを追加します。

image

と、ここで待望の GridView です。
GridView を Web ページに追加して SelectMethod プロパティにさっき書いたメソッドを設定してあげましょう。

image

はい、ここでとりあえずデバッグ実行してみましょうか。

image

さくっとデータ拾ってきてますね。
では、本題のページングとソーティング。

image

プロパティの設定を3つ追加しました。
で、実行すると。。。

image

あらあら、エラーです。
でも、このエラーきちんと見ておいてくださいね。
LINQ に慣れてる人ならもうなんとなくわかるかも。
で、OrderBy つけろ、と言われているのでデータ取り出すとこにデフォルトのソート順設定しましょう。

image

ま、こんなとこでしょうか。
さて、デバッグ実行っと。

image

はい、ページングとソーティングのリンクが追加されました。
2ページめは、、、

image

ちゃんと表示されますね。
Name をクリックすると、、、

image

image

ソートした状態でのページングもOK、っと。
ソーティングの昇順降順もきちんと保持しているようで、同じソートリンクを何回もクリックするとそのたびに昇順降順が入れ替わります。

いやー、ここまでコード何行書きました?
いままでのあの苦労はなんだったんだろう、と思いません?

で、ちょっとだけ裏側を解説すると、さっきでたエラーで メソッド Skip を GridView が使ってるのがわかります。
Skip、Take は LINQ 使ってページングするときの定番ですよね。
SelectMethod で IQueryable を返しているので、そこに Skip、Take がのせられてデータをとってきてるんだろう、という推測ができます。
なら、ソーティングは当然 OrderBy が使われてるんだろうな、と。
LINQ は遅延実行されるので、実際に DB から取り出されるのは Skip、Take で指定された必要なデータのみ。
なので、ViewState の肥大化なんて気にすることなく安心して利用することができますね。

と、とりあえず今日はここまで。
明日は GridView 使ううえでやっぱり面倒だった検証関係をとりあげます。

そだ、最後にひとつ。
わかりやすいので GridView を例にあげてますけど、ほかのデータ操作系のコントロール、DetailsView、FormView、ListView、ListView でもこれ使えますからね。
便利になりますねぇ。。。

カテゴリー:.NET, ASP.NET 4.5, ASP.NET 備忘録
  1. まだコメントはありません。
  1. No trackbacks yet.

コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト / 変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト / 変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト / 変更 )

Google+ フォト

Google+ アカウントを使ってコメントしています。 ログアウト / 変更 )

%s と連携中

%d人のブロガーが「いいね」をつけました。