Trying to disable button when input text field is empty

Question

I am having an input text field and a button. When the text field is empty the button should disable. when the field is filled the button should be enable. I tried with the following code but not working properly help me!

$(document).ready(function(){
$("#wmclrsrch").attr("disabled", "disabled");

if ( $('#search_number').is(":empty") ) {
    alert ("verdadeiro");
    $("#wmclrsrch").attr("disabled", true);
}
$('#wmsearch').click(function(){
    $("#wmclrsrch").attr("disabled", false);
    $("#wmclrsrch").attr("enabled", true);
});

});

The HTML is:

<form id="form">
   <label for="search_number">Mobile Number:</label>
   <input id="search_number" type="text" />
   <button id="wmclrsrch">Clear Search</button>
</form>

Thanks in Advance,

Ram · Accepted Answer · 2013-02-15 14:43:47Z

1

You can listen the keyup event and use prop method.

$(document).ready(function(){ 
    $('#search_number').keyup(function(){
        $("#wmclrsrch").prop("disabled", !this.value.length);    
    }).keyup();
});

answered Feb 15, 2013 at 14:43

Ram

145k16 gold badges174 silver badges201 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

sdespont · Accepted Answer · 2013-02-15 14:43:01Z

0

Check input text using keyup event :

$('#search_number').keyup(function(){
    if($(this).val() != '')
    {
        //Eneable your button here
    }
    else
    {
        //Disable your button here
    }
});

answered Feb 15, 2013 at 14:43

sdespont

14.1k9 gold badges62 silver badges99 bronze badges

Comments

Fabien · Accepted Answer · 2017-08-08 04:40:07Z

0

You can try the following script:

<script>
/*
 *
 * A tiny jQuery plugin that could control the button's state
 *
 * code from https://github.com/jvyyuie/snbutton
 *
 */
var SNButton = {
    init: function(e) {
        var snnode = "#"+$("#"+e).data("snnode");
        $("#"+e).attr("disabled", ""==$(snnode).val());
        $(snnode).on('input propertychange', function() {
            $("#"+e).attr("disabled", ""==$(snnode).val());
        });
    }
}
</script>

<input id="textinput" />
<button id="btn" data-snnode="textinput">Button</button>

<script>
SNButton.init("btn");
</script>

It is a very simple jquery plugin that disables button when some input filed is empty.

edited Aug 8, 2017 at 4:40

Fabien

4,9502 gold badges21 silver badges33 bronze badges

answered Aug 7, 2017 at 20:04

user1589583

1

Collectives™ on Stack Overflow

Trying to disable button when input text field is empty

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related