richard
/
SemanSemantic-UItic-UI
mirror of https://github.com/Semantic-Org/Semantic-UI.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Adds fireOnInit setting, and onAdd onRemove callbacks for multiple 

Creates add value and remove value methods to work alongside set value for multiple.
Fixes #2252 #2212 #1912 #230
pull/2300/head
jlukic 9 years ago
parent
1cddebabd4
commit
653337cfd6
1 changed files with 120 additions and 97 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 217
      src/definitions/modules/dropdown.js

217
src/definitions/modules/dropdown.js
View File

@ -67,6 +67,7 @@ $.fn.dropdown = function(parameters) {
element = this, element = this,
instance = $module.data(moduleNamespace), instance = $module.data(moduleNamespace),
initialLoad,
pageLostFocus, pageLostFocus,
elementNamespace, elementNamespace,
id, id,
@ -87,27 +88,10 @@ $.fn.dropdown = function(parameters) {
module.save.defaults(); module.save.defaults();
if(settings.apiSettings) {
if(settings.saveRemoteData) {
module.restore.remoteValues();
}
else {
module.clearValue();
}
}
else {
module.set.selected();
}
module.restore.values();
if(module.is.multiple()) { if(module.is.multiple()) {
if(settings.allowAdditions) {
if(!settings.useLabels) {
module.error(error.labels);
settings.useLabels = true;
}
module.create.userLabels();
}
module.check.maxSelections();
module.restore.labels();
} }
module.create.id(); module.create.id();
@ -1631,6 +1615,37 @@ $.fn.dropdown = function(parameters) {
} }
} }
}, },
labels: function() {
if(settings.allowAdditions) {
if(!settings.useLabels) {
module.error(error.labels);
settings.useLabels = true;
}
module.debug('Restoring selected values');
module.create.userLabels();
}
module.check.maxSelections();
},
values: function() {
module.debug('Restoring selected values');
if(settings.fireOnInit === false) {
initialLoad = true;
}
if(settings.apiSettings) {
if(settings.saveRemoteData) {
module.restore.remoteValues();
}
else {
module.clearValue();
}
}
else {
module.set.selected();
}
if(settings.fireOnInit === false) {
initialLoad = false;
}
},
remoteValues: function() { remoteValues: function() {
var var
values = module.get.remoteValues() values = module.get.remoteValues()
@ -1638,14 +1653,12 @@ $.fn.dropdown = function(parameters) {
module.debug('Recreating selected from session data', values); module.debug('Recreating selected from session data', values);
if(values) { if(values) {
if( module.is.single() ) { if( module.is.single() ) {
console.log('single text', values, name);
$.each(values, function(value, name) { $.each(values, function(value, name) {
module.set.text(name); module.set.text(name);
}); });
} }
else { else {
$.each(values, function(value, name) { $.each(values, function(value, name) {
console.log(value, name);
module.add.label(value, name); module.add.label(value, name);
}); });
} }
@ -1663,7 +1676,6 @@ $.fn.dropdown = function(parameters) {
return; return;
} }
name = sessionStorage.getItem(value); name = sessionStorage.getItem(value);
console.log('reading', value, name);
return (name !== undefined) return (name !== undefined)
? name ? name
: false : false
@ -1693,7 +1705,6 @@ $.fn.dropdown = function(parameters) {
module.error(error.noStorage); module.error(error.noStorage);
return; return;
} }
console.log('saving', value, name);
sessionStorage.setItem(value, name); sessionStorage.setItem(value, name);
} }
}, },
@ -1787,6 +1798,9 @@ $.fn.dropdown = function(parameters) {
text = text || $module.data(metadata.placeholderText); text = text || $module.data(metadata.placeholderText);
module.set.text(text); module.set.text(text);
$text.addClass(className.placeholder); $text.addClass(className.placeholder);
},
input: function() {
}, },
tabbable: function() { tabbable: function() {
if( module.has.search() ) { if( module.has.search() ) {
@ -1913,36 +1927,10 @@ $.fn.dropdown = function(parameters) {
var var
hasInput = ($input.length > 0), hasInput = ($input.length > 0),
isAddition = !module.has.value(value), isAddition = !module.has.value(value),
currentValue = module.get.values()
currentValue = module.get.values(),
newValue
; ;
if($input.length > 0) {
if( module.is.multiple() ) {
if(value === '') {
module.debug('Cannot select blank values from multiselect');
return;
}
// extend currently selected values
value = [value];
if($.isArray(currentValue)) {
value = currentValue.concat(value);
value = module.get.uniqueArray(value);
}
// set values
if( $input.is('select') ) {
module.debug('Setting multiple <select> values', value, $input);
if(settings.allowAdditions) {
module.add.optionValue(value);
}
}
else {
value = value.join(settings.delimiter);
module.debug('Setting hidden input to delimited values', value, $input);
}
}
if(hasInput) {
if(value == currentValue) { if(value == currentValue) {
module.verbose('Skipping value update already same value', value, currentValue); module.verbose('Skipping value update already same value', value, currentValue);
return; return;
@ -1952,16 +1940,16 @@ $.fn.dropdown = function(parameters) {
.val(value) .val(value)
.trigger('change') .trigger('change')
; ;
settings.onChange.call(element, value, text, $selected);
} }
else { else {
module.verbose('Storing value in metadata', value, $input); module.verbose('Storing value in metadata', value, $input);
if(value !== currentValue) { if(value !== currentValue) {
$module.data(metadata.value, value); $module.data(metadata.value, value);
settings.onChange.call(element, value, text, $selected);
} }
} }
module.check.maxSelections();
if(!initialLoad) {
settings.onChange.call(element, value, text, $selected);
}
}, },
active: function() { active: function() {
$module $module
@ -2010,14 +1998,14 @@ $.fn.dropdown = function(parameters) {
module.save.remoteData(selectedText, selectedValue); module.save.remoteData(selectedText, selectedValue);
} }
if(settings.useLabels) { if(settings.useLabels) {
module.add.value(selectedValue, selectedText, $selected);
module.add.label(selectedValue, selectedText, shouldAnimate); module.add.label(selectedValue, selectedText, shouldAnimate);
module.set.value(selectedValue, selectedText, $selected);
$selected.addClass(className.active); $selected.addClass(className.active);
module.filterActive(); module.filterActive();
module.select.nextAvailable($selectedItem); module.select.nextAvailable($selectedItem);
} }
else { else {
module.set.value(selectedValue, selectedText, $selected);
module.add.value(selectedValue, selectedText, $selected);
module.set.text(module.add.variables(message.count)); module.set.text(module.add.variables(message.count));
$selected.addClass(className.active); $selected.addClass(className.active);
} }
@ -2095,27 +2083,25 @@ $.fn.dropdown = function(parameters) {
; ;
} }
}, },
optionValue: function(values) {
if(!$input.is('select')) {
return false;
optionValue: function(value) {
var
$option = $input.find('option[value="' + value + '"]'),
hasOption = ($option.length > 0)
;
if(hasOption) {
return;
} }
// temporarily disconnect observer
if(selectObserver) { if(selectObserver) {
selectObserver.disconnect(); selectObserver.disconnect();
module.verbose('Temporarily disconnecting mutation observer', value);
} }
$.each(values, function(index, value) {
var
$option = $input.find('option[value="' + value + '"]'),
hasOption = ($option.length > 0)
;
if(!hasOption) {
$('<option/>')
.prop('value', value)
.html(value)
.appendTo($input)
;
module.verbose('Adding user addition as an <option>', value);
}
});
$('<option/>')
.prop('value', value)
.html(value)
.appendTo($input)
;
module.verbose('Adding user addition as an <option>', value);
if(selectObserver) { if(selectObserver) {
selectObserver.observe($input[0], { selectObserver.observe($input[0], {
childList : true, childList : true,
@ -2181,6 +2167,40 @@ $.fn.dropdown = function(parameters) {
message = message.replace('{term}', query); message = message.replace('{term}', query);
} }
return message; return message;
},
value: function(addedValue, addedText, $selectedItem) {
var
currentValue = module.get.values(),
newValue
;
if(addedValue === '') {
module.debug('Cannot select blank values from multiselect');
return;
}
// extend currently array
if($.isArray(currentValue)) {
newValue = currentValue.concat([addedValue]);
newValue = module.get.uniqueArray(newValue);
}
else {
newValue = [addedValue];
}
// add values
if( $input.is('select')) {
if(settings.allowAdditions) {
module.add.optionValue(addedValue);
module.debug('Adding value to select', addedValue, newValue, $input);
}
}
else {
newValue = newValue.join(settings.delimiter);
module.debug('Setting hidden input to delimited value', newValue, $input);
}
if(!initialLoad) {
settings.onAdd.call(element, addedValue, addedText, $selectedItem);
}
module.set.value(newValue, addedValue, addedText, $selectedItem);
module.check.maxSelections();
} }
}, },
@ -2226,21 +2246,25 @@ $.fn.dropdown = function(parameters) {
selected: function(value) { selected: function(value) {
var var
$selectedItem = module.get.item(value), $selectedItem = module.get.item(value),
selectedValue = module.get.choiceValue($selectedItem)
selectedText = module.get.choiceText($selectedItem),
selectedValue = module.get.choiceValue($selectedItem, selectedText)
; ;
if(!$selectedItem) { if(!$selectedItem) {
return false; return false;
} }
module.remove.value(selectedValue);
if(module.is.multiple()) { if(module.is.multiple()) {
if(settings.useLabels) { if(settings.useLabels) {
module.remove.value(selectedValue, selectedText, $selectedItem);
module.remove.label(selectedValue); module.remove.label(selectedValue);
} }
else { else {
module.remove.value(selectedValue, selectedText, $selectedItem);
module.set.text(module.add.variables(message.count)); module.set.text(module.add.variables(message.count));
} }
} }
else {
module.remove.value(selectedValue, selectedText, $selectedItem);
}
$selectedItem $selectedItem
.removeClass(className.filtered) .removeClass(className.filtered)
.removeClass(className.active) .removeClass(className.active)
@ -2252,36 +2276,30 @@ $.fn.dropdown = function(parameters) {
selectedItem: function() { selectedItem: function() {
$item.removeClass(className.selected); $item.removeClass(className.selected);
}, },
value: function(value) {
value: function(removedValue, removedText, $removedItem) {
var var
values = $input.val()
values = $input.val(),
newValue
; ;
if( $input.is('select') ) { if( $input.is('select') ) {
module.verbose('Input is <select> removing selected');
$input
.find('option[value="' + value + '"]')
.prop('selected', false)
;
module.verbose('Input is <select> removing selected option', removedValue);
newValue = module.remove.arrayValue(removedValue, values);
} }
else { else {
module.verbose('Input is csv removing value');
values = module.remove.delimitedValue(value, values);
$input
.val(values)
.trigger('change')
;
module.verbose('Removing from delimited values', removedValue);
values = values.split(settings.delimiter);
newValue = module.remove.arrayValue(removedValue, values);
newValue = newValue.join(settings.delimiter);
} }
module.check.maxSelections();
},
delimitedValue: function(removedValue, values) {
if(typeof values != 'string') {
return false;
if(!initialLoad) {
settings.onRemove.call(element, removedValue, removedText, $removedItem);
} }
values = values.split(settings.delimiter);
module.set.value(newValue, removedText, $removedItem);
},
arrayValue: function(removedValue, values) {
values = $.grep(values, function(value){ values = $.grep(values, function(value){
return (removedValue != value); return (removedValue != value);
}); });
values = values.join(settings.delimiter);
module.verbose('Removed value from delimited string', removedValue, values); module.verbose('Removed value from delimited string', removedValue, values);
return values; return values;
}, },
@ -2839,6 +2857,8 @@ $.fn.dropdown.settings = {
allowTab : true, // add tabindex to element allowTab : true, // add tabindex to element
allowCategorySelection : false, // allow elements with sub-menus to be selected allowCategorySelection : false, // allow elements with sub-menus to be selected
fireOnInit : false, // Whether callbacks should fire when initializing dropdown values
transition : 'auto', // auto transition will slide down or up based on direction transition : 'auto', // auto transition will slide down or up based on direction
duration : 200, // duration of transition duration : 200, // duration of transition
@ -2861,6 +2881,9 @@ $.fn.dropdown.settings = {
/* Callbacks */ /* Callbacks */
onChange : function(value, text, $selected){}, onChange : function(value, text, $selected){},
onAdd : function(value, text, $selected){},
onRemove : function(value, text, $selected){},
onLabelSelect : function($selectedLabels){}, onLabelSelect : function($selectedLabels){},
onLabelCreate : function(value, text) { return $(this); }, onLabelCreate : function(value, text) { return $(this); },
onNoResults : function(searchTerm) { return true; }, onNoResults : function(searchTerm) { return true; },

Write Preview
Loading…
Cancel
Save