WIP

app/pods/protected/compare/results/route.js

@@ -30,8 +30,8 @@ export default Route.extend({
     }
 
     const compare = this.controllerFor('protected.compare');
-    compare.set('selectedStrains', params.strain_ids);
-    compare.set('selectedCharacteristics', params.characteristic_ids);
+    compare.set('selectedStrains', params.strain_ids.split(','));
+    compare.set('selectedCharacteristics', params.characteristic_ids.split(','));
 
     return this.get('ajax').request('/compare', { data: params });
   },
@@ -45,14 +45,14 @@ export default Route.extend({
     const compare = this.controllerFor('protected.compare');
 
     const strains = [];
-    const strain_ids = compare.get('selectedStrains').split(',');
+    const strain_ids = compare.get('selectedStrains');
     strain_ids.forEach((id) => {
       strains.push(this.store.peekRecord('strain', id));
     });
     controller.set('strains', strains);
 
     const characteristics = [];
-    const characteristic_ids = compare.get('selectedCharacteristics').split(',');
+    const characteristic_ids = compare.get('selectedCharacteristics');
     characteristic_ids.forEach((id) => {
       characteristics.push(this.store.peekRecord('characteristic', id));
     });

app/pods/protected/compare/select-form/component.js

@@ -13,10 +13,10 @@ export default Component.extend({
   selectedStrains: null,
   selectedCharacteristics: null,
 
-  updateStrains: function(selection) {
-    this.set('selectedStrains', selection);
-    this.attrs['update-strains'](this.get('selectedStrains'));
-  },
+  // updateStrains: function(selection) {
+  //   this.set('selectedStrains', selection);
+  //   this.attrs['update-strains'](this.get('selectedStrains'));
+  // },
 
   updateCharacteristics: function(selection) {
     this.set('selectedCharacteristics', selection);
@@ -57,5 +57,10 @@ export default Component.extend({
     deselectAllCharacteristics: function() {
       this.updateCharacteristics("");
     },
+
+    updateStrainSelection: function(selection) {
+      this.set('selectedStrains', selection);
+      this.attrs["update-strains"](selection);
+    },
   },
 });

app/pods/protected/compare/select-form/template.hbs

@@ -5,13 +5,13 @@
         <li>
           <label>Strains</label>
           {{
-            select-2
+            x-select
+            listItems=strains
+            nameAttr="fullNameMU"
+            update=(action "updateStrainSelection")
+            placeholder="Select one ore more strains"
             multiple=true
-            content=strains
-            value=selectedStrains
-            optionValuePath="id"
-            optionLabelPath="fullNameMU"
-            placeholder="Select one or more strains"
+            selected=selectedStrains
           }}
         </li>
         <li>