1

入れ子になった属性を持つ、ajax で読み込まれた json データで select2 を動作させようとしています。このようなものを手に入れたいhttp://ivaynberg.github.io/select2/#multi

サンプル json:

[{
  id: 1,
  name: "GroupName",
  users: [{id: 1, name: 'UserName'}, {id: 2, name: 'SecondUser}]
 }]

<optgroup label="GroupName"><option value="1">UserName</opyion></optgroup>彼らが使用し、正しい結果を得ているサイトで。

私の場合、ネストは適切に表示されますが、選択できるのは のみですが、ネストされたものを選択してGroupName選択不可にする必要があり、情報提供のみを目的としています。userNameGrouoName

コード:

$('#user_tokens').select2({
  placeholder: "Search for a user",
  minimumInputLength: 0,
  tags: true,
  multiple: true,
  ajax: {
    url: "messages/users_data.json",
    dataType: 'json',
    quietMillis: 100,
    data:  function(search, page) {
      return {
        q: search,
        per: 3,
        page: page
      };
    },
    results: function(data, page) {
      return { 
        results: data,
         };
    }
  },
  formatResult: formatResult,
  formatSelection: formatSelection,
  dropdownCssClass: "bigdrop"
});

フォーマット結果:

   var formatUserResult = function(data) {
     var optgroup = "";
     var users = "";
       if (data.name !== undefined) {
         data.users.forEach(function(e) {
           users += "<li class='select2-results-dept-1 select2-result select2-result-    selectable'>" + 
           "<div class='select2-result-label'>" +
             "<span class='select2-match'></span>"+
             e.firstname +
           "</div>" +
         "</li>";
         });
         optgroup += "<div class='select2-result-label'>" + 
         "<span class='select2-match'></span>" + 
         data.name + "</div>" +
         '<ul class="select2-result-sub">' + users + '</ul>';
       }
       return optgroup;
     }

問題は、optgroup をclass: 'select2-result-unselectable' どうするかという Dunno が必要なことです。

4

0 に答える 0