[英]Javascript uncheck checkboxs from Asp.net GridView
我正在使用javascript進行未經檢查的GridView。 但是,無論何時嘗試,我都無法取消選中它。
function UncheckedItemsCheckBox(CheckboxID) {
var checkbox = document.getElementById(CheckboxID);
checkbox.checked = false;
alert(checkbox.id + " : " + checkbox.name + " : " + checkbox.checked);
}
這是輸出。
---------------------------
Message from webpage
---------------------------
GridView1_ctl02_txtDoseQty : GridView1$ctl02$txtDoseQty : false
---------------------------
OK
---------------------------
即使“ checkbox.checked”返回了“ false”,如顯示的輸出消息,但在gridview仍選中了復選框。
有人可以給我建議嗎?
可能發生的情況是您的CheckBoxID
錯誤,因此返回了錯誤的元素。
在JavaScript中,說checkbox.checked = false;
如果此對象先前沒有checked
屬性, 則將其添加一個並提供值。 因此,如果您的CheckBoxID
實際上是錯誤的,則警報顯示為false也就不足為奇了。 使用getElementById
向后拉的任何非null元素都將允許您向其中添加一個選中的屬性。
更具體地說,在asp.net
當您創建一個復選框列時,就像這樣
<asp:CheckBoxField Text="Hello" DataField="foo" />
它呈現如下的html:
<span class="aspNetDisabled">
<input id="gv_ctl00_0" type="checkbox" name="gv$ctl02$ctl00" disabled="disabled">
<label for="gv_ctl00_0">Hello</label>
</span>
幾種可能性:
一個開始調試的好地方是將您的功能更改為此
function UncheckedItemsCheckBox(CheckboxID) {
var checkbox = document.getElementById(CheckboxID);
alert(checkbox.checked); // <------- should display false, but will
// display undefined if this element is
// something other than a checkbox
checkbox.checked = false;
alert(checkbox.id + " : " + checkbox.name + " : " + checkbox.checked);
}
您是否要檢查或取消選中GridView中的復選框。 如果是,那么您可以嘗試以下簡單代碼。 點擊標頭復選框后,我們將在其中調用javascript函數
<script type="text/javascript">
function Check_All(ChkBoxHeader)
{
//First Access the GridView Control
var gridview = document.getElementById('<%=GridEmployees.ClientID %>');
//Now get the all the Input type elements in the GridView
var AllInputsElements = gridview.getElementsByTagName('input');
var TotalInputs = AllInputsElements.length;
//Now we have to find the checkboxes in the rows.
for(var i=0;i< TotalInputs ; i++ )
{
if(AllInputsElements[i].type =='checkbox')
{
AllInputsElements[i].checked = ChkBoxHeader.checked;
}
}
}
GridView將如下所示
<asp:GridView ID="GridView1" runat="server">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:CheckBox ID="checkRecords" runat="server" />
</ItemTemplate>
<HeaderTemplate>
<asp:CheckBox ID="CheckHeader" runat="server" onclick="Check_All(this);" />
</HeaderTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
希望對您有幫助。
<script language="javascript" type="text/javascript">
// function Search()
// {
// alert("hi");
// }
function SearchValidation() {
var str = "";
var flag;
var count = 0;
// alert("Hi");'txtFirstName'
if (document.getElementById('<%=ddlProjectName.ClientID%>').selectedIndex == 0) {
str += "Select project name \n";
flag = false;
count++;
// alert(count);
}
if (document.getElementById('<%=ddlUsers.ClientID%>').selectedIndex == 0) {
str += "Select project name \n";
flag = false;
count++;
}
if (document.getElementById('<%=ddlEmployee.ClientID%>').selectedIndex == 0) {
str += "Select project name \n";
flag = false;
count++;
}
if (document.getElementById('<%=txtFromDate.ClientID%>').value == "") {
str += "Enter Fromdate \n";
flag = false;
count++;
}
else {
var input = document.getElementById('<%=txtFromDate.ClientID%>');
var validformat = /\d{2}\/\d{2}\/\d{4}$/;
if (!validformat.test(input.value)) {
str += "Invalid Fromdate Format. Please correct and submit again. \n";
flag = false;
}
else {
}
}
if (document.getElementById('<%=txtToDate.ClientID%>').value == "") {
str += "Enter Todate \n";
flag = false;
count++;
}
else {
var inputTo = document.getElementById('<%=txtToDate.ClientID%>');
var validTo = /\d{2}\/\d{2}\/\d{4}$/;
if (!validTo.test(inputTo.value)) {
str += "Invalid Todate Format. Please correct and submit again. \n";
flag = false;
}
else {
}
}
if (count == 5) {
alert("Select any one search criteria.");
return false;
}
else {
return true;
}
}
function ExportToExcelValidation() {
var str = "";
var flag;
// alert("Hi");'txtFirstName'
if (document.getElementById('<%=ddlProjectName.ClientID%>').selectedIndex == 0) {
str += "Select project name \n";
flag = false;
}
if (document.getElementById('<%=txtFromDate.ClientID%>').value == "") {
str += "Enter Fromdate \n";
flag = false;
}
else {
var input = document.getElementById('<%=txtFromDate.ClientID%>');
var validformat = /\d{2}\/\d{2}\/\d{4}$/;
if (!validformat.test(input.value)) {
str += "Invalid Fromdate Format. Please correct and submit again. \n";
flag = false;
}
}
if (document.getElementById('<%=txtToDate.ClientID%>').value == "") {
str += "Enter Todate \n";
flag = false;
}
else {
var inputTo = document.getElementById('<%=txtToDate.ClientID%>');
var validTo = /\d{2}\/\d{2}\/\d{4}$/;
if (!validTo.test(inputTo.value)) {
str += "Invalid Todate Format. Please correct and submit again. \n";
flag = false;
}
}
if (flag == false) {
alert(str);
return flag;
}
else {
return flag;
}
}
function CheckValidation() {
if (confirm("Are you sure you want to delete this ?"))
return true;
else
return false;
}
function CheckAll(oCheckbox) {
var GridView2 = document.getElementById("<%=gvLeads.ClientID %>");
for (i = 1; i < GridView2.rows.length; i++) {
GridView2.rows[i].cells[0].getElementsByTagName("INPUT")[0].checked = oCheckbox.checked;
// alert(GridView2.rows[i].cells[0].getElementsByTagName("INPUT")[0]);
}
}
function CheckIndividual(oCheck) {
var GridView2 = document.getElementById("<%=gvLeads.ClientID %>");
var checkedCount = 0;
for (i = 1; i < GridView2.rows.length; i++) {
if (GridView2.rows[i].cells[0].getElementsByTagName("INPUT")[0].checked == true) {
checkedCount++;
}
}
if (checkedCount == GridView2.rows.length - 1) {
GridView2.rows[0].cells[0].getElementsByTagName("INPUT")[0].checked = oCheck.checked;
}
else {
GridView2.rows[0].cells[0].getElementsByTagName("INPUT")[0].checked = false;
}
}
</script>
<%----%> <%--%>'runat =“服務器” Visible =“ false” />'runat =“服務器” Visible =“ false” />'runat =“服務器” Visible = “ false” /> <%-onclick =“ fnCheckAll(this);”-%> <%-'runat =“ server” Visible =“ false” />
</ItemTemplate>
</asp:TemplateField>--%>
<%-- <asp:TemplateField HeaderText="Project Id">
<ItemTemplate>
<asp:Label ID="lblProjectId" Text='<%#Eval("ProjectId") %>' runat="server" Visible="false"/>
</ItemTemplate>
</asp:TemplateField>--%>
<asp:TemplateField HeaderText="Project Name">
<ItemTemplate>
<asp:Label ID="lblProjectName" Text='<%#Eval("ProjectName") %>' runat="server" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Lead Name">
<ItemTemplate>
<asp:Label ID="lblLeadName" Text='<%#Eval("LeadName") %>' runat="server" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Employee Name">
<ItemTemplate>
<asp:Label ID="lblEmployeeName" Text='<%#Eval("EmployeeName") %>' runat="server" />
</ItemTemplate>
</asp:TemplateField>
<%-- <asp:TemplateField HeaderText="Lead Id">
<ItemTemplate>
<asp:Label ID="lblAddedUserName" Text='<%#Eval("LeadId") %>' runat="server" Visible="false"/>
</ItemTemplate>
</asp:TemplateField>--%>
<asp:TemplateField HeaderText="From Date">
<ItemTemplate>
<asp:Label ID="lblFromDate" Text='<%#Eval("FromDate") %>' runat="server" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="To Date">
<ItemTemplate>
<asp:Label ID="lblToDate" Text='<%#Eval("ToDate") %>' runat="server" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Added UserName">
<ItemTemplate>
<asp:Label ID="lblCreatedBy" Text='<%#Eval("CreatedBy") %>' runat="server" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Created Date">
<ItemTemplate>
<asp:Label ID="lblCreatedDate" Text='<%#Eval("CreatedDate") %>' runat="server" />
</ItemTemplate>
</asp:TemplateField>
<%--<asp:TemplateField HeaderText="Edit">
<ItemTemplate>
<asp:Label ID="lblLeadId" Text='<%#Eval("LeadId") %>' runat="server" Visible="false" />
<asp:Label ID="lblProjectId" Text='<%#Eval("ProjectId") %>' runat="server" Visible="false" />
<asp:Label ID="lblEmployeeId" Text='<%#Eval("EmployeeId") %>' runat="server" Visible="false" />
<asp:Label ID="lblEdit" Text='<%#Eval("Id") %>' runat="server" Visible="false" />
<asp:Button ID="btnEdit" runat="server" Text="Edit" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Delete">
<ItemTemplate>
<asp:Label ID="lblDelete" Text='<%#Eval("Id") %>' runat="server" Visible="false" />
<asp:Button ID="btnDelete" runat="server" Text="Delete" OnClientClick="if(!CheckValidation())return false;" />
</ItemTemplate>
</asp:TemplateField>--%>
</Columns>
<FooterStyle BackColor="#FFFFCC" ForeColor="#330099" />
<HeaderStyle BackColor="#9966FF" Font-Bold="True" ForeColor="#FFFFCC" />
<PagerStyle BackColor="#FFFFCC" ForeColor="#330099" HorizontalAlign="Center" />
<RowStyle BackColor="White" ForeColor="#330099" BorderColor="#0066CC" Font-Bold="False" />
<SelectedRowStyle BackColor="#FFCC66" Font-Bold="False" ForeColor="#663399" />
<SortedAscendingCellStyle BackColor="#FEFCEB" />
<SortedAscendingHeaderStyle BackColor="#AF0101" />
<SortedDescendingCellStyle BackColor="#F6F0C0" />
<SortedDescendingHeaderStyle BackColor="#7E0000" />
</asp:GridView>
用於檢查和取消選中gridView中的復選框的Javascript
<script language="javascript" type="text/javascript">
var TotalChkBx;
var Counter;
var TotalUnChkBx;
var UnCounter;
window.onload = function () {
//Get total no. of CheckBoxes in side the GridView.
TotalChkBx = parseInt('<%= this.GridView1.Rows.Count %>');
//Get total no. of checked CheckBoxes in side the GridView.
Counter = 0;
}
function HeaderClick(CheckBox) {
//Get target base & child control.
var TargetBaseControl = document.getElementById('<%= this.GridView1.ClientID %>');
var TargetChildControl = "chkBxSelect";
//Get all the control of the type INPUT in the base control.
var Inputs = TargetBaseControl.getElementsByTagName("input");
//Checked/Unchecked all the checkBoxes in side the GridView.
for (var n = 0; n < Inputs.length; ++n)
if (Inputs[n].type == 'checkbox' && Inputs[n].id.indexOf(TargetChildControl, 0) >= 0)
Inputs[n].checked = CheckBox.checked;
//Reset Counter
Counter = CheckBox.checked ? TotalChkBx : 0;
}
function ChildClick(CheckBox, HCheckBox) {
//get target base & child control.
var HeaderCheckBox = document.getElementById(HCheckBox);
//Modifiy Counter;
if (CheckBox.checked && Counter < TotalChkBx)
Counter++;
else if (Counter > 0)
Counter--;
//Change state of the header CheckBox.
if (Counter < TotalChkBx)
HeaderCheckBox.checked = false;
else if (Counter == TotalChkBx)
HeaderCheckBox.checked = true;
}
</script>
在GridView中
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false"
AlternatingRowStyle-BackColor="#006699"
AlternatingRowStyle-ForeColor="#FFFFFF"
>
<Columns >
<asp:TemplateField HeaderText="Select">
<ItemTemplate>
<asp:CheckBox ID="chkBxSelect" runat="server" />
</ItemTemplate>
<HeaderStyle HorizontalAlign="Center" VerticalAlign="Middle" Width="50px" />
<ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" Width="50px" />
<HeaderTemplate>
<asp:CheckBox ID="chkBxHeader" onclick="javascript:HeaderClick(this);" runat="server" />
</HeaderTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Serial Number">
<ItemTemplate>
<%# Container.DataItemIndex + 1 %>
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField HeaderText="Name" DataField="uname" />
<asp:BoundField HeaderText="Pass" DataField="upass"/>
</Columns>
</asp:GridView>
試試這個
$(document).ready(function () {
$("#headercheck").click(function () {
var ischecked;
if (this.checked == true) {
ischecked = true;
}
else {
ischecked = false;
}
$('<%="#"+GridViewClass1.ClientID%> input:checkbox').attr('checked', $(this).is(':checked'))
});
});
headercheck是我的chcekboxid。 我使用了類似的方法來檢查和取消選中代碼中的復選框。 希望對您有幫助。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.