enable disable textbox inside a table when checkbox checked

Question

I am using jQuery. How to enable or disable textbox inside a table when checkbox checked. This is my edit.cshtml.

   <table id="scDetails" class="dataTable">
            <thead>
                <tr>
                    <th>RItem</th>
                    <th>IChecked</th>
                    <th>Notes</th>
                </tr>
            </thead>
            <tbody>
                @foreach (var fback in Model.Fbacks)
                {
                    <tr>
                        <td @Html.DisplayFor(m => fback.RItem)</td>
                        <td>@Html.CheckBoxFor(m => fback.IChecked)</td>
                        <td>@Html.TextBoxFor(m => fback.Notes)</td>
                    </tr>
                }
            </tbody>
        </table>

What i have tried is:

 $('td :checkbox').change(function () {
            var parentTx = $(this).closest('tr').find(input[type = "text"]);
            if (this.checked) {
                parentTx.attr("disabled",false);
            } else {
                parentTx.attr("disabled", true);
            }
        });

Where am doing wrong? I dont want to use any classes on the controls to achieve this.

xdazz · Accepted Answer · 2012-09-26 02:22:19Z

8

You missed the quotes, and you could simply your code with:

$('td input[type="checkbox"]').change(function () {
  $(this).closest('tr').find('input[type="text"]').prop('disabled', !this.checked);
}).change();

edited Sep 26, 2012 at 2:22

answered Sep 26, 2012 at 2:11

xdazz

161k38 gold badges255 silver badges278 bronze badges

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

6 Comments

xdazz Over a year ago

@undefined Nice point, changed to use [type="..."] selector.

user1282609 Over a year ago

Thank you. it is working but by default when the page renders, the checkboxes which are not checked, those textboxes should be disabled. How can i get this working. Please.

xdazz Over a year ago

@user1282609 trigger the change event after binding, check my update.

xdazz Over a year ago

@user1282609 Did you refresh your page?

xdazz Over a year ago

@user1282609 .val('') will do that for you.

|

Collectives™ on Stack Overflow

enable disable textbox inside a table when checkbox checked

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related