Question

.NET是否有某种类型的内置函数允许对Gridviews进行过滤？我总是通过使用由带有参数的动态存储过程生成的数据源来编程我的过滤器。但是为了保持过滤器行始终存在，我必须放置代码来创建用于在允许分页时在三个不同位置进行过滤的控件（Page_load，Gridview_Databound，Page_SaveStateComplete）它看起来似乎必须有更好的方法。如果是这样，怎么样？

Answer 1

只有你做的工作。看看

http://blog.evonet.com.au/post/Creating-a-Stylish-looking-Gridview-with-Filtering.aspx

正如评论中所述，此网站不再可用。以下内容直接来自Bartek Marnane的博客文章，您可以在web.archive.com找到：

第1步：创建网格视图和数据源

创建一个简单的Gridview和Datasouce。在这个例子中，我使用的是SQL数据源，但我建议在生产环境中使用ObjectDataSource。将ConnectionString设置为web.config文件中的值，并将每个字段的ItemStyle-Width设置为取决于数据类型和空间大小。

<asp:GridView ID="Gridview1" runat="server" AutoGenerateColumns="False" AllowPaging="True"
AllowSorting="true" DataSourceID="dsGridview" Width="650px" PageSize="20"
CssClass="Gridview">
<Columns>
    <asp:BoundField DataField="id" HeaderText="id" SortExpression="id"
        ItemStyle-Width="50px" ItemStyle-HorizontalAlign="Center" />
    <asp:BoundField DataField="FirstName" HeaderText="Sort" SortExpression="FirstName"
        ItemStyle-Width="150px" />
    <asp:BoundField DataField="LastName" HeaderText="Sort" SortExpression="LastName"
        ItemStyle-Width="150px" />
    <asp:BoundField DataField="Department" HeaderText="Sort" SortExpression="Department"
        ItemStyle-Width="150px" />
    <asp:BoundField DataField="Location" HeaderText="Sort" SortExpression="Location"
        ItemStyle-Width="150px" />
</Columns>
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server"
ConnectionString="<%$ ConnectionStrings:EvonetConnectionString %>"
SelectCommand="SELECT * FROM [T_Employees]" />

第2步：创建用于Gridview标题的表

现在我们创建一个简单的表来保存标题和过滤下拉框。

<table style="width: 650px" border="0" cellpadding="0" cellspacing="1"
class="GridviewTable">
<tr>
    <td style="width: 50px;">
        ID
    </td>
    <td style="width: 150px;">
        First Name
    </td>
    <td style="width: 150px;">
        Last Name
    </td>
    <td style="width: 150px;">
        Department
    </td>
    <td style="width: 150px;">
        Location
    </td>
</tr>
<tr>
    <td style="width: 50px;">
    </td>
    <td style="width: 150px;">
    </td>
    <td style="width: 150px;">
    </td>
    <td style="width: 150px;">
        <asp:DropDownList ID="ddldepartment" DataSourceID="dsPopulateDepartment"
            AutoPostBack="true" DataValueField="department" runat="server" Width="130px"
            Font-Size="11px" AppendDataBoundItems="true">
            <asp:ListItem Text="All" Value="%"></asp:ListItem>
        </asp:DropDownList>
    </td>
    <td style="width: 150px;">
        <asp:DropDownList ID="ddlLocation" DataSourceID="dsPopulateLocation"
            AutoPostBack="true" DataValueField="location" runat="server" Width="130px"
            Font-Size="11px" AppendDataBoundItems="true">
            <asp:ListItem Text="All" Value="%"></asp:ListItem>
        </asp:DropDownList>
    </td>
</tr>
<tr>
    <td colspan="5">
        <asp:GridView ID="Gridview1" runat="server" AutoGenerateColumns="False"
            AllowPaging="True" AllowSorting="true" DataSourceID="dsGridview"
            Width="650px" PageSize="10" CssClass="Gridview">
            <Columns>
                <asp:BoundField DataField="id" HeaderText="Sort" SortExpression="id"
                    ItemStyle-Width="50px" ItemStyle-HorizontalAlign="Center" />
                <asp:BoundField DataField="FirstName" HeaderText="Sort"
                    SortExpression="FirstName" ItemStyle-Width="150px" />
                <asp:BoundField DataField="LastName" HeaderText="Sort"
                    SortExpression="LastName" ItemStyle-Width="150px" />
                <asp:BoundField DataField="Department" HeaderText="Sort"
                    SortExpression="Department" ItemStyle-Width="150px" />
                <asp:BoundField DataField="Location" HeaderText="Sort"
                    SortExpression="Location" ItemStyle-Width="150px" />
            </Columns>
        </asp:GridView>
    </td>
