Check if input has specific value

Question

I am using Jquery to check if an input has a specific value and if it does have that value it will enable the submit button. The problem is I set the value to 4 but if 44 (or anything that begins with 4) is entered it still enables the button. Also once 4 is entered it can be changed to anything and the button remains enabled.

What I would like it to do is only change to enabled if the value is 4 and if the value is changed then the the submit button should be disabled.

Jquery

$(document).ready(function() {
    $('#check').keyup(function() {
        if($(this).val() === '4') {
            $('.submit').removeAttr('disabled');
        }
    });
});

HTML

<input id="check" type="text" name="check" />

<input type="submit" name="submit" class="submit" disabled="disabled">

Matteo Tassinari · Accepted Answer · 2021-02-11 12:59:14Z

4

Try this:

$('#check').change(function() {
    if($(this).val() === '4') {
        $('.submit').removeAttr('disabled');
    }
    else $('.submit').attr('disabled', 'disabled');
});

in fact you need to re-disable the submit button if you wish so when the value is not 4.

Better yet, instead of

$('.submit').attr('disabled', 'disabled');

you could/should use

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

so the handler becomes

$('#check').change(function() {
    if($(this).val() === '4') {
        $('.submit').removeAttr('disabled');
    }
    else $('.submit').prop('disabled', true);
});

or even simpler

$('#check').change(function() {
    $('.submit').prop('disabled', $(this).val() !== '4');
});

edited Feb 11, 2021 at 12:59

answered Nov 27, 2013 at 17:41

Matteo Tassinari

18.6k8 gold badges65 silver badges85 bronze badges

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

Comments

codingrose · Accepted Answer · 2013-11-27 17:41:45Z

0

Its happening because you are not disabling button if value is not 4.

$('#check').keyup(function() {
    if($(this).val() === '4') {
        $('.submit').removeAttr('disabled');
    }
    else{
        $('.submit').attr('disabled','disabled');
    }
});

answered Nov 27, 2013 at 17:41

codingrose

15.7k11 gold badges41 silver badges58 bronze badges

Comments

Joel Peltonen · Accepted Answer · 2013-11-27 17:41:57Z

0

Simply add an else that disables it :)

$(document).ready(function() {
    $('#check').keyup(function() {
        if($(this).val() === '4') {
            $('.submit').removeAttr('disabled');
        } else {
            $('.submit').prop('disabled', true);
        }
    });
});

answered Nov 27, 2013 at 17:41

Joel Peltonen

13.5k7 gold badges68 silver badges108 bronze badges

Comments

scrblnrd3 · Accepted Answer · 2013-11-27 17:41:58Z

0

You need to redisable it.

$(document).ready(function() {
    $('#check').change(function() {
        if($(this).val() === '4') {
            $('.submit').removeAttr('disabled');
        }else{
            $('.submit').prop('disabled');
        }
});

answered Nov 27, 2013 at 17:41

scrblnrd3

7,4349 gold badges36 silver badges65 bronze badges

Comments

j08691 · Accepted Answer · 2013-11-27 17:48:44Z

0

Use:

$('#check').keyup(function () {
    $('.submit').prop('disabled', $(this).val() !== '4' );
});

jsFiddle example

answered Nov 27, 2013 at 17:48

j08691

208k33 gold badges269 silver badges281 bronze badges

Collectives™ on Stack Overflow

Check if input has specific value

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related