如何根据复选框选择的值对gridview数据进行排序?

时间:2014-02-23 05:57:58

标签: javascript asp.net gridview checkbox

我使用的是asp.net grid-view。在我的gridview中有一个复选框。我希望行首先选中复选框,然后其他行将在下面。所以有两个标准,我也希望'checked'行和未检查的行将按字母顺序排序。

<asp:DataGrid ID="grdItemList" runat="server" AutoGenerateColumns="False"
                      BackColor="Transparent" BorderColor="#E0E0E0" BorderWidth="0px" CellPadding="0"
                      CssClass="DBGridStyle" DESIGNTIMEDRAGDROP="14" GridLines="Horizontal" TabIndex="15"
                      Width="100%" OnItemDataBound="grdItemList_ItemDataBound">
                      <AlternatingItemStyle CssClass="GridAlternateRowStyle" />
                      <ItemStyle CssClass="GridRowStyle" />
                      <HeaderStyle CssClass="GridColumnHeaderStyle" Font-Bold="True" />
                      <FooterStyle HorizontalAlign="Right" VerticalAlign="Middle" />
                      <Columns>
                          <asp:TemplateColumn>
                              <HeaderStyle Width="25px" />
                              <HeaderTemplate>
                                  <asp:CheckBox ID="CheckAll" runat="server" language="javascript" onclick="return CheckAll_onclick(this.checked)" />
                              </HeaderTemplate>
                              <ItemTemplate>
                                  <asp:CheckBox ID="DeleteThis" runat="server" language="javascript" onclick="return DeleteThis_onclick(this.checked)" Checked='<%# DataBinder.Eval (Container.DataItem, "Selected") %>'/>
                              </ItemTemplate>
                          </asp:TemplateColumn>
                          <asp:BoundColumn DataField="EmpCode" HeaderText="Code">
                              <HeaderStyle Width="100px" />
                          </asp:BoundColumn>
                          <asp:BoundColumn DataField="EmpName" HeaderText="Name">
                              <HeaderStyle Width="300px" />
                          </asp:BoundColumn>
                          <asp:BoundColumn DataField="AdParamCode" Visible="False" >
                              <HeaderStyle Width="100px" />
                          </asp:BoundColumn>
                          <asp:TemplateColumn HeaderText="Flat Amount">
                              <ItemTemplate>
                                  <asp:TextBox ID="txtAmount" runat="server" Text='<%# DataBinder.Eval (Container.DataItem, "Amount") %>'></asp:TextBox>
                              </ItemTemplate>
                          </asp:TemplateColumn>
                          <asp:TemplateColumn HeaderText="% of Basic">
                              <HeaderTemplate>
                                  % of Basic
                              </HeaderTemplate>
                              <EditItemTemplate>
                                  &nbsp;
                              </EditItemTemplate>
                              <ItemTemplate>
                                  <asp:TextBox ID="txtPercent" runat="server" Text='<%# DataBinder.Eval (Container.DataItem, "PercentOfBasic") %>'></asp:TextBox>
                              </ItemTemplate>
                              <HeaderStyle Width="80px" />
                          </asp:TemplateColumn>
                          <asp:TemplateColumn HeaderText="Applied Status">
                              <EditItemTemplate>
                                  &nbsp;
                              </EditItemTemplate>
                              <ItemTemplate>
                                  <asp:DropDownList ID="cboAppliedStat" runat="server" SelectedIndex='<%# DataBinder.Eval (Container.DataItem, "AppliedStat") %>'>
                                      <asp:ListItem Selected="True">All</asp:ListItem>
                                      <asp:ListItem>Higher</asp:ListItem>
                                      <asp:ListItem>Lower</asp:ListItem>
                                  </asp:DropDownList>
                              </ItemTemplate>
                              <HeaderStyle Width="100px" />
                          </asp:TemplateColumn>



                      </Columns>

                  </asp:DataGrid>

1 个答案:

答案 0 :(得分:0)

这是使用northwind数据库的小型演示。一旦理解了这个概念,您就可以调整方法。

网页:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApp.CheckboxSorting.Default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Customer Sort</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>

        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" CellPadding="4" ForeColor="#333333" GridLines="None">
            <AlternatingRowStyle BackColor="White" />
            <Columns>
                <asp:TemplateField>
                    <ItemTemplate>
                        <asp:CheckBox ID="chkBox" AutoPostBack="true" runat="server" OnCheckedChanged="chkBox_CheckedChanged" Checked='<%# Eval("Flag") %>' />
                        <asp:HiddenField ID="hfCustomerID" Value='<%# Eval("CustomerID") %>' runat="server" />
                    </ItemTemplate>
                </asp:TemplateField>                
                <asp:BoundField DataField="CustomerID" HeaderText="CustomerID" />
                <asp:BoundField DataField="CompanyName" HeaderText="Company" />
                <asp:BoundField DataField="ContactName" HeaderText="Contact" />
                <asp:BoundField DataField="Addr" HeaderText="Address" />
            </Columns>
            <EditRowStyle BackColor="#2461BF" />
            <FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
            <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
            <PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
            <RowStyle BackColor="#EFF3FB" />
            <SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
            <SortedAscendingCellStyle BackColor="#F5F7FB" />
            <SortedAscendingHeaderStyle BackColor="#6D95E1" />
            <SortedDescendingCellStyle BackColor="#E9EBEF" />
            <SortedDescendingHeaderStyle BackColor="#4870BE" />
        </asp:GridView>

    </div>
    </form>
</body>
</html>

代码背后:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web.UI.WebControls;

namespace WebApp.CheckboxSorting
{
    [Serializable]
    public class CustomerModel
    {
        public CustomerModel()
        {            
            Flag = false;
        }

        public bool Flag { get; set; }

        public string CustomerID { get; set; }

        public string CompanyName { get; set; }

        public string ContactName { get; set; }

        public string Addr { get; set; }
    }

    public partial class Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                using (var db = new NorthwindDbContext())
                {
                    var customers = db.Customers.Select(x => new CustomerModel() { 
                        CustomerID = x.CustomerID,
                        Addr = x.Address,
                        CompanyName = x.CompanyName                        
                    }).Take(10).ToList();
                    ViewState["Data"] = customers;
                    GridView1.DataSource = customers;
                    GridView1.DataBind();
                }
            }
        }

        protected void chkBox_CheckedChanged(object sender, EventArgs e)
        {
            var lst = (List<CustomerModel>)ViewState["Data"];
            var chkbx =(CheckBox)sender;
            var hf = (HiddenField)chkbx.Parent.FindControl("hfCustomerID");
            var id = hf.Value;
            var item = lst.Single(x => x.CustomerID == id);
            item.Flag = chkbx.Checked;
            var lst1 = (from x in lst orderby x.Flag descending, x.CompanyName ascending select x).ToList();
            GridView1.DataSource = lst1;
            GridView1.DataBind();
        }
    }
}