Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Autoclose dropdown after add new item #344

Closed
njunior1980 opened this issue Mar 25, 2014 · 8 comments
Closed

Autoclose dropdown after add new item #344

njunior1980 opened this issue Mar 25, 2014 · 8 comments

Comments

@njunior1980
Copy link

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

@gwacker
Copy link

gwacker commented Mar 29, 2014

onItemAdd: function() {
this.blur();
},

@hugohenrique
Copy link

@gwacker Great! But does not work when create: true

@shameemz
Copy link

This worked well:

onItemAdd: function() {
this.close();
},

@PaykomanVll
Copy link

Hello,

i have the same Problem and your answeres will not work :(
My will open with a dialog and its only auto open when i have added items and can`t close!! 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 */ }

@brianreavis
Copy link
Member

This is now a part of 0.12.0 (just released). Just set closeAfterSelect: true.

@shameemz
Copy link

Sorry @PaykomanVll, this.close() was not working. But it was solving one bug that I cannot remember now.
Thanks @brianreavis for fixing.

@PaykomanVll
Copy link

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 ;)

@PaykomanVll
Copy link

Hm no help more? =(

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

6 participants