Uncaught TypeError for SelectPicker in console

[leijae]

Prerequisites

Please answer the following questions for yourself before submitting an issue.

• [X] I am running the latest version
• [X] I checked the documentation and found no answer
• [X] I checked to make sure that this issue has not already been filed

Expected Behavior

Material Kit Pro bootstrap select picker; dropdown select list should be styled as mentioned here in documentation

Current Behavior

What is the current behavior? Error in browser console jquery.min.js:1251 Uncaught TypeError: $(...).selectpicker is not a function at HTMLDocument. (material-kit.js?v=2.0.6:276) at j (jquery.min.js:1197) at k (jquery.min.js:1203)

Failure Information (for bugs)

Please help provide information about the failure if this is a bug. If it is not a bug, please remove the rest of this template.

Steps to Reproduce

Please provide detailed steps for reproducing the issue.

1. Using .net core 3.1 MVC, load scripts into layout partial
2. this line of code in the view @Html.DropDownListFor(m => m.BusinessType, Html.GetEnumSelectList(), BusinessType.TaxExemptOrganization.ToString(), new { @class = "form-control selectpicker", data_style="btn btn-link" })
3. run in browsers and returns the following error

the following HTML is produced in the browser:

Context

Please provide any relevant information about your setup. This is important in case the issue is not reproducible except for under certain conditions.

• Device: HP Spectre 360
• Operating System: Windows 10 Pro
• Browser and Version: Brave/Chrome newest version

[groovemen]

Hello @leijae,

Thank you for using our products, please try to reinitialize the .selectpicker after you populate it:

  // Activate bootstrap-select
  if ($(".selectpicker").length != 0) {
    $(".selectpicker").selectpicker();
  }

Hope that information helps you. Please let us know if we can help you with anything else. All the best, Stefan

[leijae]

Hi Stefan,

Thanks for the tip, but unfortunately, it seems like initialization at the view doesn't fix the error:

The following is the code rendered:

And this is the UI:

Additionally this is from the linked .js file

[groovemen]

Then, it's probably from the scripts that you have loaded into your file project. Try to load bootstrap-material-design before the bootstrap-select.

[leijae]

oh my gosh, so silly... that's what it was. Thanks!