select_dropdown.js in romo-0.19.6

- old
+ new

@@ -57,12 +57,12 @@
 
 RomoSelectDropdown.prototype.doInit = function() {
   // override as needed
 }
 
-RomoSelectDropdown.prototype.doSetNewValue = function(newValue) {
-  this.romoOptionListDropdown.doSetNewValue(newValue);
+RomoSelectDropdown.prototype.doSetSelectedItem = function(newValue) {
+  this.romoOptionListDropdown.doSetSelectedItem(newValue);
 }
 
 /* private */
 
 RomoSelectDropdown.prototype._bindElem = function() {
@@ -91,13 +91,29 @@
     this.elem.trigger('selectDropdown:dropdown:popupOpen', [dropdown, this]);
   }, this));
   this.elem.on('romoOptionListDropdown:dropdown:popupClose', $.proxy(function(e, dropdown) {
     this.elem.trigger('selectDropdown:dropdown:popupClose', [dropdown, this]);
   }, this));
-  this.elem.on('romoOptionListDropdown:itemSelected', $.proxy(function(e, newValue, prevValue, romoOptionListDropdown) {
-    this.elem.trigger('selectDropdown:itemSelected', [newValue, prevValue, this]);
+  this.elem.on('romoOptionListDropdown:itemSelected', $.proxy(function(e, itemValue, itemDisplayText, romoOptionListDropdown) {
+    this.elem.trigger('selectDropdown:itemSelected', [itemValue, itemDisplayText, this]);
   }, this));
+  this.elem.on('romoOptionListDropdown:newItemSelected', $.proxy(function(e, itemValue, itemDisplayText, romoOptionListDropdown) {
+    var custOptElem = this.optionElemsParent.find('OPTION[data-romo-select-dropdown-custom-option="true"]');
+    if (this.optionElemsParent.find('OPTION[value="'+itemValue+'"]').length === 0){
+      // a custom value is being selected. add a custom option elem and update its value/text
+      if (custOptElem.length === 0) {
+        this.optionElemsParent.append('<option data-romo-select-dropdown-custom-option="true"></option>');
+        custOptElem = this.optionElemsParent.find('OPTION[data-romo-select-dropdown-custom-option="true"]');
+      }
+      custOptElem.attr('value', itemValue);
+      custOptElem.text(itemDisplayText);
+    } else if (custOptElem.length !== 0) {
+      // a non custom value is being selected. remove any existing custom option
+      custOptElem.remove();
+    }
+    this.elem.trigger('selectDropdown:newItemSelected', [itemValue, itemDisplayText, this]);
+  }, this));
   this.elem.on('romoOptionListDropdown:change', $.proxy(function(e, newValue, prevValue, romoOptionListDropdown) {
     this.elem.trigger('selectDropdown:change', [newValue, prevValue, this]);
   }, this));
 
 
@@ -112,11 +128,11 @@
   }, this));
 
   this.romoOptionListDropdown = this.elem.romoOptionListDropdown()[0];
 
   this.elem.on('romoOptionListDropdown:filterChange', $.proxy(function(e, filterValue, romoOptionListDropdown) {
-    var elems    = this.optionElemsParent.find('option');
+    var elems    = this.optionElemsParent.find('OPTION');
     var wbFilter = new RomoWordBoundaryFilter(filterValue, elems, function(elem) {
       // The romo word boundary filter by default considers a space, "-" and "_"
       // as word boundaries.  We want to also consider other non-word characters
       // (such as ":", "/", ".", "?", "=", "&") as word boundaries as well.
       return elem[0].textContent.replace(/\W/g, ' ');
@@ -131,11 +147,24 @@
     } else {
       this.elem.trigger('romoOptionListDropdown:triggerListOptionsUpdate', [this.selectedItemElem()]);
     }
   }, this));
 
+  this._sanitizeOptions();
   this._setListItems();
   this.elem.trigger('romoOptionListDropdown:triggerListOptionsUpdate', [this.selectedItemElem()]);
+}
+
+RomoSelectDropdown.prototype._sanitizeOptions = function() {
+  // set any options without a value to value=""
+  // all options are required to have a value for things to work
+  // this and the select component assume value attrs for all options
+  $.each(this.optionElemsParent.find('OPTION'), $.proxy(function(idx, optionNode) {
+    var optElem = $(optionNode);
+    if (optElem.attr('value') === undefined) {
+      optElem.attr('value', '');
+    }
+  }, this));
 }
 
 RomoSelectDropdown.prototype._setListItems = function() {
   var optElems = this.optionElemsParent.children(this.optionElemSelector);
   var items    = this._buildOptionListItems(optElems).concat(this._buildCustomOptionItems());