DataGrid 代码:
<form id="Form1" method="post" runat="server">
<asp:TextBox id="TextBox1" style="Z-INDEX: 101; LEFT: 448px; POSITION: absolute; TOP: 296px"
runat="server"></asp:TextBox>
<asp:DataGrid id="DataGrid1" style="Z-INDEX: 102; LEFT: 88px; POSITION: absolute; TOP: 48px" runat="server"
BorderColor="#999999" BorderStyle="None" BorderWidth="1px" BackColor="White" CellPadding="3"
GridLines="Vertical">
<FooterStyle ForeColor="Black" BackColor="#CCCCCC"></FooterStyle>
<SelectedItemStyle Font-Bold="True" ForeColor="White" BackColor="#008A8C"></SelectedItemStyle>
<AlternatingItemStyle BackColor="Gainsboro"></AlternatingItemStyle>
<ItemStyle ForeColor="Black" BackColor="#EEEEEE"></ItemStyle>
<HeaderStyle Font-Bold="True" ForeColor="White" BackColor="#000084"></HeaderStyle>
<Columns>
<asp:TemplateColumn >
<HeaderTemplate>
<INPUT id="CheckAll" name="CheckAll" onclick="ChooseAll()" type="checkbox" >
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox id="CheckBox1" runat="server"></asp:CheckBox>
</ItemTemplate>
<HeaderStyle Wrap="False" ></HeaderStyle>
</asp:TemplateColumn>
</Columns>
<PagerStyle HorizontalAlign="Center" ForeColor="Black" BackColor="#999999" Mode="NumericPages"></PagerStyle>
</asp:DataGrid>
</form>
<asp:TextBox id="TextBox1" style="Z-INDEX: 101; LEFT: 448px; POSITION: absolute; TOP: 296px"
runat="server"></asp:TextBox>
<asp:DataGrid id="DataGrid1" style="Z-INDEX: 102; LEFT: 88px; POSITION: absolute; TOP: 48px" runat="server"
BorderColor="#999999" BorderStyle="None" BorderWidth="1px" BackColor="White" CellPadding="3"
GridLines="Vertical">
<FooterStyle ForeColor="Black" BackColor="#CCCCCC"></FooterStyle>
<SelectedItemStyle Font-Bold="True" ForeColor="White" BackColor="#008A8C"></SelectedItemStyle>
<AlternatingItemStyle BackColor="Gainsboro"></AlternatingItemStyle>
<ItemStyle ForeColor="Black" BackColor="#EEEEEE"></ItemStyle>
<HeaderStyle Font-Bold="True" ForeColor="White" BackColor="#000084"></HeaderStyle>
<Columns>
<asp:TemplateColumn >
<HeaderTemplate>
<INPUT id="CheckAll" name="CheckAll" onclick="ChooseAll()" type="checkbox" >
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox id="CheckBox1" runat="server"></asp:CheckBox>
</ItemTemplate>
<HeaderStyle Wrap="False" ></HeaderStyle>
</asp:TemplateColumn>
</Columns>
<PagerStyle HorizontalAlign="Center" ForeColor="Black" BackColor="#999999" Mode="NumericPages"></PagerStyle>
</asp:DataGrid>
</form>
JavaScript 代码:
<script language="javascript" >
var checkFlag=true;
function ChooseAll()
{
// alert(checkFlag);
if(checkFlag)
{
var inputs = document.all.tags("INPUT");
alert(inputs.length);
for (var i=0;i<inputs.length;i++)
{
if(inputs[i].type=="checkbox" && inputs[i].id !="CheckAll")
{
inputs[i].checked=true;
}
}
checkFlag=false;
}
else
{
var inputs=document.all.tags("INPUT");
for (var i=0;i<inputs.length;i++)
{
if(inputs[i].type=="checkbox" && inputs[i].id !="CheckAll")
{
inputs[i].checked=false;
}
}
checkFlag=true;
var checkFlag=true;
function ChooseAll()
{
// alert(checkFlag);
if(checkFlag)
{
var inputs = document.all.tags("INPUT");
alert(inputs.length);
for (var i=0;i<inputs.length;i++)
{
if(inputs[i].type=="checkbox" && inputs[i].id !="CheckAll")
{
inputs[i].checked=true;
}
}
checkFlag=false;
}
else
{
var inputs=document.all.tags("INPUT");
for (var i=0;i<inputs.length;i++)
{
if(inputs[i].type=="checkbox" && inputs[i].id !="CheckAll")
{
inputs[i].checked=false;
}
}
checkFlag=true;
}
}
删除确认:
// <summary>
// 让用户加以确认删除数据。
// </summary>
function DelRec()
{
var inputs = document.all.tags("input");
var selectedLen = 0;
for( var i=0;i < inputs.length; i ++)
{
if(inputs[i].type == "checkbox")
{
if( inputs[i].checked )
{
if(inputs[i].id != "CheckAll")
{
selectedLen ++;
}
}
}
}
if( selectedLen == 0 )
{
alert("请先选择您要删除的数据!");
}
else
{
var flag = confirm("您确定要删除所选择的这 " + selectedLen + " 条数据吗?");
if(flag)
{
document.all("BtnDelRecord").click();
}
}
}
// 让用户加以确认删除数据。
// </summary>
function DelRec()
{
var inputs = document.all.tags("input");
var selectedLen = 0;
for( var i=0;i < inputs.length; i ++)
{
if(inputs[i].type == "checkbox")
{
if( inputs[i].checked )
{
if(inputs[i].id != "CheckAll")
{
selectedLen ++;
}
}
}
}
if( selectedLen == 0 )
{
alert("请先选择您要删除的数据!");
}
else
{
var flag = confirm("您确定要删除所选择的这 " + selectedLen + " 条数据吗?");
if(flag)
{
document.all("BtnDelRecord").click();
}
}
}
注意大小写,javasript很难调试,所以一定要注意大小写。