Search code examples
javascriptjqueryhtmlbootstrap-4disable

How do I disable the actual "dropping down" of a selectpicker (Bootstrap-Select)?

I want a selectpicker to be completely disabled when a radio button is set to "No." Right now, I have the following code to disable a with a "selectpicker" class:

   $("#mySelect").prop("disabled", true);
   $(".selectpicker[data-id='mySelect']").addClass("disabled");

And then this to re-enable it:

   $("#mySelect").prop("disabled", false);
   $(".selectpicker[data-id='mySelect']").removeClass("disabled");

Which works in the sense that I can't change my menu options, but the actual menu itself still drops down and shows options when I click on it (but I can't click any of these options). What do I need to do to actually disable the dropping-down of the menu and make it so the selectpicker is totally inactive until re-enabled?

Solution

  • I found the problem. after these lines I needed to 'refresh':

    $('.selectpicker').selectpicker('refresh');