如何使用JavaScript在GridView中启用和禁用复选框?

如何使用JavaScript在GridView中启用和禁用复选框?,javascript,asp.net,visual-studio-2008,Javascript,Asp.net,Visual Studio 2008,我有一个GridView“gvpodetails”。我有两个复选框,一个在GridView的第一列,另一个在GridView的最后一列 我想在选中第一个复选框时启用第二个复选框。 我想在第一个复选框未选中时禁用第二个复选框 我已经编写了以下JavaScript var grid = document.getElementById('<%=gvPODetails.ClientID %>'); var PlannedQty = 0*1;

我有一个GridView“gvpodetails”。我有两个复选框,一个在GridView的第一列,另一个在GridView的最后一列

我想在选中第一个复选框时启用第二个复选框。 我想在第一个复选框未选中时禁用第二个复选框

我已经编写了以下JavaScript

    var grid = document.getElementById('<%=gvPODetails.ClientID %>');        
    var PlannedQty = 0*1;        

    if(grid != null)
    {
        var Inputs = grid.getElementsByTagName('input');

        for(i = 0;i < Inputs.length;i++)
        {
            var id=String(Inputs[i].id);
            if(Inputs[i].type == 'text' && id.indexOf("txtPlannedQuantity")!=-1)
            {
                if(Inputs[i-2].type == 'checkbox')
                {
                    if(Inputs[i-2].checked)
                    {
                        if(Inputs[i+2].value == "0.000")
                            Inputs[i+2].value = (parseFloat(Inputs[i].value) - parseFloat(Inputs[i+1].value))
                        else
                            Inputs[i+2].value = Inputs[i+2].value;
                        Inputs[i+2].disabled = false;
                        Inputs[i+3].disabled = false;
                        Inputs[i-1].disabled = false;
                        Inputs[i+6].disabled = false;// This is for Second CheckBox
                    }
                    else
                    {
                        Inputs[i+4].value="0.00";
                        Inputs[i+5].value="0.00";
                        Inputs[0].checked = false;
                        Inputs[i+2].disabled = true;
                        Inputs[i+3].disabled = true;
                        Inputs[i-1].disabled = true;
                        Inputs[i+6].disabled = true;// This is for Second CheckBox
                    }
                }
            }
        }             
    }

   <Columns>                         
     <asp:TemplateField>
         <ItemTemplate>
             <asp:CheckBox ID="chkSelect" runat="server" Checked='<%#Bind("Select") %>' onClick="CheckedTotal();" /></ItemTemplate>
         <HeaderTemplate>
             <asp:CheckBox ID="chkSelectAll" runat="server" onclick="CheckAll();" /></HeaderTemplate>
     </asp:TemplateField>
     <asp:TemplateField HeaderText="ED_f">
         <ItemTemplate>
             <asp:CheckBox ID="chkEDInclusive" runat="server" Checked = '<%#Bind("EDInclusive_f") %>' Enabled="false" />
         </ItemTemplate>
     </asp:TemplateField>
  </Columns>
var grid=document.getElementById(“”);
var PlannedQty=0*1;
如果(网格!=null)
{
var Inputs=grid.getElementsByTagName('input');
对于(i=0;i
这些是我的javascript和GridView源代码。 我在模板字段列中也有一些文本框。此条件适用于GridView中的所有文本框。 但文本框已正确启用和禁用,最后一个复选框除外。 我只给出了两个复选框的源代码。 当选中和取消选中复选框的第一个复选框时,如何启用和禁用GridView中的最后一个复选框?
我需要你所有的建议。

你可能应该使用活动授权。在网格上执行此操作

此javascript假定您的行标记名为“tr”,并且在选择该特定行的所有输入时,您的第二个复选框为input[1]。如果你需要IE支持,你需要使用你最喜欢的事件处理包装器

window.onload = function () {
    var rowNodeName = 'tr',
        firstInputClassName = 'foo';

    document.getElementById('<%=gvPODetails.ClientID %>').addEventListener('change', function (e) {
        if (e.target.type === 'checkbox' && e.target.className.match(firstInputClassName)) {
            // Find parent row
            var row = e.target.parentNode;

            while (row.nodeName !== rowNodeName.toUpperCase()) {
                row = row.parentNode;
                if (!row) {
                    break; // In case we hit document
                }
            }

            if (row) {
                var inputs = row.getElementsByTagName('input');

                inputs[1].disabled = !e.target.checked;
            }
        }
    }, false);
}
window.onload=函数(){
变量rowNodeName='tr',
firstInputClassName='foo';
document.getElementById(“”).addEventListener('change',函数(e){
if(e.target.type=='checkbox'&&e.target.className.match(firstInputClassName)){
//查找父行
var row=e.target.parentNode;
while(row.nodeName!==rowNodeName.toUpperCase()){
row=row.parentNode;
如果(!行){
break;//以防我们碰到文档
}
}
国际单项体育联合会(世界其他地区){
var inputs=row.getElementsByTagName('input');
输入[1]。已禁用=!e.target.checked;
}
}
},假);
}

这将处理网格中类名为“foo”的任何输入上的更改事件,如firstInputClassName变量中定义的。触发时,将沿着dom树走到标记名等于rowNodeName的节点,选择该行中的输入,并将该行中第二个输入的禁用状态设置为与触发事件的输入的选中状态相反的状态。

检查此项当窗口触发其onload处理程序时,它会自行安装。当然,如果您已经有一个onload处理程序,您可能需要将函数代码移到那里。另外,调整rowNodeName和firstInputClassName以及可能的输入[1]以适应您的情况就足够了。我没有一个html的例子,所以这三个都只是猜测而已。