如何以编程方式设置 jQuery 下拉检查列表的值？

Question

如何以编程方式将某些复选框设置为选中状态？

场景如下： 一旦我通过管理屏幕创建用户，我就会有几个 jqueryDropdown 复选框，一个用于“用户角色”，一个用于“用户区域”，因为用户可以拥有与他/她关联的多个角色和多个区域。没问题，我已经完成并保存到数据库中。 我还为用户提供了更新用户角色和区域的能力，并且我想通过 jQuery 下拉检查列表来完成此操作，因此我的方法如下：

1. 为他们提供用于创建用户的相同屏幕
2. 发出 Ajax 请求获取用户特定的角色和区域。
3. 现在我想做的是基于 Ajax 响应集，通过 DOM 脚本检查与响应值匹配的复选框。有人知道该怎么做吗？

Answer 1

我已经找到了我自己问题的答案。首先我想提一下，我想填充这个 jquery 组件 http: //dropdown-check-list.googlecode.com/svn/trunk/doc/dropdownchecklist.html 如果我原来的问题有误导性，我们深表歉意。

填充我的 jquery 下拉清单插件的 Javascript 如下：

$(document).ready(function() {

    //These will apply the jquery drop down checklist to both of selects
    $(".s1").dropdownchecklist({ width: 205});
    $( "button, input:button", null).button();
    loadUserRoles();
    loadUserRegions();
});


function loadUserRoles(){

    var userName = $("#userName").val();
    var hostname = getHostName();
var requestURL = hostname.concat("fos", "/users/userRoles?userName="+userName);

    $.getJSON(requestURL, null, function(data){
        var userRoles = new Array();

        $.each(data.list, function(i,item){
            userRoles.push(item.id.toString());
        });

        $("#role").dropdownchecklist("destroy");
        $("#role").val(userRoles);
        $("#role").dropdownchecklist();
        //$("#role").dropdownchecklist("refresh");
});
}

function loadUserRegions(){

    var userName = $("#userName").val();
    var hostname = getHostName();
var requestURL = hostname.concat("fos", "/users/userRegions?userName="+userName);

    $.getJSON(requestURL, null, function(data){
        var userRegions = new Array();

        $.each(data.list, function(i,item){
            userRegions.push(item.id.toString());
        });

         $("#region").dropdownchecklist("destroy");
         $("#region").val(userRegions);
         $("#region").dropdownchecklist();
});
}

function getHostName(){

var url = document.URL;
var rv = url.indexOf("fos");
var hostname = url.substring(0, rv);
return hostname;
}

返回 JSON 的 grails 操作如下

def userRoles = {

  /* This action gets the user roles and returns it as JSON*/
    def user = Users.findByUserName(params["userName"])
    def rolesInstanceList = Authorities.findAllByUser(user)

    def outputList = new JSONObject()
    def rolesList = new JSONArray()
    def jsonRole = null

    rolesInstanceList.each {
      jsonRole = new JSONObject()
      def role = it.role
      jsonRole.put("id", role.id)
      jsonRole.put("roleName", role.roleName)
      rolesList.put(jsonRole)
    }
    outputList.put("list", rolesList)
    render outputList as JSON      
}

Answer 2

我创建了一个类结构，其中一般创建了 DDCL，并且代码：

$('#selectorid').dropdownchecklist('destroy');

破坏了最初创建的 DDCL 的完整性。

我发现这个解决方案更适合我的应用程序：

$('#selectorid').val(values);
$('#selectorid').dropdownchecklist('refresh');

其中“值”是值数组（例如 [1, 2, 3]）。这不会破坏最初创建的 DDCL 的完整性。

Answer 3

返回一些带有状态的 JSON...

{
  "roles": {
    "role1": true,
    "role2": false
  },
  ...
}

然后一些 jQuery 应该做到这一点...

$.each(json.roles, function(role, state) {

   $(':checkbox[name="' + role + '"]')[0].checked = state;

});