Question

Hands up – I can’t figure it out what’s wrong with it. Is that a bug or a wrong code ?

    $(document).ready(function() {
    $("#rem_but").click(function(){

    var mail_name = $("#mail_rem").val();
    var dataString = 'mail_name='+ mail_name;


    if (mail_name.val() == "") {  $("#rem_but").attr("disabled",true); } 
    else {  $("#rem_but").removeAttr("disabled"); };
}); });

So when there’s no input the button returns false correctly – when there’s an input in the field – still the button returns false, hence the removeAttr() doesn’t work – why ? Regards.

Answer 1

Are you using jQuery 1.6.x?

If so then you should try using the .prop() function. See below:

Disable/enable an input with jQuery?

Also, in your if statement no need to keep selecting $("#rem_but"). Based on your code I would recommend $(this) instead –

$(this).prop('disabled', true);

This should work –

$(document).ready(function() {
 $("#rem_but").click(function(e) {

 e.preventDefault();

 var mail_name = $.trim($("#mail_rem").val());
 var dataString = 'mail_name='+ mail_name;

 if (mail_name === "") {  
    $(this).prop("disabled", true); }
 else {  
    $(this).prop("disabled", false); }
 });
});

Here is the working jsFiddle code –

http://jsfiddle.net/4rPc5/

Updated code –

http://jsfiddle.net/4rPc5/2/