ASP.NET MVC Checboxes禁用/启用文本框

Question

我有一个带有三个文本框和一个CheckBox的视图：

    @foreach( var item in Model )
{
    <tr>
        <td>
            @Html.CheckBox("name")
        </td>
        <td>
            @Html.EditorFor(m => item.Toolbox)
        </td>
        <td>
            @Html.EditorFor(m => item.Name)
        </td>
        <td>
            @Html.EditorFor(m => item.Link)
        </td>
    </tr>
}

以及如何创建JS代码以将此复选框绑定到不同的文本框？ 每次创建循环时，此“名称”复选框都应禁用/启用三个文本框。 模型中有500多个项目。

Answer 1

您可以设置计数器并为每个块创建唯一的类或某些属性。 例如：

<table id="myTable">
     @{
            int c = 0;
            for(int i = 0; i < Model.Count; i++)
            {
                c++;
                <tr class="@("block"+c)">
                    <td>
                        @Html.CheckBox("name", new {data_block=c})
                    </td>
                    <td>
                        @Html.EditorFor(m => item.Toolbox)
                    </td>
                    <td>
                        @Html.EditorFor(m => item.Name)
                    </td>
                    <td>
                        @Html.EditorFor(m => item.Link)
                    </td>
                </tr>
            }
</table>

然后是javascript代码：

$(function(){
        $('#myTable checkboxes').click(function(){
            var checkbox = $(this),
            blockNum = checkbox.data('block'),
            inputs = $('tr.block'+blockNum),
            state = checkbox.is(':checked');

            $.each( inputs, function( i, el ){
                $(el).prop("disabled", state);
            });
        });
    });

Answer 2

其他方式

<table id="myTable">
                @foreach( var item in Model )
                {
                    <tr>
                        <td>
                            @Html.CheckBox("name", new { @class = "nameCheckbox" })
                        </td>
                        <td>
                            @Html.TextBoxFor(m => item.Toolbox, new { @class = "someCleverClassName" })
                        </td>
                        <td>
                            @Html.TextBoxFor(m => item.Name, new { @class="someCleverClassName" })
                        </td>
                        <td>
                            @Html.TextBoxFor(m => item.Link, new { @class="someCleverClassName" })
                        </td>
                    </tr>
                }
            </table>

和JavaScript

$(function(){
    $('#myTable .nameCheckbox').click(function(){
        $(this).closest('tr').find('.someCleverClassName').prop("disabled", $(this).prop('checked'));
    });
});