WebSurfer's Home

トップ > Blog 1   |   ログイン
APMLフィルター

DropDownList を使って絞込み

by WebSurfer 2011年7月17日 14:29

GridView に表示するレコードを DropDownList を使って絞り込むサンプルです。

GridView に表示するレコードを DropDownList を使って絞り込み

以前、実験室 SelectCommand の切り替え にも、2 つの DropDownList を使って GridView に表示されるレコードを絞り込むサンプルを書きましたが、それは SqlDataSource の SelectCommand(正確には SELECT クエリの WHERE 句)を書き換えていて、そのためのコードを書かなければならないのが面倒で、かつ、あまりスマートな方法とはいえません。

今回、ここに書いた方法は、WHERE 句は以下のように固定しておいて、DropDownList の SelectedValue プロパティの値によって全件抽出と条件抽出の両方に対応できるようにしたものです。

WHERE (@CustomerID='ALL' OR o.CustomerID=@CustomerID) 
  AND (@EmployeeID=0 OR e.EmployeeID=@EmployeeID)

上記で、@CustomerID='ALL' と @EmployeeID=0 が全件抽出の条件で、DropDownList.SelectedValue がそれぞれ "ALL" と "0" の時にその条件に一致させるようにします。

そのために、DropDownList の AppendDataBoundItems プロパティを true に設定した上で、全件抽出条件のための ListItem を追加します。なお、EmployeeID については、データ型が int なので、ListItem は以下のように設定しなければなりません。DropDownList.SelectedValue プロパティは string 型を返しますが、データベースプロバイダが型変換してくれます。

<asp:ListItem Value="0">ALL</asp:ListItem>

これによって C# のコードは一行も書かずに、すべてウィザードベースで作ることができます。上の画像の aspx ページのコードは以下の通りです。データベースには Northwind サンプルデータベースの Orders, Customers, Employees テーブルを使っています。

<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">

</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
  <title></title>
</head>
<body>
  <form id="form1" runat="server">
  <div>
    <asp:SqlDataSource ID="SqlDataSource1" 
      runat="server" 
      ConnectionString="<%$ ConnectionStrings:Northwind %>" 
      SelectCommand=
        "SELECT DISTINCT o.CustomerID, c.CompanyName 
        FROM Orders AS o 
        INNER JOIN Customers AS c 
        ON o.CustomerID = c.CustomerID">
    </asp:SqlDataSource>
    Customer: 
    <asp:DropDownList ID="DropDownList1" 
      runat="server" 
      AppendDataBoundItems="True" 
      DataSourceID="SqlDataSource1" 
      DataTextField="CompanyName" 
      DataValueField="CustomerID" 
      AutoPostBack="True">
      <asp:ListItem>ALL</asp:ListItem>
    </asp:DropDownList>
    <br />
    <asp:SqlDataSource ID="SqlDataSource2" 
      runat="server" 
      ConnectionString="<%$ ConnectionStrings:Northwind %>" 
      SelectCommand=
        "SELECT DISTINCT o.EmployeeID, 
          e.FirstName + ' ' + e.LastName AS Name 
        FROM Orders AS o 
        INNER JOIN Employees AS e 
        ON o.EmployeeID = e.EmployeeID">
    </asp:SqlDataSource>
    Employee: 
    <asp:DropDownList ID="DropDownList2" 
      runat="server" 
      AppendDataBoundItems="True" 
      DataSourceID="SqlDataSource2" 
      DataTextField="Name" 
      DataValueField="EmployeeID" 
      AutoPostBack="True">
      <asp:ListItem Value="0">ALL</asp:ListItem>
    </asp:DropDownList>

    <asp:SqlDataSource ID="SqlDataSource3" 
      runat="server" 
      ConnectionString="<%$ ConnectionStrings:Northwind %>" 
      SelectCommand=
        "SELECT o.OrderID, c.CompanyName, 
          e.FirstName + ' ' + e.LastName AS Name, 
          o.ShippedDate, o.Freight 
        FROM Orders AS o 
        INNER JOIN Customers AS c 
          ON o.CustomerID = c.CustomerID 
        INNER JOIN Employees AS e 
          ON o.EmployeeID = e.EmployeeID
        WHERE (@CustomerID='ALL' OR o.CustomerID=@CustomerID) 
          AND (@EmployeeID=0 OR e.EmployeeID=@EmployeeID)
        ORDER BY o.OrderID">
        <SelectParameters>
          <asp:ControlParameter ControlID="DropDownList1" 
            Name="CustomerID" 
            PropertyName="SelectedValue" />
          <asp:ControlParameter ControlID="DropDownList2" 
            Name="EmployeeID" 
            PropertyName="SelectedValue" />
        </SelectParameters>
    </asp:SqlDataSource>
    <asp:GridView ID="GridView1" 
      runat="server" 
      AllowPaging="True" 
      AutoGenerateColumns="False" 
      DataKeyNames="OrderID" 
      DataSourceID="SqlDataSource3">
      <Columns>
        <asp:BoundField 
          DataField="OrderID" 
          HeaderText="OrderID" 
          InsertVisible="False" 
          ReadOnly="True" 
          SortExpression="OrderID" />
        <asp:BoundField 
          DataField="CompanyName" 
          HeaderText="Customer" 
          SortExpression="CompanyName" />
        <asp:BoundField 
          DataField="Name" 
          HeaderText="Employee" 
          ReadOnly="True" 
          SortExpression="Name" />
        <asp:BoundField 
          DataField="ShippedDate" 
          HeaderText="Shipped Date" 
          SortExpression="ShippedDate" 
          DataFormatString="{0:yyyy/M/d}" >
          <ItemStyle HorizontalAlign="Center" />
        </asp:BoundField>
        <asp:BoundField 
          DataField="Freight" 
          HeaderText="Freight" 
          SortExpression="Freight" 
          DataFormatString="${0:N2}" >
          <ItemStyle HorizontalAlign="Right" />
        </asp:BoundField>
      </Columns>
    </asp:GridView>
  </div>
  </form>
</body>
</html>

Tags: ,

ASP.NET

About this blog

2010年5月にこのブログを立ち上げました。その後 ブログ2 を追加し、ここは ASP.NET 関係のトピックス、ブログ2はそれ以外のトピックスに分けました。

Calendar

<<  2018年11月  >>
28293031123
45678910
11121314151617
18192021222324
2526272829301
2345678

View posts in large calendar