Menu icon Foundation
Control Dropdown Programatically

Hi,

How can I control a dropdown programatically. As I wanted to close the dropdown window after a link is clicked.

Any help would be greatly appreciated. Thx

Hi,

How can I control a dropdown programatically. As I wanted to close the dropdown window after a link is clicked.

Any help would be greatly appreciated. Thx

K Lim over 5 years ago

Not sure if there are other ways to "skin the cat", but here is what I do:

  1. set an id to your dropdown button/div.
  2. set a class or id to each of your element contained in the dropdown.
  3. write code to handle a click event for each of the class/id.
  4. within the code in 3., trigger a click event to the dropdown button/div.

e.g.

       $('.choice-from-dropdown').click(function(evt) {
            evt.stopImmediatePropagation();
            evt.preventDefault();
            $('.dropdown-btn').trigger('click');
        });

Jesse Matlock over 5 years ago

Also, if you just want to close a specific dropdown with a click from another element (inside of or outside of the dropdown).. you can do this:

 Foundation.libs.dropdown.close($('#id_of_dropdown_list'));