首页 新闻 会员 周边 捐助

全选改变背景颜色的问题？

0
悬赏园豆：30 [已解决问题] 解决于 2010-02-26 16:28

具体代码如下所示：当我选中其中某一行前面的CheckBox时，这行的背景颜色就改变了，但是当我选择全选框按钮时，每行前面的CheckBox都选中了，但是背景颜色却不改变，请问是怎么回事啊？谢谢！

aspx代码

代码 
<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="gridcheck.aspx.cs" Inherits="_Default" %>

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

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>无标题页</title>
     <script type="text/javascript">
     function changecolor(cbo,o)
    {
      var theBox=cbo;
      var tr=document.getElementById(o);  //o为行的id
      if(theBox.checked)
      {
        tr.style.backgroundColor="Red";
      }
      else
      {
        tr.style.backgroundColor="#CCCCCC";
        
      }
    }
    </script>

</head>
<body>
    <form id="form1" runat="server">
    <div>
       <table style="border:solid 1px green;width:40%">
            <tr>
                <td style="background-color:Green">
                    <span style="font-size: 14pt; color: #ffffff"><strong>
                    GridView控件与checkBox控件结合</strong></span></td>
            </tr>
            <tr>
                <td>
                    <asp:GridView ID="GridView1" Width="100%" runat="server" AutoGenerateColumns="False"
                        CellPadding="3" Font-Size="9pt"  BackColor="White" BorderColor="#CCCCCC" 
                        BorderStyle="None" BorderWidth="1px" DataKeyNames="stuid" 
                        onrowdatabound="GridView1_RowDataBound">
                        <FooterStyle BackColor="White" ForeColor="#000066" />
                        <Columns>
                             <asp:TemplateField>
                                <ItemTemplate>
                                    <asp:CheckBox ID="CheckBox1" runat="server" />
                                </ItemTemplate>
                                 <HeaderTemplate>
                     <asp:CheckBox ID="CheckBox2" runat="server" AutoPostBack="True" Font-Size="9pt" OnCheckedChanged="CheckBox2_CheckedChanged"
                        Text="全选" />
                                 </HeaderTemplate>
                            </asp:TemplateField>
                             <asp:BoundField DataField="stuid" HeaderText="学生ID号"  />
                            <asp:BoundField DataField="stuname" HeaderText="姓名" />  
                            <asp:BoundField DataField="stuadd" HeaderText="地址" />
                            <asp:BoundField DataField="stucity" HeaderText="城市" />
                                
                        </Columns>
                        <RowStyle ForeColor="#000066" />
                        <SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
                        <PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />
                        <HeaderStyle BackColor="#006699" Font-Bold="True" ForeColor="White" />
                    </asp:GridView>
                </td>
            </tr>
            <tr>
                <td>
                    &nbsp;<asp:Button ID="btndel" runat="server" Text="删除" OnClick="btndel_Click" />
        <asp:Button ID="btncancel" runat="server" Text="取消选择" OnClick="btncancel_Click" /></td>
            </tr>
        </table>
        &nbsp; &nbsp;&nbsp;
    </div>
    </form>
</body>
</html>

aspx.cs文件

代码 
using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Data.SqlClient;

public partial class _Default : System.Web.UI.Page
{

    protected void Page_Load(object sender, EventArgs e)
    {
        if (!Page.IsPostBack)
        {
            band();
        }
    }
    private void band()
    {
        SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["connection"].ConnectionString);
        con.Open();
        string sqlstr = "select * from student";
        SqlDataAdapter myda = new SqlDataAdapter(sqlstr, con);
        DataSet myds = new DataSet();
        myda.Fill(myds, "student");
        GridView1.DataSource = myds;
        GridView1.DataBind();
        con.Close();
    }
    protected void CheckBox2_CheckedChanged(object sender, EventArgs e)
    {
        bool c = ((CheckBox)GridView1.HeaderRow.FindControl("CheckBox2")).Checked;
        foreach (GridViewRow gr in GridView1.Rows)
        {
            CheckBox cbox = (CheckBox)gr.FindControl("CheckBox1");
            cbox.Checked = c;
        }
    }
    protected void btncancel_Click(object sender, EventArgs e)
    {
        for (int i = 0; i <= GridView1.Rows.Count - 1; i++)
        {
            CheckBox check = (CheckBox)GridView1.Rows[i].FindControl("checkbox1");
            check.Checked = false;
        }
    }
    protected void btndel_Click(object sender, EventArgs e)
    {
        btndel.Attributes.Add("onClick", "javascript:return   confirm('确定删除吗？');");
        SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["connection"].ConnectionString);
        con.Open();
        for (int i = 0; i <= GridView1.Rows.Count - 1; i++)
        {
            CheckBox check = (CheckBox)GridView1.Rows[i].FindControl("CheckBox1");
            if (check.Checked == true)
            {
                string sqlstr = "delete from student where stuid='" + GridView1.DataKeys[i].Value + "'";
                SqlCommand cmd = new SqlCommand(sqlstr, con);
                cmd.ExecuteNonQuery();
            }
        }
        con.Close();
        band();
    }
    protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
        CheckBox CheckSingle = e.Row.Cells[0].FindControl("CheckBox1") as CheckBox;
        CheckSingle.Attributes.Add("onclick", "javascript:changecolor(this,'" + e.Row.ClientID + "')");

        }
    }
}

 

