Question

请结合这种情况：

我有一个包含3个下拉列表的表单。我将这些控件放在update panel中。当我的用户在第一个下拉列表中选择值大于2的项时，我禁用第二个和第三个下拉列表jQuery的。我的问题是在任何帖子后面所有下拉列表都启用。我知道这是正常的，但我如何再次检查表单并禁用应该禁用的控件？

感谢

修改1）

这是我的代码：

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
        <ContentTemplate>
            <table border="1" cellpadding="0" cellspacing="0">
                <tr>
                    <td>
                        <asp:DropDownList ID="DropDownList1" runat="server" Width="100px">
                            <asp:ListItem Value="1" Text="1" />
                            <asp:ListItem Value="2" Text="2" />
                            <asp:ListItem Value="3" Text="3" />
                        </asp:DropDownList>
                    </td>
                </tr>
                <tr>
                    <td>
                        <asp:DropDownList ID="DropDownList2" runat="server" Width="100px">
                            <asp:ListItem Value="1" Text="1" />
                            <asp:ListItem Value="2" Text="2" />
                            <asp:ListItem Value="3" Text="3" />
                        </asp:DropDownList>
                    </td>
                </tr>
                <tr>
                    <td>
                        <asp:DropDownList ID="DropDownList3" runat="server" Width="100px">
                            <asp:ListItem Value="1" Text="1" />
                            <asp:ListItem Value="2" Text="2" />
                            <asp:ListItem Value="3" Text="3" />
                        </asp:DropDownList>
                        <br />
                    </td>
                </tr>
            </table>
            <div>
                <asp:Button ID="Button1" runat="server" Text="Cause Post Back" Width="200px" 
                    onclick="Button1_Click"/>
            </div>
        </ContentTemplate>
    </asp:UpdatePanel>

和javascript：

 $(document).ready(function () {
        function Disable(item) {
            item.attr('disabled', 'disabled');
        }
        $('#DropDownList1').change(function () {
            if ($(this).val() > 2) {
                Disable($('#DropDownList2'));
                Disable($('#DropDownList3'));
            }
            else {
                Enable($('#DropDownList2'));
                Enable($('#DropDownList3'));
            }
        }).change();

        function Enable(item) {
            item.removeAttr('disabled');
        }
    });

Answer 1

我错过了什么吗？

$('#dropdown1').change(function()
{
    if ( $(this).val() > 2 )
    {
        $('#dropdown2, #dropdown3').prop('disabled', true);
    }
    else
    {
        $('#dropdown2, #dropdown3').prop('disabled', false);
    }
})
.change();

Answer 2

问题是由于updatepanel，因为它会部分回发你的页面。请将您的Jquery放在功能pageLoad（）

中

  function pageLoad() { 
    // Put your code here... 
  }

希望它能解决您的问题。

Answer 3

试试这个

  AutoPostBack="true"

作为

 <asp:DropDownList ID="DropDownList1" runat="server" Width="100px" 
       AutoPostBack="true">
                            <asp:ListItem Value="1" Text="1" />
                            <asp:ListItem Value="2" Text="2" />
                            <asp:ListItem Value="3" Text="3" />
                        </asp:DropDownList>

Answer 4

添加一个隐藏字段，用于存储下拉列表的状态...例如0 =禁用，1 =启用...当您禁用下拉列表时，将隐藏字段的值设置为0 ..当启用时将其设置为1.然后在发布并重新加载表单时，读取隐藏字段的值并相应地启用/禁用下拉列表。

$(function(){

   if($("#hiddenFieldID").val()=="0")
       //disable
   else
      //enable          

});

如何在回发后检查表单

感谢

4 个答案: