ASP.NET GridViewで一覧表示 ~SqlDataSource~

■データベースを作成します。
新しい項目の追加より「SQLデータベース」を追加します。
アプリケーションルート直下にASP.NETフォルダ「App_Data」が作成され、App_Dataフォルダ直下にデータベースが作成されます。


■テーブルを作成します。
「表示」メニューより「サーバーエクスプローラ」を起動します。
サーバーエクスプローラの「データ接続」の右クリックメニューより「接続の追加」を選択します。
データソース「SqlServer」、サーバー名、データベース名を選択または入力します。
作成したデータベース接続のテーブルに「tblCompany」、「tblCustomer」を作成します。
・tblCompanyテーブル定義


サーバーエクスプローラで作成したテーブルを選択し、右クリックメニュー「テーブルデータの表示」でテストデータを作成しておきます。

■CompanyList.aspxを作成します。
新しい項目の追加より「Webフォーム」を追加し「CompanyList.aspx」とします。

■SqlDataSourceコントロールを配置します。
CompanyList.aspxに「SqlDataSource」コントロールを配置します。
SqlDataSourceのスマートタグより「データソースの構成」をクリックします。

先ほど作成したデータベースを選択します。

アプリケーション構成ファイル(Web.Config)に保存する接続文字列の名前を指定します。
ここでは「ConnectionString」という名前でデータベースの接続文字列がWeb.configに保存されます。

グリッドで使用するテーブルと列を選択します。

完了をクリックする。


■GridViewを配置します。
CompanyList.aspxに「GridView」コントロールを配置します。
GridViewのスマートタグより「データソースの選択」をクリックし、SqlDataSource1を選択します。

GridViewのスマートタグより「列の編集」をクリックし「フィールド」ダイアログボックスを起動する。
「選択されたフィールド」ボックスの「CompanyID」を選択して「BoundFieldプロパティ」ボックスの「HeaderText」プロパティを「会社ID」に変更する。
同様に「CampanyName」の「HeaderText」プロパティを「会社名」に、「CampanyKana」の「HeaderText」プロパティを「会社名カナ」に変更する。
また「ItemStyle」を展開して「Width」プロパティによりグリッドの列幅を調整します。


グリッドビューのスマートタグより「並べ替えを有効にする」と「ページングを有効にする」をチェックオンにします。
「並べ替えを有効にする」は項目名がリンクになり、リンクをクリックすることで指定した項目の値で並べ替えることができるようになります。
「ページングを有効にする」はグリッドビューの下部にページ番号が表示され、ページング機能が利用できるようになります。


■実行して確認してみます。

0 件のコメント: