在页面加载时禁用下拉列表答案

【问题标题】：disable dropdownlist on page load在页面加载时禁用下拉列表
【发布时间】：2014-01-02 15:34:30
【问题描述】：

我从数据库中填充了 2 个下拉列表：我想要的是在页面加载时禁用第二个，当第一个的值 =="1" 时。

这是我的第二个下拉列表：

<asp:DropDownList ID="DropDownList2" runat="server"  AutoPostBack="True"
                  DataSourceID="SqlDataSource2" DataTextField="BName" DataValueField="BId"  
                  OnDataBound="DownList2_DataBound" 
                  OnSelectedIndexChanged="DropDownList2_SelectedIndexChanged">
</asp:DropDownList>

这是我试图禁用 dropdownlist2 (javascript) 的原因：

<script type="text/javascript">
    window.onload = function () {
        document.getElementById('DropDownList2').disabled = true;
    }
</script>

在 C# 代码中尝试了另一件事：

protected void Page_Load(object sender, EventArgs e)
{
    if (DropDownList1.SelectedValue.ToString() == "1")
    { 
        DropDownList2.Enabled = false;
    }
}

我什至在 page_load 中单独尝试过：

DropDownList2.Enabled = false;

问题是它在 SelectedIndexChanged 上为 dropdownlist1 禁用，但在页面加载时没有！我的代码中是否缺少某些内容？

【问题讨论】：

@rene 我看不出有什么问题（谢谢）！但谢谢你让我知道网站规则:)

标签： c# javascript asp.net

【解决方案1】：

此语句允许您将 dropdown2 设置为在页面加载时禁用。

$('#' + '<%=DropDownList2.ClientID%>').attr('disabled',true);

您可以使用 Jquery 执行此操作，如下所示：

 $(document).ready(function () {

      var isPostBack = '<%=IsPostBack%>';
        if (isPostBack == 'False' || $('#' + '<%=DropDownList1.ClientID%>').val() == '1') {
          //This statement allow you to set the dropdown2 to disable 
          $('#' + '<%=DropDownList2.ClientID%>').attr('disabled', true);
      }
      else {
          $('#' + '<%=DropDownList2.ClientID%>').attr('disabled', false);
      }
      $('#' + '<%=DropDownList1.ClientID%>').on("change", function () {
          //Your code here
          if ($('#' + '<%=DropDownList1.ClientID%>').val() == '1') {
                $('#' + '<%=DropDownList2.ClientID%>').attr('disabled', true);
           }
           else {
               $('#' + '<%=DropDownList2.ClientID%>').attr('disabled', false);
           }
        });
  });

【讨论】：

您的代码对我有效并已禁用，但即使我从下拉列表1 中选择另一个值，它仍会保持禁用状态
您是否确认 DropDownList2 仅由此代码禁用和启用。是否有任何代码使DropDownList2 再次禁用？
好的，我了解实际问题。您需要删除您在 selectedIndexChanged 上为 dropdownlist1 编写的代码，然后尝试我编辑的答案。它对我来说很好。

【解决方案2】：

页面加载时DropDownList1.SelectedValue 可能不等于“1”，因为我猜你会以某种方式对其进行数据绑定，这将在之后生效。

尝试为 DropDownList1 添加 SelectedIndexChanged 函数并在此处禁用/启用 DropDownList2。您可以将 Enabled="False" 放在 DropDownList2 的标记中，以确保它以禁用状态启动。

【讨论】：

感谢您的回答，但我已经在页面加载时选择了一个值：选择类别跨度>
您是否能够调试和逐步执行 Page_Load() 代码？使用 Visual Studio 中的中间窗口确定 DropDownList1.SelectedValue.ToString() 的值是什么。您还将查看是否正在执行下一行。
是的，我放了断点，值为 1 并且启用 = false，但我在浏览器中看不到它！
那么是不是代码中其他地方的值被改变了？甚至是客户端？

【解决方案3】：

问题可能是document.getElementById('DropDownList2') 找不到您的下拉列表。列表的 ID 是服务器端值，不一定会转换为客户端 ID。如果将控件的ClientIDMode 设置为Static，则客户端ID 将为DropDownList2。另一种选择是在输出 JavaScript 时访问控件的 ClientID 属性（如果它是内联的）：

document.getElementById('<%=DropDownList2.ClientID%>').disabled = true;

话虽如此，即使是这种情况，最好还是按照 @aaroncatlin 的建议从 Enabled="False" 开始，这样您就不必等待 JavaScript 被禁用之前执行。

【讨论】：

【解决方案4】：

在 ASP.NET 中生成的 ID 与组件上的 asp ID 不同，要从 Javascript 访问元素，您需要使用相应的 javascript 将是这样的：

document.getElementById(<%=DropDownList2.ClientID%>).disabled = true;

【讨论】：

【解决方案5】：

DropDownList 的默认选定索引为 -1，选定值的值为空。我通常检查选定的索引，而不是按值。例如，

if(DropDownList1.SelectedIndex < 1){
    // assuming that index 0 holds your value of "1"
    DropDownList2.Enabled = false;
}

@Jacob 确实正确地指出了您需要为您的 JavaScript 函数获取正确的 ClientID。

【讨论】：