[javascript]
$(function () { gridview("GridView1"); }); //gridview function gridview(objgridview) { //get obj id var gridviewId = "#" + objgridview; //even $(gridviewId + ">tbody tr:even").addClass("NormalColor"); //first $(gridviewId + ">tbody tr:first").removeClass("NormalColor").addClass("HeadColor"); //odd $(gridviewId + ">tbody tr:odd").addClass("AlterColor"); //move and click $(gridviewId + ">tbody tr").slice(1).hover(function () { $(this).addClass("HoverColor"); }, function () { $(this).removeClass("HoverColor"); }); //all check $("#chkAll").click(function () { $(gridviewId + '>tbody >tr >td >input:checkbox').attr('checked', this.checked); }); //check status $(gridviewId + ' >tbody >tr >td >input:checkbox').click(function () { var expr1 = gridviewId + ' >tbody >tr >td >input:checkbox:checked'; var expr2 = gridviewId + ' >tbody >tr >td >input:checkbox'; var selectAll = $(expr1).length == $(expr2).length; $('#chkAll').attr('checked', selectAll); }); }
[html]
lt;HeaderTemplate> lt;/HeaderTemplate>
[css]
.HeadColor{background-color: #E0ECFF; color:#333;line-height:25px;} .AlterColor{background-color: #edf1f8; line-height:20px;} .NormalColor{background-color: #f7f6f3; line-height:20px;} .HoverColor{background: #89A5D1; line-height:20px;} .SelectColor{background-color: #ACBFDF; line-height:20px;}