Bootstrap-select: $el.selectpicker('val',value) causes errors e.stopPropagation is not a function

[fusionbeam]

bootstrap-select 1.10.0
jquery 2.2.3

---

anyone encountering the same issue?

[arambadk]

Same here

[caseyjhol]

See guidelines for contributing.

Bug reports

A bug is a _demonstrable problem_ that is caused by the code in the repository.
Good bug reports are extremely helpful - thank you!

Guidelines for bug reports:

1. Use the GitHub issue search. Check if the issue has already been reported.
2. Check if the issue has been fixed. Try to reproduce it using the latest master or development branch in the repository.
3. Provide environment details. Provide your operating system, browser(s), jQuery version, Bootstrap version, and bootstrap-select version.
4. Create an isolated and reproducible test case. Create a reduced test case.
5. Include a live example. Make use of jsFiddle or jsBin to share your isolated test cases.

[kovart]

I had the same issue, but it solved after I call refresh function before changing
$(element).selectpicker('refresh'); $(element).selectpicker('val', 1);

[maximelebreton]

+1

[PhilPJL]

I have this issue also

Using jQuery 1.12.4 and bootstrap-select 1.11.2 on IE 11 or IE Edge

picker.selectpicker('val', init);

fails,

but

picker.val(init);
picker.selectpicker('refresh');

succeeds.

If I update jQuery to 3.1.1 then either way succeeds.

[caseyjhol]

Closing this until somebody can follow guidelines for contributing.

[PhilPJL]

@caseyjhol: Please re-open.

Here's my first attempt at using jsBin https://jsbin.com/muvuguy/347/edit?html,js,output
The issue only appears in $(document).ready and when using jquery < V2.

In the demo uncheck 'auto-run with JS'.
Click 'run with JS'. The select picker is initialised.
Now comment out the jquery-3.1.1 script block and uncomment the jquery-1.12.4 block.
Click 'run with JS'. The select picker is not initialised.
However, using either of the 'test' buttons does initialise the picker for either version of jquery.

[caseyjhol]

The reason this works with jQuery 3.0.0 and above is $(document).ready() is now fired asynchronously (see https://github.com/jquery/jquery/issues/3197). Because of the test page's small size, $(window).on('load') is fired _before_ $(document).ready(), which allows bootstrap-select to initiate first, before setting the value in $(document).ready(). We run into this issue (attempting to set the value of the select before it's even initialized) in situations where it takes longer to load the page, or with any version of jQuery prior to 3.0.0. A workaround in the meantime is to use $(window).on('load') instead of $(document).ready().

[caseyjhol]

Duplicate of #1167.