Hello, I would like to know how to do that when you add a new item, I would close the dropdown
create: function(input) {
autoclose???
}
thanks
onItemAdd: function() {
this.blur();
},
@gwacker Great! But does not work when create: true
This worked well:
onItemAdd: function() {
this.close();
},
Hello,
i have the same Problem and your answeres will not work :(
My
Please help me :(
function get_menuItems_NestedSetInput() {
$("#parent").selectize({
create: true,
onItemAdd: function(){this.close(); }, /* not working */
});
var selectMenu = $("#parent")[0].selectize;
selectMenu.addOption({text:' - Add to root - ', value: '0'});
selectMenu.addItem('0');
$('.sortable li').each(function() {
id = $(this).attr("id");
id = id.substring(5);
txt = Array($(this).parents('ol').length).join("--")+$(this).find("span.title").html();
selectMenu.addOption({text: txt, value: id});
selectMenu.addItem(id);
});
selectMenu.setValue('0');
selectMenu.close(); /* not working */
}
This is now a part of 0.12.0 (just released). Just set closeAfterSelect: true.
Sorry @PaykomanVll, this.close() was not working. But it was solving one bug that I cannot remember now.
Thanks @brianreavis for fixing.
Hello,
thanks for your answer and fix !!!
Now i will see that i update my selectize to current version and then i check your fix =)
Thank you!
:: UPDATE ::
So i have now standalone/selectize.js included the other file get me error of microtime and selectize ist not a function hmm :-(
I think the script will work but autoClose not :-(
/* FUNCTION TO GET MENU OL TREE TO THE "ADD NEW ITEM FORM" PARENT INPUT */
function get_menuItems_NestedSetInput() {
$("#item_parent").selectize({
create: true,
closeAfterSelect: true, /* not working */
});
var selectMenu = $("#item_parent")[0].selectize;
selectMenu.addOption({text:' - Add to root - ', value: '0'});
selectMenu.addItem('0');
$('.sortable li').each(function() {
id = $(this).attr("id");
id = id.substring(5);
txt = Array($(this).parents('ol').length).join("--")+$(this).find("span.title").html();
selectMenu.addOption({text: txt, value: id});
selectMenu.addItem(id);
});
selectMenu.setValue('0');
}
:: Update two ::
I think your if-statemant and create function is buggy, i have a console.log("hasClass create"); add to
if ($target.hasClass('create')) {
console.log("hasClass create"); // never written to console
self.createItem(null, function() {
if (self.settings.closeAfterSelect) {
self.close();
}
});
} else {
value = $target.attr('data-value');
if (typeof value !== 'undefined') {
self.lastQuery = null;
self.setTextboxValue('');
self.addItem(value);
if (self.settings.closeAfterSelect) {
console.log("yes auto close");
self.close();
} else if (!self.settings.hideSelected && e.type && /mouse/.test(e.type)) {
self.setActiveOption(self.getOption(value));
console.log("no auto close");
}
}
}
and this will not write on console but we you see i have create set to true, but the el have this class not :(
And when i set log to the else statemant, will this execute after i click an option (so will it selected) but my target was an auto close without click to an option :(
Or we must change my line: selectMenu.setValue('0'); then the menu must be close when a value is set! =(
Then the problem ist, when i add my option on javascript the menu will auto open and all options are visible when the dialog go open, but the menu must be closed.
The new function "closeAfterSelect" we must change to "closeAfterSet" so if called selectMenu.setValue('0'); than close menu. That is better i think ;)
Hm no help more? =(
Most helpful comment
This is now a part of 0.12.0 (just released). Just set
closeAfterSelect: true.