Question

我在gridview中有两个下拉列表，即ddonsiteoffsite和ddhours。现在我想要的是，如果ddonsiteoffsite的selectedtext是“onsite”，则应该禁用ddhours。我尝试了以下代码片段，但它没有禁用ddhours。

<asp:TemplateColumn HeaderText="      OnSite/OffSite" >   
                <ItemTemplate>   
                     <asp:DropDownList ID="ddOnsiteOffside" runat="server" onchange="ToggleOnOff(this)"><asp:ListItem Text = "Offsite" Value="Offsite"></asp:ListItem>        
                        <asp:ListItem Text = "Onsite" Value="Onsite"></asp:ListItem> 
                      </asp:DropDownList>   
                </ItemTemplate>   
            </asp:TemplateColumn>   
             <asp:TemplateColumn>   
                <ItemTemplate>   
                    <asp:DropDownList ID="ddhours" runat="server">   
                        <asp:ListItem Text = "1" Value="1" ></asp:ListItem>   
                        <asp:ListItem Text = "2" Value="2" ></asp:ListItem>   
                        <asp:ListItem Text = "3" Value="3" ></asp:ListItem>   
                        <asp:ListItem Text = "4" Value="4" ></asp:ListItem>   
                        <asp:ListItem Text = "5" Value="5" ></asp:ListItem>   
                        <asp:ListItem Text = "6" Value="6" ></asp:ListItem>   
                        <asp:ListItem Text = "7" Value="7" ></asp:ListItem>   
                        <asp:ListItem Text = "8" Value="8" ></asp:ListItem>   
                        <asp:ListItem Text = "9" Value="9" ></asp:ListItem>   
                    </asp:DropDownList>   
                </ItemTemplate>   
            </asp:TemplateColumn>

我正在使用的相应JavaScript是：

function ToggleOnOff(ddonoff)    
  {      

     var row = chk.parentNode.parentNode;              
     if(ddonoff.value=="Onsite")    
     {           
          row.getElementsByTagName("ddhours")[0].disabled = true;                   
     }   
     else   
          row.getElementsByTagName("ddhours")[0].disabled = false;                    
 }

如何使用JavaScript或jQuery实现这一目标？我不明白我哪里出错了。

Answer 1

就这样做。

function ToggleOnOff(ddonoff) {
    $(ddonoff)
        .parent()// parent of ddl is td
        .next()// gives the next td 
        .find('select')// finds a select element in that td
        .attr('disabled', (ddonoff.value == "Onsite") ? 'disabled' : '');//enable-disable
}

OR

function ToggleOnOff(ddonoff) {
    $(ddonoff)
        .parent()//td
        .parent()//tr
        .find('select[id*="ddhours"]')//select by id
        .attr('disabled', (ddonoff.value == "Onsite") ? 'disabled' : '');//disable-enable
}

即使两列不是彼此相邻，方法2仍然有效。

依赖关系：jQuery

Answer 2

如果您有多个具有相同ID的元素，那么它将是无效的HTML文档。删除ID并为其命名。

像这样的东西

$("select[name='ddOnsiteOffsideName']").change(function(){
    var parent = $(this).closest("tr");
    var hoursSelectBox = parent.find("select[name='hoursName']");
    if (hoursSelectBox.val() === "Onsite") {
        hoursSelectBox.attr("disabled", true);
    }
});

在您的代码中，您使用的是row.getElementsByTagName("ddhours")。这将获取标签名为“ddhours”的所有元素，在这种情况下这将是不正确的。

根据gridview内另一个下拉列表中选择的值，禁用gridview内的下拉列表

2 个答案: