How to fix 'Chosen with bootstrap not working properly'

Initialize Chosen Properly

After including the libraries, make sure you are initializing Chosen correctly.

You can initialize Chosen on your <select> elements like this:

<script type="text/javascript">
    $(document).ajaxComplete(function () {
        $('.chosen-select').chosen({ allow_single_deselect: true, width: "100%" });
    });
</script>

Ensure your <select> has the correct class:

<select class="chosen-select">
  <option value="1">Option 1</option>
  <option value="2">Option 2</option>
  <option value="3">Option 3</option>
</select>

Do the same way, you can solve chosen plugin displaying in bootstrap modal not working when using PartialView in ASP.NET MVC.

You can also initialize to pass options with "width" property like in this, or any other width value.

$("select").chosen({width: "inherit"}) 

or

$('.chosen-container').css({ 'width':'350px' });

I hope so you can fix chosen dropdown not working in bootstrap Model.