Changeset 28501 for trunk/admin/themes/default/template/user_list.tpl

Timestamp:

May 18, 2014, 1:57:18 PM (10 years ago)

Author:

mistic100

Message:

feature 3077 : use Selectize on user_list

File:

• trunk/admin/themes/default/template/user_list.tpl (modified) (3 diffs)

trunk/admin/themes/default/template/user_list.tpl

@@ -4 +4 @@
 {combine_css path="themes/default/js/plugins/datatables/css/jquery.dataTables.css"}
 
-{combine_script id='jquery.chosen' load='footer' path='themes/default/js/plugins/chosen.jquery.min.js'}
-{combine_css path="themes/default/js/plugins/chosen.css"}
+{combine_script id='jquery.selectize' load='footer' path='themes/default/js/plugins/selectize.min.js'}
+{combine_css id='jquery.selectize' path="themes/default/js/plugins/selectize.default.css"}
 
 {combine_script id='jquery.underscore' load='footer' path='themes/default/js/plugins/underscore.js'}
@@ -275 +275 @@
           jQuery("#user"+userId).append(template(user));
 
-          jQuery(".chzn-select").chosen();
+          /* groups select */
+          jQuery('[data-selectize=groups]').selectize({
+            valueField: 'value',
+            labelField: 'label',
+            searchField: ['label'],
+            plugins: ['remove_button']
+          });
+
+          var groupSelectize = jQuery('[data-selectize=groups]')[0].selectize;
+
+          groupSelectize.load(function(callback) {
+            callback(user.groupOptions);
+          });
+
+          jQuery.each(jQuery.grep(user.groupOptions, function(group) {
+            return group.isSelected;
+          }), function(i, group) {
+            groupSelectize.addItem(group.value);
+          });
 
           /* nb_image_page slider */
@@ -1087 +1105 @@
 
       <div class="userProperty"><strong>{'Groups'|translate}</strong><br>
-        <select multiple class="chzn-select" style="width:340px;" name="group_id[]">
-<% _.each( user.groupOptions, function( option ){ %>
-          <option value="<%- option.value%>" <% if (option.isSelected) { %>selected="selected"<% } %>><%- option.label %></option>
-<% }); %>
-        </select>
+        <select data-selectize="groups" name="group_id[]" multiple style="width:340px;"></select>
       </div>
     </div>