JQuery reset value of text input when checkbox is unchecked

Question

I have a fieldset in my form that has a check box tied to a text input. When the checkbox is checked/unchecked it toggles the readonly attribute of the text input.

When the checkbox is unchecked I would like the text input value to reset to 0.

Here is my

<label for="device-9102" class="form-partner-label"><input type="checkbox" class="quote-chkbox" id="9102-chk"> 9102 IP Phone</label>
<input type="text" name="9102-quantity" class="form-endpoint-qty form-control" id="form-partner-9102" readonly value="0">

Here is the JQuery that currently sets the readonly value for the text input:

$("#9102-chk").change(function() {
        $("#form-partner-9102").prop("readonly", !$(this).is(":checked"));
});

How do I reset the value of the text input to 0 when the checkbox is unchecked?

Use the val(value) function to set it to 0?

Heretic Monkey
– Heretic Monkey

2017-06-27 22:19:51 +00:00
Commented Jun 27, 2017 at 22:19 — Heretic Monkey
– Heretic Monkey, Commented Jun 27, 2017 at 22:19

Omi · Accepted Answer · 2017-06-27 22:22:46Z

4

First you need to check for checkbox is checked or not & then set the value to input using .val()

$("#9102-chk").change(function() {
     var is_checked = $(this).is(":checked");
     if(!is_checked) {
      $("#form-partner-9102").val(0);
     }
     $("#form-partner-9102").prop("readonly", !is_checked);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label for="device-9102" class="form-partner-label"><input type="checkbox" class="quote-chkbox" id="9102-chk"> 9102 IP Phone</label>
<input type="text" name="9102-quantity" class="form-endpoint-qty form-control" id="form-partner-9102" readonly value="0">

answered Jun 27, 2017 at 22:22

Omi

4,0175 gold badges24 silver badges44 bronze badges

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

1 Comment

K. Carskadon Over a year ago

Outstanding! Thank you!

Collectives™ on Stack Overflow

JQuery reset value of text input when checkbox is unchecked

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related