Merge pull request #418 from Fridus/feature-select-options-trackBy

Add parameter `trackBy` on form type select.

Author: davidlgj

src/directives/decorators/bootstrap/select.html

@@ -9,7 +9,7 @@
           sf-changed="form"
           class="form-control {{form.fieldHtmlClass}}"
           schema-validate="form"
-          ng-options="item.value as item.name group by item.group for item in form.titleMap"
+          ng-options="item.value as item.name group by item.group for item in form.titleMap track by item[form.trackBy]"
           name="{{form.key.slice(-1)[0]}}">
   </select>
   <div class="help-block" sf-message="form.description"></div>

src/services/schema-form.js

@@ -13,7 +13,7 @@ angular.module('schemaForm').provider('schemaForm',
         return type[0];
     }
     return type;
-  }
+  };
 
   //Creates an default titleMap list from an enum, i.e. a list of strings.
   var enumToTitleMap = function(enm) {
@@ -146,6 +146,7 @@ angular.module('schemaForm').provider('schemaForm',
       if (!f.titleMap) {
         f.titleMap = enumToTitleMap(schema['enum']);
       }
+      f.trackBy = 'value';
       options.lookup[sfPathProvider.stringify(options.path)] = f;
       return f;
     }
@@ -339,6 +340,10 @@ angular.module('schemaForm').provider('schemaForm',
           obj.titleMap = canonicalTitleMap(obj.titleMap);
         }
 
+        if(obj.type === 'select') {
+          obj.trackBy = obj.trackBy || 'value';
+        }
+
         //
         if (obj.itemForm) {
           obj.items = [];

test/directives/schema-form-test.js

@@ -1649,6 +1649,85 @@ describe('directive',function(){
   });
 
 
+  it('should show the correct option selected', function() {
+    inject(function($compile,$rootScope){
+      var scope = $rootScope.$new();
+      scope.thing = { id: 2, a: 1};
+
+      scope.schema = {
+        "type": "object",
+        "properties": {
+          "thing": {
+            "title": "Thing"
+          }
+        }
+      };
+
+      scope.form = [{
+        key: "thing",
+        type: 'select',
+        titleMap: [{
+          name: 'abc', value: { id: 1, a: 2 }
+        },{
+          name: 'def', value: { id: 2, a: 1 }
+        },{
+          name: 'ghi', value: { id: 3, a: 3 }
+        }]
+      }];
+
+      var tmpl = angular.element('<form sf-schema="schema" sf-form="form" sf-model="thing"></form>');
+
+      $compile(tmpl)(scope);
+      $rootScope.$apply();
+
+      setTimeout(function() {
+        tmpl.children().eq(0).find('select').eq(0).val().should.be.eq(2);
+      }, 0);
+
+    });
+  });
+
+
+  it('should show the correct option selected with `track by`', function() {
+    inject(function($compile,$rootScope){
+      var scope = $rootScope.$new();
+      scope.thing = { id: 2, a: 1, b: 2 };
+
+      scope.schema = {
+        "type": "object",
+        "properties": {
+          "thing": {
+            "title": "Thing"
+          }
+        }
+      };
+
+      scope.form = [{
+        key: "thing",
+        type: 'select',
+        titleMap: [{
+          id: 1, name: 'abc', value: { id: 1 }
+        },{
+          id: 2, name: 'def', value: { id: 2 }
+        },{
+          id: 3, name: 'ghi', value: { id: 3 }
+        }],
+        trackBy: 'id'
+      }];
+
+      var tmpl = angular.element('<form sf-schema="schema" sf-form="form" sf-model="thing"></form>');
+
+      $compile(tmpl)(scope);
+      $rootScope.$apply();
+
+      setTimeout(function() {
+        tmpl.children().eq(0).find('select').eq(0).val().should.be.eq(2);
+      }, 0);
+
+    });
+  });
+
+
   it('should update array form on model array ref change',function(){
 
     inject(function($compile,$rootScope){

test/services/schema-form-test.js

@@ -91,7 +91,8 @@ describe('schemaForm', function() {
                 "name": "NaN",
                 "value": "NaN"
               }
-            ]
+            ],
+            "trackBy": "value"
           },
           {
             "title": "Are you over 18 years old?",