Bootstrap Multiselect

Bootstrap Multiselect

by Nofiden Noble

HTML

<script src="//code.jquery.com/jquery.min.js"></script>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" href="//davidstutz.github.io/bootstrap-multiselect/dist/css/bootstrap-multiselect.css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.9.1.js"></script>
<script src="//davidstutz.github.io/bootstrap-multiselect/dist/js/bootstrap-multiselect.js"></script>
<select class="select-ajax form-control" placeholder="Entity Status" multiple="multiple"></select>

JavaScript

$(document).ready(function() {
					$('#RegionIds').multiselect();
          var data = {
            "data": [{
              "DT_RowId": "row_1",
              "company": "FirstCompany",
              "webtechnology": "Contao"
            }, {
              "DT_RowId": "row_1",
              "company": "FirstCompany",
              "webtechnology": "Contao"
            }, {
              "DT_RowId": "row_2",
              "company": "SecondCompany",
              "webtechnology": "Wordpress"
            }, {
              "DT_RowId": "row_3",
              "company": "ThirdCompany",
              "webtechnology": "Custom"
            }, {
              "DT_RowId": "row_4",
              "company": "FourthCompany",
              "webtechnology": "TYPO3 CMS"
            }, {
              "DT_RowId": "row_5",
              "company": "AlphaCompany",
              "webtechnology": "TYAl3 CMS"
            }],
            "options": [],
            "files": []
          };
          var sortedData = data.data.sort(function(a, b){
              if(a.company < b.company) return -1;
              if(a.company > b.company) return 1;
              return 0;
          })
          $.each(sortedData, function(i, item) {
            company = item.company;
            if ($(".select-ajax option[value='" + item.company + "']").length == 0) {
             $('.select-ajax').append('<option value="' + item.company + '">' + item.company + '</option>');
            }
            console.log(item)
          });
          $('.select-ajax').multiselect('rebuild');

        });