title: How to refresh the bootstrap multiselect checkbox and maintain original values of checkbox?
body: <p>I am trying to refresh a bootstrap 3.0 multiselect control.
  On refresh, I want to reset the checkboxes to its previous state when the partial view was first rendered</p>
  
  <p>How can I achieve that?</p>
  
  <p>I tried following approach but didn't get success.</p>
  
  <ol>
  <li><p>Maintained hidden field for storing selected checkbox values once view
  was rendered.</p>
  
  <p>On Reset button click:</p>
  
  <p>2.1 Uncheck all checkboxes.<br>
  2.2 Check only those checkboxes whose value I got from hidden field.</p>
  
  <pre><code>j('#btnReset11').click(function () {            
          j("#divErrorMessage ul li").not(':first').remove();
          j("#divErrorMessage").hide();
          j("#divSuccessMessage").hide();
  
          j("#includeSelectAllOption").find("option").removeAttr("selected");
          j("#chkRoles ul li").removeClass("active");
          j("#chkRoles .btn-group").find("button").removeAttr('title');
          j("#chkRoles .btn-group").find("button").text('Select');
  
         var value = j("#selectedCheckboxes").val();
          valueItems = value.split(", ");
          for (var i = 0; i &lt; valueItems.length; i++) {
              j('#' + valueItems[i]).attr('selected', 'selected');
              j("#chkRoles ul li input[value=" + valueItems[i] + "]").parent().parent().parent().addClass("active");
              var title = j("#chkRoles .btn-group").find("button").title;
              j("#chkRoles .btn-group").find("button").removeAttr(title);
          }
  
          if (valueItems.length &gt; 0) {
              j("#chkRoles .btn-group").find("button").text(valueItems.length + ' selected');
          }
          else {
              j("#chkRoles .btn-group").find("button").text('Select');
          }
      });
  </code></pre></li>
  </ol>