support ngmodel

README.md

@@ -1,13 +1,17 @@
 angular-bootstrap-duallistbox [![Build Status](https://travis-ci.org/frapontillo/angular-bootstrap-duallistbox.png)](https://travis-ci.org/frapontillo/angular-bootstrap-duallistbox)
 ========================
+###Dependencies
+"angular": "^1.7.5"
+"bootstrap-duallistbox": "^3.0.6"
 
 Angular directive to include [Bootstrap Dual Listbox](https://github.com/istvan-ujjmeszaros/bootstrap-duallistbox) in your apps.
 
 ##Usage
 
 ###Installation
 ```shell
-$ bower install angular-bootstrap-duallistbox
+$ npm install --save https://github.com/dbk1985/angular-bootstrap-duallistbox.git
+$ npm uninstall angular-bootstrap-duallistbox
 ```
 
 This will install AngularJS, jQuery, and the original bootstrap-duallistbox.

bower.json

@@ -4,12 +4,12 @@
   "author": {
     "name": "Francesco Pontillo",
     "email": "francescopontillo@gmail.com",
-    "url": "https://github.com/frapontillo"
+    "url": "https://github.com/dbk1985"
   },
-  "homepage": "https://github.com/frapontillo/angular-bootstrap-duallistbox",
+  "homepage": "https://github.com/dbk1985/angular-bootstrap-duallistbox",
   "repository": {
     "type": "git",
-    "url": "git@github.com:frapontillo/angular-bootstrap-duallistbox.git"
+    "url": "git@github.com:dbk1985/angular-bootstrap-duallistbox.git"
   },
   "licenses": [
     {

dist/angular-bootstrap-duallistbox.js

@@ -1,8 +1,8 @@
 /**
  * angular-bootstrap-duallistbox
- * @version v0.1.0 - 2015-06-13
+ * @version v0.1.0 - 2019-03-19
  * @author Francesco Pontillo (francescopontillo@gmail.com)
- * @link https://github.com/frapontillo/angular-bootstrap-duallistbox
+ * @link https://github.com/dbk1985/angular-bootstrap-duallistbox
  * @license Apache License 2.0
 **/
 
@@ -17,7 +17,12 @@ angular.module('frapontillo.bootstrap-duallistbox').directive('bsDuallistbox', [
     return {
       restrict: 'A',
       require: 'ngModel',
-      link: function link(scope, element, attrs) {
+      link: function link(scope, $element, attrs) {
+        element = $(element);
+        var element = $($element);
+        element.bind('change', function () {
+          $element.triggerHandler('change');
+        });
         //000011111111110000000000022222222220000000000000000000003333333333000000000000004444444444444440000000005555555555555550000000666666666666666000000000000000777777777700000000000000000008888888888
         var NG_OPTIONS_REGEXP = /^\s*([\s\S]+?)(?:\s+as\s+([\s\S]+?))?(?:\s+group\s+by\s+([\s\S]+?))?\s+for\s+(?:([\$\w][\$\w]*)|(?:\(\s*([\$\w][\$\w]*)\s*,\s*([\$\w][\$\w]*)\s*\)))\s+in\s+([\s\S]+?)(?:\s+track\s+by\s+([\s\S]+?))?$/;
         // The select collection
@@ -213,6 +218,10 @@ angular.module('frapontillo.bootstrap-duallistbox').directive('bsDuallistbox', [
           });
           // Inject the ng-model into the filters and re-compile them
           var container = element.bootstrapDualListbox('getContainer');
+          var styleClass = attrs['styleClass'];
+          if (styleClass) {
+            container.find('.box1, .box2').removeClass('col-md-6').removeClass('span6').addClass(styleClass);
+          }
           var filterNonSelectedInput = container.find('.box1 .filter');
           filterNonSelectedInput.attr('ng-model', attrs.filterNonSelected);
           $compile(filterNonSelectedInput)(scope);

example/index.html

@@ -57,6 +57,7 @@
         <button class="btn btn-large" ng-click="reset()">Reset</button>
         <button class="btn btn-large" ng-click="add()">Add</button>
       </div>
+      {{model | json}}
     </div>
 
     <script src="../bower_components/jquery/jquery.js"></script>

example/scripts/controllers/main.js

@@ -45,8 +45,8 @@ angular.module('bsDuallistboxApp')
       postfix: '_helperz',
       selectMinHeight: 130,
       filter: true,
-      filterNonSelected: '1',
-      filterSelected: '4',
+      // filterNonSelected: '1',
+      // filterSelected: '4',
       infoAll: 'Showing all {0}!',
       infoFiltered: '<span class="label label-warning">Filtered</span> {0} from {1}!',
       infoEmpty: 'Empty list!',