JQuery是一个非常强大的JavaScript Framework,用它可以更方便的查找,操作html元素。尤其是提供了ready事件,从此不再为body的onload事件而郁闷不已。现在介绍一下用法:
MultiSelect : function(container, header, item, target)
当点击checkbox时调用这个方法,其中参数
container:容器的ID,如果使用母版页请用ClientID
header:HeaderTemplate中全选checkbox的ID
item:ItemTemplate中的checkbox,包括id(checkbox的ID),key(关键字属性,一般使用checkbox的title属性),type(关键字类型,设置number表示数字,否则表示字符)
target:存放所选checkbox的控件,一般使用HiddenField
Refresh : function(container, header, item, target)
分页时刷新checkbox的选择状态,参数同上
示例如下:
$(
function ()
{
$().Refresh("GridView1", "Header", {id: "Item", key: "title", type: ""}, "ID");
$("input[@type='checkbox']").click(
function()
{
$(this).MultiSelect("GridView1", "Header", {id: "Item", key: "title", type: ""}, "ID");
});
} );
< asp:GridView ID = " GridView1 " runat = " server " AutoGenerateColumns = " False " DataKeyNames = " CategoryID "
DataSourceID = " SqlDataSource1 " AllowPaging = " True " PageSize = " 5 " >
< Columns >
< asp:TemplateField >
< HeaderTemplate >
< input id = " Header " type = " checkbox " title = " 全选 " />
</ HeaderTemplate >
< ItemTemplate >
< input id = " Item " type = " checkbox " title = " <%# Eval( " CategoryID " ) %> " />
</ ItemTemplate >
</ asp:TemplateField >
< asp:BoundField DataField = " CategoryID " HeaderText = " CategoryID " InsertVisible = " False "
ReadOnly = " True " SortExpression = " CategoryID " />
< asp:BoundField DataField = " CategoryName " HeaderText = " CategoryName " SortExpression = " CategoryName " />
< asp:BoundField DataField = " Description " HeaderText = " Description " SortExpression = " Description " />
</ Columns >
</ asp:GridView >
< asp:HiddenField ID = " ID " runat = " server " />
function ()
{
$().Refresh("GridView1", "Header", {id: "Item", key: "title", type: ""}, "ID");
$("input[@type='checkbox']").click(
function()
{
$(this).MultiSelect("GridView1", "Header", {id: "Item", key: "title", type: ""}, "ID");
});
} );
< asp:GridView ID = " GridView1 " runat = " server " AutoGenerateColumns = " False " DataKeyNames = " CategoryID "
DataSourceID = " SqlDataSource1 " AllowPaging = " True " PageSize = " 5 " >
< Columns >
< asp:TemplateField >
< HeaderTemplate >
< input id = " Header " type = " checkbox " title = " 全选 " />
</ HeaderTemplate >
< ItemTemplate >
< input id = " Item " type = " checkbox " title = " <%# Eval( " CategoryID " ) %> " />
</ ItemTemplate >
</ asp:TemplateField >
< asp:BoundField DataField = " CategoryID " HeaderText = " CategoryID " InsertVisible = " False "
ReadOnly = " True " SortExpression = " CategoryID " />
< asp:BoundField DataField = " CategoryName " HeaderText = " CategoryName " SortExpression = " CategoryName " />
< asp:BoundField DataField = " Description " HeaderText = " Description " SortExpression = " Description " />
</ Columns >
</ asp:GridView >
< asp:HiddenField ID = " ID " runat = " server " />