Question

@using (Html.BeginForm(null, null, FormMethod.Post, new { Id = "form" }))
{
    @Html.DropDownList("Roles",newSelectList((IEnumerable<EmployeeManagementSystem.DAO.RoleMaster>)ViewData["Roles"], "RoleId", "RoleName"), "Select Role", new { @id = "ddlRole" })
    <table id="sample_editable_1">
        <tbody>
            @{                                
                var i = 0;
                foreach (var item in Model)
                {
                    <tr>
                        <td style="display: none">@Html.HiddenFor(modelItem => item.privilegeId, new { @id = "hdnPrivilegeId" + i })
                        </td>
                        <td>@Html.CheckBox("CheckBox",false, new { @id = "chkRolePrivilege" + i ,@name="PrivilegeCheckBox"})
                        </td>
                        <td>@Html.LabelFor(modelITem => item.privilegeName, item.privilegeName, new { @id = "privilegeName" + i, Value = item.privilegeName })
                       </td>
                    </tr>
                    i++;
                }
            }
        </tbody>
    </table>
}

我需要根据角色的权限选中复选框。但是，使用jquery在下拉列表的更改事件中未选中/取消选中复选框。但是可以在$(document).ready(function()内检查复选框，但是当我们在更改事件中执行它或其检查的属性不起作用时，所有其他属性（例如禁用等）都正常工作。

    $("#ddlRole").change(function () {
      var roleId = 0;
            var privilegeListName = "";
            var row = $(this).parent().parent();
            roleId = $('#ddlRole :selected').val();
            $.ajax({
                url: "/api/Privilege/GetPrivilegesByRoleId?RoleId=" + roleId,
                type: 'Get',
                contentType: 'application/json; charset=utf-8',
                success: function (data) {

                    for (var i = 0; i < 4; i++) {
                        for (var j = 0; j < 4; j++) {
                            if ($('#sample_editable_1 tr #privilegeName' + i).text() == data[j].privilegeName.trim()) {

                                $('#chkRolePrivilege' + i).attr('checked', true);
                                alert("true");
                            }
                            else {
                                alert("false");
                            }
                        }
                    }
                }
              });      
            });

Answer 1

这假设您的数据返回类似

的列表

角色= {＆＃39; privilegeName1＆＃39;，＆＃39; privilegeName3＆＃39;}

success: function(data){
   var listRoles = data.Role;
   var cnt = listRoles.length;
   for(var i = 0; i< cnt; i++){
      var privilege = listRoles[i];    // listRole[1] = privilegeName1
      var rId = $.Trim(privilege.replace('privilegeName',''));  //1
      $('#chkRolePrivilege' + rId).attr('checked', true); //chkRolePrivilege1 checked
   }
}

基本上，您在列表中真正需要的只是您要检查的复选框的ID。如果您将复选框的ID设置为与privilegeName的数据库ID相同，那么替换和修剪将不再必要。

修改

替代方案是

$('#chkRolePrivilege' + rId).attr('checked', 'checked');

或使用.prop

$('#chkRolePrivilege' + rId).prop('checked', true); $('#chkRolePrivilege' + rId).prop('checked', 'checked');

Answer 2

我只是对现有代码进行了一些小改动，我将Checked属性设置为Checked而不是true。有时它有效。请尝试一次：

("#ddlRole").change(function () {
          var roleId = 0;
                var privilegeListName = "";
                var row = $(this).parent().parent();
                roleId = $('#ddlRole :selected').val();
                $.ajax({
                    url: "/api/Privilege/GetPrivilegesByRoleId?RoleId=" + roleId,
                    type: 'Get',
                    contentType: 'application/json; charset=utf-8',
                    success: function (data) {

                        for (var i = 0; i < 4; i++) {
                            for (var j = 0; j < 4; j++) {
                                if ($('#sample_editable_1 tr #privilegeName' + i).text() == data[j].privilegeName.trim()) {

                                    $('#chkRolePrivilege' + i).attr('checked', 'checked');
                                    alert("true");
                                }
                                else {
                                    alert("false");
                                }
                            }
                        }
                    }
                  });      
                });

Answer 3

也许这会有所帮助：razor为具有相同名称属性的Html.CheckBox生成两个输入。第二个输入具有type = hidden并存储value = true / false。这样做是为了发送未检查的值。

复选框未在mvc中使用jquery检查/取消选中下拉列表中的更改事件

3 个答案: