Can't get dk.open() to work with onlick event

[pierrefaure]

Hi guys, I spent a few hours on the open() function and I can't find why it doesn't want to open.

Basically I want to open a dropkick element on click.

That works:

dk = new Dropkick("#my-select"); dk.open();

But that open the dropkick element when the page load.

• I tried the JS way:
  document.getElementById("my-submit-btn").onclick = function(){ dk.open() };
• the jquery way:
  $('#my-select').on('click', '#my-submit-btn', function(e) { e.preventDefault(); dk.open(); });

In the two last cases, if I console.log(dk.open());, I get undefined and when I console.log(dk.open()); without any onclick event I get a boolean value.

The funny thing is that if I replace dk.open() by dk.disable() everything is working perfectly ...

Am I missing something?

Any help is appreciated :)
Thanks!

[wwilsman]

You might have trouble with opening it while clicking another element because it closes immediately after due to the document event listener.

I'll do some testing to see if I can work a solution into DK itself.

Meanwhile, try wrapping it in a short timeout to wait until after the document click fires. Something like 10 ms might be enough time.

[Robdel12]

Yep, here's a bin proving it: http://jsbin.com/qugoxevima/2/edit?html,js,output

Marking as critical because the open API as of right now is broken.

[pierrefaure]

Thanks @wwilsman that works like a charm! :)

If someone get on this issue, here is the code I use:

dk = new Dropkick("#sortby-select", {mobile: true});

jQuery(document).ready(function($) {

  $('#my-container').on('click', '#my-btn', function(e)
     setTimeout(function(){
      dk.open();
    }, 5);
  });

});

[Robdel12]

@pierrefaure you should be able to use the latest master. I haven't created a release yet because I'm not sure this is the permeant fix or not.

[Robdel12]

Fixed with DropKick 2.1.2! Thank you @pierrefaure for the issue, we appreciate it :)

[pierrefaure]

You're very welcome, thanks for the quick fix :)