title: Bootstrap Dual Listbox : How to Limit Selected Option
body: <p>I'm using <a href="http://www.jqueryscript.net/demo/Responsive-jQuery-Dual-Select-Boxes-For-Bootstrap-Bootstrap-Dual-Listbox." rel="nofollow noreferrer">Bootstrap Dual Listbox</a> to help user choose some option. <br/> You can see I have add the plugin on my project. It's success. But i got a problem when try to make a limit when user choose the option.</p>
  
  <p>Example:
  There are some option, like:</p>
  
  <ul>
  <li>Apple</li>
  <li>Mango</li>
  <li>Orange</li>
  <li>Melon</li>
  <li>Guava</li>
  </ul>
  
  <p>User must choose 3 option. You can't choose 1,2,4, or 5.</p>
  
  <p>The problem is about to limit the option can be choose. By default, the user is not limited to choose. </p>
  
  <p>This is some of my code:</p>
  
  <pre><code>&lt;script src="&lt;?php echo $baseurl; ?&gt;assets/js/plugins/dual/dist/jquery.bootstrap-duallistbox.js"&gt;&lt;/script&gt;
  &lt;link href="&lt;?php echo $baseurl; ?&gt;assets/js/plugins/dual/dist/bootstrap-duallistbox.css" rel="stylesheet" type="text/css" media="all"&gt;
  
  &lt;div id="addimeiform" class="box-content form-horizontal"&gt;
      &lt;select multiple="multiple" id="imei_multi" name="duallistbox_demo1"&gt;
          &lt;?php
               while ($row = mysql_fetch_array($query)) {
                   echo "&lt;option&gt;".$row['imei']."&lt;/option&gt;";
               }
          ?&gt;
      &lt;/select&gt;
  &lt;/div&gt;
  
  &lt;script&gt;
      var demo1 = $('[name=duallistbox_demo1]').bootstrapDualListbox();
  &lt;/script&gt;
  </code></pre>
  
  <p>If you have same problem, let share here. Thanks in advanced! </p>