</tr>
</table>

对于最后一个单元格，将td colspan值设置为Gridview中的字段数。将Gridview移动到最后一个单元格中。

第3步：创建样式表

我使用的样式表包含以下项目：

.GridviewDiv {font-size: 62.5%; font-family: 'Lucida Grande',
    'Lucida Sans Unicode', Verdana, Arial, Helevetica, sans-serif; color: #303933;}
Table.Gridview{border:solid 1px #df5015;}
.GridviewTable{border:none}
.GridviewTable td{margin-top:0;padding: 0; vertical-align:middle }
.GridviewTable tr{color: White; background-color: #df5015; height: 30px; text-align:center}
.Gridview th{color:#FFFFFF;border-right-color:#abb079;border-bottom-color:#abb079;
    padding:0.5em 0.5em 0.5em 0.5em;text-align:center}
.Gridview td{border-bottom-color:#f0f2da;border-right-color:#f0f2da;
    padding:0.5em 0.5em 0.5em 0.5em;}
.Gridview tr{color: Black; background-color: White; text-align:left}
:link,:visited { color: #DF4F13; text-decoration:none }

您应该可以将其复制到您的css文件中，而不会影响您现有的样式表，但如果您已经设置：link和：在您的网站中访问过，请务必小心。

第4步：添加过滤下拉框和数据源

在步骤2中创建的表格中，向第二行中包含要过滤的字段的每个单元格添加下拉列表。确保eac下拉列表小于它进入的单元格，否则表格边框将不对齐。设置一个数据源，该数据源获取表中该字段的每个可能值。我通过对我正在过滤的表中的所有值运行DISTINCT来执行此操作：

<asp:DropDownList ID="ddldepartment" DataSourceID="dsPopulateDepartment"
AutoPostBack="true" DataValueField="department" runat="server" Width="130px" Font-Size="11px"
AppendDataBoundItems="true">
    <asp:ListItem Text="All" Value="%"></asp:ListItem>
</asp:DropDownList>
<asp:SqlDataSource ID="dsPopulateDepartment" runat="server"
ConnectionString="<%$ ConnectionStrings:EvonetConnectionString %>" SelectCommand="SELECT
DISTINCT Department from [T_Employees]"></asp:SqlDataSource>

创建尽可能多的下拉列表作为您要过滤的字段。

有几点需要注意：

为下拉列表设置AppendDataBoundItems = True属性，因为它将在运行时填充。设置AutoPostBack = True属性，以便在选择更改时刷新Gridview。确保“All”的ListItem具有'％'作为值。您的过滤器表达式将是SELECT * FROM [TABLE NAME]其中[FieldName]类似于“{0}％”，其中{0}是下拉列表中的值。如果你的dropdownlist设置为all，那么查询字符串将是SELECT * FROM [TABLE NAME]其中[FieldName]就像'%%'那样，在SQL中返回所有值。

步骤5：向Gridview的数据源添加过滤

添加FilterExpress以使您的Gridview的数据源如

[Field1]喜欢'{0}％'和[Field2]喜欢'{1}％'和[Field3]喜欢'{2}％'和[Field4]喜欢'{3}％'和......等< / p>

然后，您的字段需要以与过滤器表达式相同的顺序添加到FilterParameters部分。 FilterParameters部分引用下拉列表的SelectedValue。

<asp:SqlDataSource ID="dsGridview" runat="server"
    ConnectionString="<%$ ConnectionStrings:EvonetConnectionString %>"
    SelectCommand="SELECT * FROM [T_Employees]" FilterExpression="Department like '{0}%'
    and Location like '{1}%'">
    <FilterParameters>
        <asp:ControlParameter Name="Department" ControlID="ddldepartment"
            PropertyName="SelectedValue" />
        <asp:ControlParameter Name="Location" ControlID="ddllocation"
            PropertyName="SelectedValue" />
    </FilterParameters>
</asp:SqlDataSource>

就是这样！

Gridview Filtering内置函数？

1 个答案: