enable textbox when checkbox checked in a TABLE ROW

Question

My submit.cshtml is:

<table id="scDetails" class="table">
    <thead>
        <tr>
            <th>Item</th>
            <th>IsChecked</th>
            <th>Comment</th>
        </tr>
    </thead>
    <tbody>
        @Html.EditorFor(m => m.Fbacks)
    </tbody>
</table>

EditorTemplate is for - @Html.EditorFor(m => m.Fbacks) (Fbacks.cshtml)

<tr>
  <td>@Html.HiddenFor(m => m.Item)
    @Html.DisplayFor(m => m.Item)
  </td>
  <td>@Html.CheckBoxFor(m => m.IsChecked)</td>
  <td>@Html.TextBoxFor(m => m.Comment)</td>
</tr>

What I need is:

When I check the checkbox, textbox should be enabled and when uncheck, textbox should disabled.

Which version of jQuery are you using?

Sang Suantak
– Sang Suantak

2012-09-25 07:37:07 +00:00
Commented Sep 25, 2012 at 7:37 — Sang Suantak
– Sang Suantak, Commented Sep 25, 2012 at 7:37

alex · Accepted Answer · 2012-09-25 07:40:03Z

2

$("input[type='checkbox']").on("click", function() {
    $(this).parent().next().find("textarea").prop("disabled", ! this.checked);
});

answered Sep 25, 2012 at 7:40

alex

492k205 gold badges890 silver badges992 bronze badges

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

1 Comment

user1282609 Over a year ago

This need to be written on submit.cshtml or Fbacks.cshtml page? Do I need to replace "textarea" with "textbox". Please.

Sushanth -- · Accepted Answer · 2012-09-25 07:48:14Z

1

$('input[type=checkbox]').on('click', function() {
    var isChecked = $(this).is(':checked');

    $(this).parent().next().find('input[type="text"]').attr('disabled', !isChecked);
}); 

// OR

$('input[type=checkbox]').on('click', function() {
        var isChecked = $(this).is(':checked');

        $(this).parent().parent().find('input[type="text"]').attr('disabled', !isChecked);
    });

edited Sep 25, 2012 at 7:48

answered Sep 25, 2012 at 7:37

Sushanth --

55.8k9 gold badges70 silver badges109 bronze badges

1 Comment

user1282609 Over a year ago

Do i need to specify any Id on EditorTemplate? Fbacks.cshtml page? or Submit.cshtml page

Anton Baksheiev · Accepted Answer · 2012-09-25 07:38:51Z

1

You should add event to checkbox

$('#Fbacks').click (function ()
{
     var thisCheck = $(this);
     if (thischeck.is (':checked'))
     {
       $('#Comment').prop('disabled', true);
     }else{
       $('#Comment').prop('disabled', false);
     }
});

in this case @Html.EditorFor(m => m.Fbacks) id = 'Fbacks'

answered Sep 25, 2012 at 7:38

Anton Baksheiev

2,2512 gold badges15 silver badges15 bronze badges

4 Comments

user1282609 Over a year ago

Do i need to specify any Id on EditorTemplate?

user1282609 Over a year ago

This need to be written on Submit.cshtml or? EditorTemplate page?

Anton Baksheiev Over a year ago

This can be written in any place, The main think that this code executed after document.ready(). On the bissuness logic i will be put it on EditorTemplate as it logic of editForm.

Anton Baksheiev Over a year ago

but the best place of js code is separate file, which should be included in master page

Collectives™ on Stack Overflow

enable textbox when checkbox checked in a TABLE ROW

3 Answers 3

1 Comment

1 Comment

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

1 Comment

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related