Fire event each time a DropDownList item is selected with jQuery

Question

I have a dropdown: <asp:DropDownList id="dropdownid" runat="server" class=blah"/>

in my jQuery, I assign change event like this:

$('#dropdownid').change(function() {......});

Now, this works when I select different value from the dropdown, however let's say I want to select the same value again. (because I want to make another call with the same value) So, when I select it again, (without changing the value) just by clicking on the selected value from the dropdown and "selecting" it again, no event fires. Is there another event in jquery that I have to assign to it? what's the workaround?

Answer 1

To expand Vincent Ramdhanie's suggestion, take a look at doing something like this. Essentially, you end up with your own jQuery function that you can re-use elsewhere.

Step 1: Create the jQuery Function

(function($) {
    $.fn.selected = function(fn) {
        return this.each(function() {
            var clicknum = 0;
            $(this).click(function() {
                clicknum++;
                if (clicknum == 2) {
                    clicknum = 0;
                    fn(this);
                }
            });
        });
    }
})(jQuery);

Step 2: Make sure that the newly created jQuery Function's file is referenced for use:

<script src="Scripts/jqDropDown.js" type="text/javascript"></script>

Step 3: Utilize new function:

$('#MyDropDown').selected(function() {
    //Do Whatever...
});

ORIGINAL INFO
With your current code base, selecting the same value from the asp:DropDownList will not fire the change event.

You could try adding another jQuery function for the .blur event. This would fire when the control loses focus:

$('#dropdownid').blur(function() {......});

If they blur function doesn't work for you, I'd add a refresh button or something to that affect that fires the function you are trying to utilize.