I'm trying to use bootstrap-select and reference it from javascript, but I always get an error: .selectpicker is not a function
Everything I've read about this error says I have a dependency missing or not loaded at the right time, but I'm at a loss as to what I'm missing.
Also, I get the same error when I try $('.selectpicker').selectpicker();
from the console, which tells me that it's not an issue with my javascript running before everything's loaded.
Here's the relevant portions of my page:
<link href="/Content/bootstrap.css" rel="stylesheet"/>
<link href="/Content/bootstrap-select.css" rel="stylesheet"/>
...
<script src="/Scripts/jquery-2.2.3.js"></script>
<script src="/Scripts/jquery.unobtrusive-ajax.js"></script>
<script src="/Scripts/jquery.validate.js"></script>
<script src="/Scripts/jquery.validate.unobtrusive.js"></script>
<script src="/Scripts/bootstrap.js"></script>
<script src="/Scripts/respond.js"></script>
<script src="/Scripts/bootstrap-select.js"></script>
...
<select class="selectpicker">
</select>
...
<script type="text/javascript">
$(document).ready(function () {
$('.selectpicker').selectpicker();
});
</script>
Found it. I had a second jquery reference that was re-loading jquery and wiping out the functions added by bootstrap-select.js
.