yang rui的主页 yang rui | 初学一级 | 园豆：125
提问于：2010-02-25 19:42
< >
分享
最佳答案
0

问题如楼上查尔斯所说，回传的控制问题。

这种全选变色的功能还是用js实现比较好，虽然用服务端执行也是可以的

服务端：

代码 
protected void CheckBox2_CheckedChanged(object sender, EventArgs e)    
{       
 bool c = ((CheckBox)GridView1.HeaderRow.FindControl("CheckBox2")).Checked;
 foreach (GridViewRow gr in GridView1.Rows)       
 {            
      CheckBox cbox = (CheckBox)gr.FindControl("CheckBox1");
      cbox.Checked = c;        
      gr.BackColor＝red --这里改变颜色就可以了。
}    
}

 

推荐用客户端js控制：

分析：选中一行-->改变颜色；全选-->全部改变颜色；

代码直接看查尔斯的就可以。

收获园豆：15
邢少 | 专家六级 |园豆：10926 | 2010-02-26 09:24
其他回答(3)
0

hehe，jquery 啦...

天堂口 | 园豆：514 (小虾三级) | 2010-02-25 21:07
0

“全选”触发了Postback，导致页面刷新，所以你的js就无效了

建议采用Js实现全选，参考一下代码：

Code
<html>
<head>
<script type="text/javascript">

function checkEvent(name,allCheckId)
{
  var allCk=document.getElementById(allCheckId);
  if(allCk.checked==true)
  checkAll(name);
  else
  checkAllNo(name);
  
}

//全选
function checkAll(name)
{
  var names=document.getElementsByName(name);
  var len=names.length;
  if(len>0)
  {
   var i=0;
   for(i=0;i<len;i++)
   names[i].checked=true;
    
  }
}

//全不选
function checkAllNo(name)
{
  var names=document.getElementsByName(name);
 var len=names.length;
 if(len>0)
  {
    var i=0;
    for(i=0;i<len;i++)
    names[i].checked=false;
  }
}

//反选
function reserveCheck(name)
{
  var names=document.getElementsByName(name);
 var len=names.length;
 if(len>0)
 {
 var i=0;
   for(i=0;i<len;i++)
   {
     if(names[i].checked)
     names[i].checked=false;
     else
     names[i].checked=true;
     
   }
 } 

}

</script>
</head>

<body>
<input type="checkbox" id="ckall" onclick="checkEvent('ck','ckall')" />全选
<input type="checkbox" id="ckReserve" onclick="reserveCheck('ck','ckReserve')" />反选
    <br />
<input type="checkbox" name="ck" value="1" />篮球
    <br />
<input type="checkbox" name="ck" value="2" />旅游
    <br />
<input type="checkbox" name="ck" value="3" />读书
 <br />
<input type="checkbox" name="ck" value="4" />美食
    <br />
<input type="checkbox" name="ck" value="5" />睡觉
</body>

</html>

收获园豆：15
查尔斯 | 园豆：3832 (老鸟四级) | 2010-02-25 21:28
0

 protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)   
{       
 if (e.Row.RowType == DataControlRowType.DataRow)       
 {       
  CheckBox CheckSingle = e.Row.Cells[0].FindControl("CheckBox1") as CheckBox;
  if (CheckSingle.Checked)
  {
          CheckSingle.Attributes.Add("onclick", "changecolor(this,'" + e.Row.ClientID + "')");       
  }
 }   
}

SmartFramework@live.jp | 园豆：5 (初学一级) | 2010-02-25 21:28
清除回答草稿
   您需要登录以后才能回答，未注册用户请先注册。