From 3b540fb1cba6aa922e7b40b65a78df103ad947cb Mon Sep 17 00:00:00 2001 From: Boris Staal Date: Fri, 2 May 2014 19:47:27 +0700 Subject: [PATCH 1/3] Unobtrusive support for ngOptions (fixes #46) --- src/select2.js | 20 +++++++++++++++++--- 1 file changed, 17 insertions(+), 3 deletions(-) diff --git a/src/select2.js b/src/select2.js index 828032d..2c02e90 100644 --- a/src/select2.js +++ b/src/select2.js @@ -6,6 +6,9 @@ * @params [options] {object} The configuration options passed to $.fn.select2(). Refer to the documentation */ angular.module('ui.select2', []).value('uiSelect2Config', {}).directive('uiSelect2', ['uiSelect2Config', '$timeout', function (uiSelect2Config, $timeout) { + + NG_OPTIONS_REGEXP = /^\s*(.*?)(?:\s+as\s+(.*?))?(?:\s+group\s+by\s+(.*))?\s+for\s+(?:([\$\w][\$\w]*)|(?:\(\s*([\$\w][\$\w]*)\s*,\s*([\$\w][\$\w]*)\s*\)))\s+in\s+(.*?)(?:\s+track\s+by\s+(.*?))?$/ + var options = {}; if (uiSelect2Config) { angular.extend(options, uiSelect2Config); @@ -17,9 +20,14 @@ angular.module('ui.select2', []).value('uiSelect2Config', {}).directive('uiSelec var watch, repeatOption, repeatAttr, + hasOptions = !!tAttrs.ngOptions, isSelect = tElm.is('select'), isMultiple = angular.isDefined(tAttrs.multiple); + if (hasOptions) { + hasOptions = tAttrs.ngOptions.match(NG_OPTIONS_REGEXP)[7]; + } + // Enable watching of the options dataset if in use if (tElm.is('select')) { repeatOption = tElm.find( 'optgroup[ng-repeat], optgroup[data-ng-repeat], option[ng-repeat], option[data-ng-repeat]'); @@ -93,7 +101,7 @@ angular.module('ui.select2', []).value('uiSelect2Config', {}).directive('uiSelec }, true); controller.$render = function () { if (isSelect) { - elm.select2('val', controller.$viewValue); + elm.select2('val', elm.val()); } else { if (opts.multiple) { var viewValue = controller.$viewValue; @@ -108,7 +116,7 @@ angular.module('ui.select2', []).value('uiSelect2Config', {}).directive('uiSelec } else if (!controller.$viewValue) { elm.select2('data', null); } else { - elm.select2('val', controller.$viewValue); + elm.select2('val', elm.val()); } } } @@ -122,7 +130,7 @@ angular.module('ui.select2', []).value('uiSelect2Config', {}).directive('uiSelec } // Delayed so that the options have time to be rendered $timeout(function () { - elm.select2('val', controller.$viewValue); + elm.select2('val', elm.val()); // Refresh angular to remove the superfluous option elm.trigger('change'); if(newVal && !oldVal && controller.$setPristine) { @@ -132,6 +140,12 @@ angular.module('ui.select2', []).value('uiSelect2Config', {}).directive('uiSelec }); } + if (hasOptions) { + scope.$watchCollection(hasOptions, function(newVal, oldVal) { + elm.select2('val', elm.val()); + }); + } + // Update valid and dirty statuses controller.$parsers.push(function (value) { var div = elm.prev(); From 4b60ff860407278e4664df60791d992222121c1f Mon Sep 17 00:00:00 2001 From: Sune Broendum Woeller Date: Wed, 14 May 2014 19:25:47 +0200 Subject: [PATCH 2/3] missing semicolon --- src/select2.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/select2.js b/src/select2.js index 2c02e90..36d072a 100644 --- a/src/select2.js +++ b/src/select2.js @@ -7,7 +7,7 @@ */ angular.module('ui.select2', []).value('uiSelect2Config', {}).directive('uiSelect2', ['uiSelect2Config', '$timeout', function (uiSelect2Config, $timeout) { - NG_OPTIONS_REGEXP = /^\s*(.*?)(?:\s+as\s+(.*?))?(?:\s+group\s+by\s+(.*))?\s+for\s+(?:([\$\w][\$\w]*)|(?:\(\s*([\$\w][\$\w]*)\s*,\s*([\$\w][\$\w]*)\s*\)))\s+in\s+(.*?)(?:\s+track\s+by\s+(.*?))?$/ + NG_OPTIONS_REGEXP = /^\s*(.*?)(?:\s+as\s+(.*?))?(?:\s+group\s+by\s+(.*))?\s+for\s+(?:([\$\w][\$\w]*)|(?:\(\s*([\$\w][\$\w]*)\s*,\s*([\$\w][\$\w]*)\s*\)))\s+in\s+(.*?)(?:\s+track\s+by\s+(.*?))?$/; var options = {}; if (uiSelect2Config) { From bd68d06dacbce90387bb367769560bccd0785431 Mon Sep 17 00:00:00 2001 From: Sune Broendum Woeller Date: Wed, 14 May 2014 19:32:32 +0200 Subject: [PATCH 3/3] jshint --- src/select2.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/select2.js b/src/select2.js index 36d072a..166c273 100644 --- a/src/select2.js +++ b/src/select2.js @@ -7,7 +7,7 @@ */ angular.module('ui.select2', []).value('uiSelect2Config', {}).directive('uiSelect2', ['uiSelect2Config', '$timeout', function (uiSelect2Config, $timeout) { - NG_OPTIONS_REGEXP = /^\s*(.*?)(?:\s+as\s+(.*?))?(?:\s+group\s+by\s+(.*))?\s+for\s+(?:([\$\w][\$\w]*)|(?:\(\s*([\$\w][\$\w]*)\s*,\s*([\$\w][\$\w]*)\s*\)))\s+in\s+(.*?)(?:\s+track\s+by\s+(.*?))?$/; + var NG_OPTIONS_REGEXP = /^\s*(.*?)(?:\s+as\s+(.*?))?(?:\s+group\s+by\s+(.*))?\s+for\s+(?:([\$\w][\$\w]*)|(?:\(\s*([\$\w][\$\w]*)\s*,\s*([\$\w][\$\w]*)\s*\)))\s+in\s+(.*?)(?:\s+track\s+by\s+(.*?))?$/; var options = {}; if (uiSelect2Config) { @@ -161,9 +161,9 @@ angular.module('ui.select2', []).value('uiSelect2Config', {}).directive('uiSelec if (!isSelect) { // Set the view and model value and update the angular template manually for the ajax/multiple select2. - elm.bind("change", function (e) { + elm.bind('change', function (e) { e.stopImmediatePropagation(); - + if (scope.$$phase || scope.$root.$$phase) { return; } @@ -190,8 +190,8 @@ angular.module('ui.select2', []).value('uiSelect2Config', {}).directive('uiSelec } } - elm.bind("$destroy", function() { - elm.select2("destroy"); + elm.bind('$destroy', function() { + elm.select2('destroy'); }); attrs.$observe('disabled', function (value) {