Question

I need to programmatically trigger the change event. This I can usually do, but I’ve found an unexplainable scenario which I hope you can help me with. I have this code:

jQuery(document).ready(function() {

    jQuery('.posts-list').hide();
    jQuery('.clinic').hide();

    jQuery('#category').change(function() {
        jQuery('.posts-list').hide();
        jQuery('#clinics-'+jQuery(this).val()).show().change();
    });

    jQuery('.posts-list').change(function() {
        jQuery('.clinic').hide();
        jQuery('#clinic-'+jQuery(this).val()).show();
    });

    jQuery('#category').change();
});

The important part of this code is the second to last line, and the function that’s been bound to the change event of #category. The triggering of the change event inside that event actually works. But the triggering of the change event on the second to last line does not. If I put that into the console the first thing I do after having loaded the page, however, it works.

Anyone got an explanation?

Answer 1

jQuery('#category').trigger('change');

You actually want to trigger the event, rather than run the function. Let me know if this helps.