600字范文,内容丰富有趣,生活中的好帮手!
600字范文 > 实现gridview中checkbox的全选和反选 以及固定gridview列字符串的长度 多余的以...表示...

实现gridview中checkbox的全选和反选 以及固定gridview列字符串的长度 多余的以...表示...

时间:2022-09-24 01:56:41

相关推荐

实现gridview中checkbox的全选和反选 以及固定gridview列字符串的长度 多余的以...表示...

下面是源码:

先添加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;");

}

}

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。