/** * jQuery PickList Widget * * Copyright (c) 2012 Jonathon Freeman * Distributed under the terms of the MIT License. * * http://code.google.com/p/jquery-ui-picklist/ */ (function($) { $.widget("awnry.pickList", { options: { // Container classes mainClass: "pickList", listContainerClass: "pickList_listContainer", sourceListContainerClass: "pickList_sourceListContainer", controlsContainerClass: "pickList_controlsContainer", targetListContainerClass: "pickList_targetListContainer", listClass: "pickList_list", sourceListClass: "pickList_sourceList", targetListClass: "pickList_targetList", clearClass: "pickList_clear", // List item classes listItemClass: "pickList_listItem", richListItemClass: "pickList_richListItem", selectedListItemClass: "pickList_selectedListItem", // Control classes addAllClass: "pickList_addAll", addClass: "pickList_add", removeAllClass: "pickList_removeAll", removeClass: "pickList_remove", // Control labels addAllLabel: ">>", addLabel: ">", removeAllLabel: "<<", removeLabel: "<", // List labels listLabelClass: "pickList_listLabel", sourceListLabel: "Available", sourceListLabelClass: "pickList_sourceListLabel", targetListLabel: "Selected", targetListLabelClass: "pickList_targetListLabel", // Sorting sortItems: true, sortAttribute: "label", // Name of custom value attribute for list items listItemValueAttribute: "data-value", // Additional list items items: [] }, _create: function() { var self = this; self._buildPickList(); self._refresh(); }, _buildPickList: function() { var self = this; self._trigger("beforeBuild"); self.pickList = $("
") .hide() .addClass(self.options.mainClass) .insertAfter(self.element) .append(self._buildSourceList()) .append(self._buildControls()) .append(self._buildTargetList()) .append( $("
").addClass(self.options.clearClass) ); self._populateLists(); self.element.hide(); self.pickList.show(); self._trigger("afterBuild"); }, _buildSourceList: function() { var self = this; var container = $("
") .addClass(self.options.listContainerClass) .addClass(self.options.sourceListContainerClass) .css({ "-moz-user-select": "none", "-webkit-user-select": "none", "user-select": "none", "-ms-user-select": "none" }) .each(function() { this.onselectstart = function() { return false; }; }); var label = $("
") .text(self.options.sourceListLabel) .addClass(self.options.listLabelClass) .addClass(self.options.sourceListLabelClass); self.sourceList = $("
    ") .addClass(self.options.listClass) .addClass(self.options.sourceListClass) .delegate("li", "click", { pickList: self }, self._changeHandler); container .append(label) .append(self.sourceList); return container; }, _buildTargetList: function() { var self = this; var container = $("
    ") .addClass(self.options.listContainerClass) .addClass(self.options.targetListContainerClass) .css({ "-moz-user-select": "none", "-webkit-user-select": "none", "user-select": "none", "-ms-user-select": "none" }) .each(function() { this.onselectstart = function() { return false; }; }); var label = $("
    ") .text(self.options.targetListLabel) .addClass(self.options.listLabelClass) .addClass(self.options.targetListLabelClass); self.targetList = $("
      ") .addClass(self.options.listClass) .addClass(self.options.targetListClass) .delegate("li", "click", { pickList: self }, self._changeHandler); container .append(label) .append(self.targetList); return container; }, _buildControls: function() { var self = this; self.controls = $("
      ").addClass(self.options.controlsContainerClass); self.addAllButton = $("