下面是源码:
先添加js和CSS
<script type="text/javascript" language="javascript">
function DoCheck(flag)// 全选 flag=1 反选 flag=0
{
var inputs = document.forms[0].elements;
for (var i=0; i < inputs.length; i++)
if (inputs[i].type == 'checkbox')
{
if (flag)
inputs[i].checked = true;
else
inputs[i].checked =!inputs[i].checked;
}
}
</script>
CSS:
.ellipsis_row { OVERFLOW: hidden; WIDTH: 300px; WHITE-SPACE: nowrap; TEXT-OVERFLOW: ellipsis; }
.caseweight{OVERFLOW: hidden; WIDTH: 20px; WHITE-SPACE: nowrap; color:Red ;text-align:center ;padding-left:10px;}
-----------------------------------------
gridview控件的设置如下: 其中OnRowDataBound="gvCaseList_RowDataBound" 事件中添加了光棒效果:
<asp:GridView ID="gvCaseList" runat="server" AutoGenerateColumns="False" OnRowDataBound="gvCaseList_RowDataBound" >
<Columns>
<asp:BoundField HeaderText="类型" DataField="type" >
<ControlStyle Width="80px" />
</asp:BoundField>
<asp:TemplateField HeaderText="名称"> <!--把这一列转换为模板列-->
<ControlStyle Width="300px" />
<ItemTemplate>
<DIV class="ellipsis_row"><%#DataBinder.Eval(Container.DataItem,"name")%></DIV> <!--这里使用了一个div,通过CSS来控制该列的宽度,多余的字符使用....表示-->
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="费用"> <!--把这一列转换为模板列-->
<ControlStyle Width="20px" />
<ItemTemplate>
<div class="caseweight"><%#DataBinder.Eval(Container.DataItem,"fee")%></div><!--把该列的数据用红色显示出来,改变了该的文字样式-->
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField > <!--把这一列转换为模板列-->
<ControlStyle Width="20px" />
<HeaderTemplate> <!--注意这个HeaderTemplate,在这里加了两链接用于全选和反选-->
<a οnclick="DoCheck(0);" href="#">反选</a> <!--反选-->
<a οnclick="DoCheck(1);" href="#">全选</a> <!--全选-->
</HeaderTemplate>
<ItemTemplate>
<div style="text-align:center ;">
<asp:CheckBox ID="CheckBox1" runat="server"/>
</div>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
后台的光棒效果代码:(注意要添加OnRowDataBound="gvCaseList_RowDataBound"事件)
protected void gvCaseList_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
e.Row.Attributes.Add("onmouseover", "c=this.style.backgroundColor;this.style.backgroundColor='#FFFF80'");
e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor=c;");
}
}