title: How do I create dropdown with checkbox by bootstrap multiselect?
body: <p>I am working on MVC 5, there is have</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>  @Html.DropDownListFor(model =&gt; model.ShowAdConfigIDs, ViewData["Services"] as List&lt;SelectListItem&gt;, "Select", new { @id = "DDLServiceCate", @class = "form-control " })</code></pre>
  </div>
  </div>
  </p>
  
  <p>I want to do bootstrap multiselect dropdown with checkbox. For, I have tried:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>&lt;script src="~/Scripts/bootstrap-multiselect.js"&gt;&lt;/script&gt;
  &lt;link href="~/css/bootstrap-multiselect.css" rel="stylesheet" /&gt;
  
  &lt;script type="text/javascript"&gt;
      $(function () {
          $('[id*=DDLServiceCate]').multiselect({
              includeSelectAllOption: true
          });
      });
  &lt;/script&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>But after implementing this, look like below image.</p>
  
  <p><a href="https://i.stack.imgur.com/DY5Oz.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/DY5Oz.png" alt="enter image description here"></a></p>
  
  <p>But actually I want look like below image showing.</p>
  
  <p><a href="https://i.stack.imgur.com/0ikun.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/0ikun.png" alt="enter image description here"></a></p>
  
  <p>How can I do this ?</p>