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

本文关键字：启用 文本 禁用 NET MVC Checboxes ASP | 更新日期: 2023-09-27 18:20:50

我有一个包含三个文本框和一个复选框的视图：

    @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代码来将这些复选框绑定到不同的文本框？这个"名称"复选框应该在每次循环创建它时禁用/启用三个文本框。Model中有500多个项目。

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

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

<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>

然后CCD_ 1代码：

$(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);
            });
        });
    });

另一种方式

<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'));
    });
});
相关文章：