如果显示隐藏的Div,则禁用单选按钮

时间:2015-12-17 12:49:59

标签: javascript c# jquery asp.net

我有一个Asp.net Web应用程序,在页面上我有一个asp:textbox,它有OnTextChanged函数,用于检查我的数据库并显示错误消息(如果需要)。 / p>

我遇到的问题是我要禁用单选按钮。我尝试在我的代码后面添加它并使用JQuery但我无法让它工作,因为消息有时会延迟几秒钟。

HTML

<asp:Label ID="removeUserNotExist" runat="server" Text="The user entered does not exist. Please try again." Visible="false" style="color: red"></asp:Label>
<asp:Label ID="removeUserAlreadyListed" runat="server" Text="The user entered has already been submitted and is currently in the process of being removed from the list." Visible="false" style="color: red"></asp:Label>
<div class="form-group">        
     <asp:Label runat="server" AssociatedControlID="txtRemoveUser" CssClass="col-sm-offset-2 col-sm-3 control-label">Enter Name To Be Removed</asp:Label>
     <div class="col-sm-3">
          <asp:TextBox runat="server" ID="txtRemoveUser" CssClass="form-control" AutoPostBack="true" OnTextChanged="txtRemoveUser_TextChanged" />
     </div>
</div>
<div class="form-group">
     <asp:Label runat="server" CssClass="col-sm-offset-2 col-sm-3 control-label">
          <b>Request For</b>
     </asp:Label>
     <div class="col-sm-3">
          <label class="radio-inline">
               <asp:RadioButton runat="server" ID="rbRemoveYourself" GroupName="RemoveRequestFor" /> Yourself
          </label>
          <label class="radio-inline">
               <asp:RadioButton runat="server" ID="rbRemoveOtherUser" GroupName="RemoveRequestFor" /> Other User
          </label>
     </div>
</div>

当前的JQuery(这用于禁用我的按钮)

$("#MainContent_txtRemoveUser").on("blur", function ()
        {
            disableButton();
        });

function disableButton()
        {
            var isRbRemoveSelfChecked = $("#MainContent_rbRemoveYourself").is(':checked')
            var isRbRemoveOtherChecked = $("#MainContent_rbRemoveOtherUser").is(':checked')

            if ($('#MainContent_txtRemoveUser').val() != '' && $("#MainContent_removeUserNotExist").is(':visible') || $("#MainContent_removeUserAlreadyListed").is(':visible'))
            {
                $("#MainContent_btnRemoveUser").prop('disabled', true);
            }
            else if ($('#MainContent_txtRemoveUser').val() != '' && isRbRemoveSelfChecked)
            {
                $("#MainContent_btnRemoveUser").prop('disabled', false);
            }
            else if ($('#MainContent_txtRemoveSubmitterName').val() == '' && isRbRemoveOtherChecked)
            {
                $("#MainContent_btnRemoveUser").prop('disabled', true);

                $("#MainContent_txtRemoveSubmitterName").on("blur", function ()
                {
                    if ($('#MainContent_txtRemoveSubmitterName').val() != '')
                    {
                        $("#MainContent_btnRemoveUser").prop('disabled', false);
                    }
                    else
                    {
                        $("#MainContent_btnRemoveUser").prop('disabled', true);
                    }
                });
            }
            else
            {
                $("#MainContent_btnRemoveUser").prop('disabled', true);
            }
        }

代码背后

protected void txtRemoveUser_TextChanged(object sender, EventArgs e)
{
    string connection = ConfigurationManager.ConnectionStrings["PaydayLunchConnectionString1"].ConnectionString;
    SqlConnection conn = new SqlConnection(connection);

    #region Checks the 'Users' db
    conn.Open();
    SqlCommand cmd1 = new SqlCommand("SELECT 1 FROM Users WHERE Name = @Name", conn);
    cmd1.Parameters.AddWithValue("@Name", txtRemoveUser.Text);
    SqlDataReader rd1 = cmd1.ExecuteReader();

    if (rd1.HasRows)
    {
        removeUserNotExist.Visible = false;
        rbRemoveYourself.Enabled = false; (This is what I tried adding)
    }
    else
    {
        removeUserNotExist.Visible = true;
        rbRemoveYourself.Enabled = true; (This is what I tried adding)
    }
    conn.Close();
    #endregion
}

我还尝试了以下JQuery

$("#MainContent_txtRemoveUser").on("blur", function ()
{
    disableButton();

    if ($('#MainContent_removeUserNotExist').text() == '')
    {
        $('#MainContent_rbRemoveYourself').prop('disabled', true);
    }
});

我所追求的是,​​如果显示<asp:Label ID="removeUserNotExist"><asp:Label ID="removeUserAlreadyListed",我希望我的单选按钮被禁用。

1 个答案:

答案 0 :(得分:1)

更改此

<asp:Label ID="removeUserNotExist" runat="server" Text="The user entered does not exist. Please try again." Visible="false" style="color: red"></asp:Label>
<asp:Label ID="removeUserAlreadyListed" runat="server" Text="The user entered has already been submitted and is currently in the process of being removed from the list." Visible="false" style="color: red"></asp:Label>

有了这个

 <asp:Label ID="removeUserNotExist" runat="server"  Visible="false" style="color: red"></asp:Label>
 <asp:Label ID="removeUserAlreadyListed" runat="server" Visible="false" style="color: red"></asp:Label>


OnTextChanged Event : Set your Label Value

然后在ServerSide上调用Javascript函数,

 function disableradioButton() {
    if ($('#MainContent_removeUserNotExist').text() != '')
    {
        $('#MainContent_rbRemoveYourself').prop('disabled', true);
    }
  }



ScriptManager.RegisterStartupScript(this, GetType(), Guid.NewGuid().ToString(), "Javascript:disableradioButton();", true);