Enable/Disable Asp.net Image button during postback

Question

I am trying to check if user is available or not in the database for that I have kept a button named " Check availability ".Once when user clicks that he can checks whether the name exists in the database or not and changes the textbox background color to red if "exists" and "green" if not

Now I have a registration page where the user fills the form if the user exists I need to disable the SignUp button which I am using the " Image button " for it.

So What happens is I am unable to disable it while the user is available. When I am disabling the Image button(ie..the SignUp button) during page load and after the user fills the form though the user is available the page is refreshing and submitting the information to the database as a duplicate field .

And these are the many ways I have worked out but none worked out for me.

.enabled = true;

.disabled = false;

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

$('#ButtonId').prop("disabled", true); ->> disabled
$('#ButtonId').prop("disabled", false); ->> Enabled

Here is my code:

<script type="text/javascript">
    $(function () {
        $("#<% =btnavailable.ClientID %>").click(function () {
            if ($("#<% =txtUserName.ClientID %>").val() == "") {
                $("#<% =txtUserName.ClientID %>").removeClass().addClass('notavailablecss').text('Required field cannot be blank').fadeIn("slow");

            } else {
                $("#<% =txtUserName.ClientID %>").removeClass().addClass('messagebox').text('Checking...').fadeIn("slow");
                $.post("LoginHandler.ashx", { uname: $("#<% =txtUserName.ClientID %>").val() }, function (result) {
                    if (result == "1") {

                        $("#<% =txtUserName.ClientID %>").addClass('notavailablecss').fadeTo(900, 1);
                      document.getElementById('<%= btnSignUp.ClientID %>').enabled = false;
                    }
                    else if (result == "0") {
                        $("#<% =txtUserName.ClientID %>").addClass('availablecss').fadeTo(900, 1);
                        document.getElementById('<%= btnSignUp.ClientID %>').enabled = true;
                    }
                    else {
                        $("#<% =txtUserName.ClientID %>").addClass('notavailablecss').fadeTo(900, 1);

                    }
                });
            }
        });

        $("#<% =btnavailable.ClientID %>").ajaxError(function (event, request, settings, error) {
            alert("Error requesting page " + settings.url + " Error:" + error);
        });
    });
</script>

This is my handler code:

Public Class LoginHandler : Implements IHttpHandler

Public Sub ProcessRequest(ByVal context As HttpContext) Implements IHttpHandler.ProcessRequest

    Dim uname As String = context.Request("uname")
    Dim result As String = "0"
    If uname IsNot Nothing Then
        result = CheckUnAvailable(uname)
    End If
    context.Response.Write(result)
    context.Response.[End]()
End Sub
Public Function CheckUnAvailable(ByVal name As String) As String
    Dim result As String = "0"
    Dim con As New SqlConnection(ConfigurationManager.ConnectionStrings("HDIConnectionString").ConnectionString)
    Try
        con.Open()
        Dim com As New SqlCommand("Select Username from Registration where Username=@UserName", con)
        com.Parameters.AddWithValue("@UserName", name)
        Dim uname As Object = com.ExecuteScalar()
        If uname IsNot Nothing Then
            result = "1"
        End If
    Catch
        result = "error"
    Finally
        con.Close()
    End Try
    Return result
End Function
Public ReadOnly Property IsReusable() As Boolean Implements IHttpHandler.IsReusable
    Get
        Return False
    End Get
End Property

Updated Code for Check Availability Click:

  If txtUserName.BackColor = Drawing.Color.Red Then
        btnSignUp.Enabled = False
    ElseIf txtUserName.BackColor = Drawing.Color.Green Then
        btnSignUp.Enabled = True
    End If

Answer 1

Try using: disabled=disabled

EDIT

Try: $('#ButtonId').removeProp("disabled");

Answer 2

If the button is an Asp.Net button:

$('#<%= button.ClientID %>').prop("disabled", true);

Or...

$("[id$=ButtonId]").prop("disabled", true);