閲覧総計：11153　　（本日：1　　昨日：0)

　GridViewのページング機能はとても便利な機能である。
　しかし、１ページへの表示が20行程度の少ない行数で、ページを繰らないと次の情報
が閲覧出来ない事を不便に感じる利用者も多い。１ページに多くの行数の情報を表示し
スクロールで情報を閲覧したい利用者である。
　今回、ドロップダウンリストを用い、利用者がGridViewの１ページに表示される行数
を20, 50, 100, 1000と自分で選べる機能の実装を確認した。
　基本機能に加え、自分が設定した行数をクッキーに覚えさせ、次回画面を開いた時
も、その行数表示になる実装法も確認した。　　　09/11/29

【目次】↓クリックするとその説明ページに飛べます。

【機能】GridViewのデータ表示行数をドロップダウンリストで変更する。
【稼働画面】

PageSize02.JPG

Accessデータベース名：Access01.mdb
テーブル名：名簿

フィールド名データ型フィールドサイズ
ID (主キー)オートナンバー型長整数型
名前テキスト型50

※VWD2005、ASP.NET2.0ではAccess2007のDBファイル形式(*.accdb)は利用できない。
DBファイルは「Acces2002-2003形式(*.mdb)」で保存してASP.NETで利用する。

開発環境：VWD2005 + Access2003
サーバ：ASP.NET2.0 + Access2003

GridViewのページサイズを変更する（基本機能） ↑

【方法】

PageSize01.JPG
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 />
        &nbsp;表示件数：<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>件 &nbsp;<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>
↑

GridViewのページサイズを変更する（クッキー仕様） ↑

【機能】
設定したページサイズを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 />
        &nbsp;ページ表示件数：<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>件 &nbsp;<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>

【参考にしたページ】
　　該当なし


選択肢 投票
参考になった 4  
ふつう 0  
参考にならなかった 1  
トップ   新規 一覧 単語検索 最終更新   ヘルプ   最終更新のRSS