How do you visually update a select2 widget?

Question

I'm trying to select the value of a select2 widget using js. I can change the value ok:

jQuery('#excludeGroups').val("846").trigger("change");

The problem I'm having is that this doesn't update the display. It does work in that when you submit the form it's the correct value - so it's working behind the scenes. But it doesn't actually change the display - the new value doesn't appear in the widget. The documentation suggests trigger("change") should do it. I'm not getting any console errors. Is there a trick?

Answer 1

Figured this out. I needed to wrap my jQuery code in:

CRM.$(function($) {

});

The change trigger - and other select2 events - started working once I did this.