|
|
解説
実例で学ぶASP.NETプログラミング
第6回 ASP.NETの真骨頂-DataGridコントロールで一覧ページを制する
小田原 貴樹(うりゅう)
2003/05/31 |
|
|
残りの要素の配置
商品一覧ページで最も重要な要素であるDataGridコントロールを利用した一覧表部分のデザインは出来上がった。ページの残りの要素も配置してしまおう。これまでの連載を読まれた方なら、特別説明は必要ないだろうが、以下を参照して作成していただきたい。
|
商品一覧ページのトップ・バナー画像を配置 |
ソリューション・エクスプローラから、「bana1.gif」を選択し、ページ上にドラッグ&ドロップする。 |
|
商品一覧画面の使い方を説明するLabelコントロールの配置 |
ツールボックス「Webフォーム」タブ内よりLabelコントロールを選択し、ページ上にドラッグ&ドロップする。このLabelコントロールに商品一覧画面の使い方の説明などを記述する。 |
|
データ件数を動的に表示するLabelコントロールの配置 |
ツールボックス「Webフォーム」タブ内よりLabelコントロールを選択し、ページ上にドラッグ&ドロップし、コントロール名を「CNTL」にする。このコントロールにはデータ全体の件数と、一覧表に現在表示されている件数を動的に表示する。 |
|
ページ全体のレイアウトを整える |
マウスを使って全体の要素の位置をそろえる。好みに応じてTable内に配置するなど、ほかの方法でレイアウトするのもよいだろう。 |
これでページ・デザインは完成した。あとは驚くほど少量のコードを記述するだけで、この一覧表にさまざまな機能を持たせることができるのだが、残念ながら今回はここまでで紙幅が尽きてしまった。次回は、DataGridコントロールに対するコーディングについて、具体例を挙げながら解説する。MCPの受験結果も声を大にしてご報告できたらいいのだが……。
ASP.NETで作成されたショッピング・サイト紹介
海そうヘアエッセンスのヤマサキ−「ラサナ.NET」
今回はまたもや筆者自身が構築したショッピング・サイトをご紹介させていただく(笑)。デモ・サイトではなく、実稼働しているショッピング・サイト構築の際に、筆者がASP.NETをどういった形で利用しているのかという点に注目してご覧いただきたい。
|
海そうヘアエッセンスのヤマサキ−「ラサナ.NET」 |
このサイトでは商品一覧ページにDataGridコントロールではなく、画面のようにDataListコントロールを利用している。 |
「ラサナ.NET」は、ヘア・エッセンスやシャンプーなどを販売しているコスメ系ショッピング・サイトである。筆者自身の感想としては、「システム・デザイン・商品点数」のバランスが取れているサイトになったと思う。
商品一覧画面に限らず、このサイトは連載で構築中のVS屋といろいろな面で異なっている。前述したとおり、「このサイトではどうしてそうなったのか?」を考えていただけると、ASP.NETを実際に利用していく上での参考になるかと思う。
余談だが、このサイトはけっこう好調で、オープン2カ月目の5月度の売上が200万円程度出ており、製作者としては嬉しい限りである。ショッピング・サイトでは何より「商品力」が最も重要な要素であるが、サイト自体の出来映えも無視できる要素ではないので、ASP.NETが実現する操作性・機能性の高さを実証する1つのケースにはなったかと思っている。
|
Insider.NET 記事ランキング
本日
月間