Question

I have this select tag:

<div class="browse_by">
     <select id="dynamic_select">  
            <option selected="selected">Browse by Category</option>
    </select>
</div>

jQuery code:

$('#dynamic_select').bind('change', function() {
    var url = $(this).val();
    if (url) {
        window.location = "/gallery/" + url;
    }
    return false;
});

The problem is when I use a custom jQuery drop down menu for this Select element, the jQuery code stops working. I tried jqtransform and dropkick.

It usually works fine when used before jqtransform and dropkick but after them it stop working no url redirection.

Any help ?

Answer 1

So you’re using Dropkick.js which basically rewrites your select tag into a custom widget.
You’ll need to reattach the event handler.

If you go to the Dropkick site, read up on the Custom ‘change’ callback section.

You’ll need to do something like

$('#dynamic_select').dropkick({
  change: function (value, label) {
    var url = value;
    if (url) {
       window.location = "/gallery/" + url;
    }
  }
});