閲覧総計:11153 (本日:1 昨日:0)
GridViewのページング機能はとても便利な機能である。
しかし、1ページへの表示が20行程度の少ない行数で、ページを繰らないと次の情報
が閲覧出来ない事を不便に感じる利用者も多い。1ページに多くの行数の情報を表示し
スクロールで情報を閲覧したい利用者である。
今回、ドロップダウンリストを用い、利用者がGridViewの1ページに表示される行数
を20, 50, 100, 1000と自分で選べる機能の実装を確認した。
基本機能に加え、自分が設定した行数をクッキーに覚えさせ、次回画面を開いた時
も、その行数表示になる実装法も確認した。 09/11/29
【目次】↓クリックするとその説明ページに飛べます。
【機能】GridViewのデータ表示行数をドロップダウンリストで変更する。
【稼働画面】
Accessデータベース名:Access01.mdb
テーブル名:名簿
フィールド名 | データ型 | フィールドサイズ |
---|---|---|
ID (主キー) | オートナンバー型 | 長整数型 |
名前 | テキスト型 | 50 |
※VWD2005、ASP.NET2.0ではAccess2007のDBファイル形式(*.accdb)は利用できない。
DBファイルは「Acces2002-2003形式(*.mdb)」で保存してASP.NETで利用する。
開発環境:VWD2005 + Access2003
サーバ:ASP.NET2.0 + Access2003
【方法】
Protected Sub DropDownList1_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) GridView1.PageSize = DropDownList1.SelectedValue End Sub
【PageSize01.aspx】
<%@ Page Language="VB" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <script runat="server"> Protected Sub DropDownList1_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) GridView1.PageSize = DropDownList1.SelectedValue End Sub </script> <html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>GridViewのページサイズ変更</title> </head> <body> <form id="form1" runat="server"> <div> GridViewのページサイズ変更 09/11/28<br /> <br /> 表示件数:<asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged"> <asp:ListItem Value="3">3</asp:ListItem> <asp:ListItem Value="5">5</asp:ListItem> <asp:ListItem Value="7">7</asp:ListItem> </asp:DropDownList>件 <br /> <asp:GridView ID="GridView1" runat="server" AllowPaging="True" AutoGenerateColumns="False" DataKeyNames="ID" DataSourceID="AccessDataSource1" EmptyDataText="表示するデータ レコードがありません。" PageSize="3"> <Columns> <asp:BoundField DataField="ID" HeaderText="ID" ReadOnly="True" SortExpression="ID" /> <asp:BoundField DataField="名前" HeaderText="名前" SortExpression="名前" /> </Columns> </asp:GridView> <asp:AccessDataSource ID="AccessDataSource1" runat="server" DataFile="App_Data\MyDB.mdb" DeleteCommand="DELETE FROM `名簿` WHERE `ID` = ?" InsertCommand="INSERT INTO `名簿` (`ID`, `名前`) VALUES (?, ?)" SelectCommand="SELECT `ID`, `名前` FROM `名簿`" UpdateCommand="UPDATE `名簿` SET `名前` = ? WHERE `ID` = ?"> <DeleteParameters> <asp:Parameter Name="ID" Type="Int32" /> </DeleteParameters> <InsertParameters> <asp:Parameter Name="ID" Type="Int32" /> <asp:Parameter Name="名前" Type="String" /> </InsertParameters> <UpdateParameters> <asp:Parameter Name="名前" Type="String" /> <asp:Parameter Name="ID" Type="Int32" /> </UpdateParameters> </asp:AccessDataSource> <br /> </div> </form> </body> </html>
【機能】
設定したページサイズをCookieに記録し、このページを次回開いた時に、前回の設定
が反映される様にした。
【方法】
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) 'Cookie操作法で参考にしたページ 08/10/26 'http://momotchi.net/forums/t/23.aspx '最初のPage_Loadの時だけ実行する処理。すなわちPostBuck時は実行しない。 If Not Page.IsPostBack Then 'Cookie情報の読込 Dim cookie As HttpCookie = Request.Cookies("UserInfo") 'Cookie情報がある場合 If Not (cookie Is Nothing) Then GridView1.PageSize = cookie.Values("pagesize") DropDownList1.SelectedValue = cookie.Values("pagesize") End If End If End Sub Protected Sub DropDownList1_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) GridView1.PageSize = DropDownList1.SelectedValue 'Cookie情報の書込(更新) Dim cookie As New HttpCookie("UserInfo") cookie.Values("pagesize") = DropDownList1.SelectedValue cookie.Expires = DateTime.Now.AddMonths(6) '6ヶ月保存 Response.Cookies.Add(cookie) End Sub
【PageSizeCookie01.aspx】
<%@ Page Language="VB" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <script runat="server"> Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) 'Cookie操作法で参考にしたページ 08/10/26 'http://momotchi.net/forums/t/23.aspx '最初のPage_Loadの時だけ実行する処理。すなわちPostBuck時は実行しない。 If Not Page.IsPostBack Then 'Cookie情報の読込 Dim cookie As HttpCookie = Request.Cookies("UserInfo") 'Cookie情報がある場合 If Not (cookie Is Nothing) Then GridView1.PageSize = cookie.Values("pagesize") DropDownList1.SelectedValue = cookie.Values("pagesize") End If End If End Sub Protected Sub DropDownList1_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) GridView1.PageSize = DropDownList1.SelectedValue 'Cookie情報の書込(更新) Dim cookie As New HttpCookie("UserInfo") cookie.Values("pagesize") = DropDownList1.SelectedValue cookie.Expires = DateTime.Now.AddMonths(6) '6ヶ月保存 Response.Cookies.Add(cookie) End Sub </script> <html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>GridViewのページサイズ変更(Cookie対応)</title> </head> <body> <form id="form1" runat="server"> <div> GridViewのページサイズ変更 09/11/29<br /> (選択値をクッキー保存する仕様)<br /> <br /> ページ表示件数:<asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged"> <asp:ListItem Value="3">3</asp:ListItem> <asp:ListItem Value="5">5</asp:ListItem> <asp:ListItem Value="7">7</asp:ListItem> </asp:DropDownList>件 <br /> <asp:GridView ID="GridView1" runat="server" AllowPaging="True" AutoGenerateColumns="False" DataKeyNames="ID" DataSourceID="AccessDataSource1" EmptyDataText="表示するデータ レコードがありません。" PageSize="3"> <Columns> <asp:BoundField DataField="ID" HeaderText="ID" ReadOnly="True" SortExpression="ID" /> <asp:BoundField DataField="名前" HeaderText="名前" SortExpression="名前" /> </Columns> </asp:GridView> <asp:AccessDataSource ID="AccessDataSource1" runat="server" DataFile="App_Data\MyDB.mdb" DeleteCommand="DELETE FROM `名簿` WHERE `ID` = ?" InsertCommand="INSERT INTO `名簿` (`ID`, `名前`) VALUES (?, ?)" SelectCommand="SELECT `ID`, `名前` FROM `名簿`" UpdateCommand="UPDATE `名簿` SET `名前` = ? WHERE `ID` = ?"> <DeleteParameters> <asp:Parameter Name="ID" Type="Int32" /> </DeleteParameters> <InsertParameters> <asp:Parameter Name="ID" Type="Int32" /> <asp:Parameter Name="名前" Type="String" /> </InsertParameters> <UpdateParameters> <asp:Parameter Name="名前" Type="String" /> <asp:Parameter Name="ID" Type="Int32" /> </UpdateParameters> </asp:AccessDataSource> <br /> </div> </form> </body> </html>
【参考にしたページ】
該当なし