Added rebuild method.

Added a rebuild method suggested in Issue #19. Additionally added
documentation for Knockout JS - see Issue #17.

README.md

@@ -220,6 +220,32 @@ This method will destroy - unbind - the plugin on the given element(s).
 
 Refresh the selected elements depending on the selected options within the select.
 
+**.multiselect('rebuild')**
+
+Rebuilds the whole dropdown menu. Selected options will still be selected.
+
+## Knockout JS Support
+
+Thanks to [Devristo](https://github.com/Devristo) this plugin supports [Knockout JS](http://knockoutjs.com/). For further discussion see [the pull requests](https://github.com/davidstutz/bootstrap-multiselect/pull/17).
+
+**Define select input**
+
+Note the multiselect: true binding!
+
+	<select class="multiSelect" data-bind="multiselect: true, options: Options, selectedOptions: SelectedOptions, optionsValue: $data" multiple="multiple"></select>
+	
+**Initialize Bootstrap-multiselect**
+
+	$(".multiSelect").multiselect();
+	
+**Apply Knockout view model**
+
+As usual.
+
+**Notes**
+
+It is important to initialize the multiselect before applying the view model, since the custom binding code will hook into the onChange method to update the binding.
+
 ## Roadmap / Todo
 
 * This solution for multiple selects is not usable for mobile devices (especially with touchscreen). ALternatives: Using Popovers instead of Dropdowns or checking for mobile devices and displaying normal select field (one row) for mobile devices.

index.html

@@ -243,6 +243,21 @@
 					$('#example10-refresh').on('click', function() {
 						$('#example10').multiselect('refresh');
 					});
+					
+					$('#example12').multiselect({
+						buttonContainer: '<span />',
+					});
+					$('#example12-rebuild').on('click', function() {
+						$('#example12').multiselect('rebuild');
+					});
+					$('#example12-add').on('click', function() {
+						$('#example12').append('<option value="add1">Addition 1</option><option value="add2">Addition 2</option><option value="add3">Addition 3</option>');
+					});
+					$('#example12-delete').on('click', function() {
+						$('option[value="add1"]', $('#example12')).remove();
+						$('option[value="add2"]', $('#example12')).remove();
+						$('option[value="add3"]', $('#example12')).remove();
+					});
 				});
 			</script>
 			<table class="table table-striped">
@@ -287,6 +302,27 @@
 							This method is used to refresh the checked checkboxes based on the currently selected options within the select. Click &apos;Select some options&apos; so select some of the options (meaning added the <code>selected</code> attribute to some of the options). Then click refresh. The plugin will update the checkboxes accordingly.
 						</td>
 					</tr>
+					<tr>
+						<td><code>.multiselect('rebuild')</code></td>
+						<td>
+							<div class="btn-group">
+								<select id="example12" multiple="multiple">
+									<option value="cheese">Cheese</option>
+									<option value="tomatoes">Tomatoes</option>
+									<option value="mozarella">Mozzarella</option>
+									<option value="mushrooms">Mushrooms</option>
+									<option value="pepperoni">Pepperoni</option>
+									<option value="onions">Onions</option>
+								</select>
+								<button id="example12-add" class="btn">Add some options</button>
+								<button id="example12-delete" class="btn">Delete some options</button>
+								<button id="example12-rebuild" class="btn btn-primary">Rebuild</button>
+							</div>
+						</td>
+						<td>
+							Rebuilds the whole dropdown menu. All selected options will remain selected (if still existent!).
+						</td>
+					</tr>
 				</tbody>
 			</table>
 			<div class="page-header">

js/bootstrap-multiselect.js

@@ -20,7 +20,7 @@
 
     "use strict"; // jshint ;_;
 
-    if(ko && ko.bindingHandlers && !ko.bindingHandlers.multiselect){
+    if(typeof ko != 'undefined' && ko.bindingHandlers && !ko.bindingHandlers.multiselect){
         ko.bindingHandlers.multiselect = {
             init: function (element) {
                 var ms = $(element).data('multiselect');
@@ -71,7 +71,7 @@
             this.select.attr('multiple', true);
         }
 
-        this.addOptions(select, options);
+        this.buildDrowdown(select, this.options);
 
         this.select
             .hide()
@@ -79,8 +79,7 @@
     };
 
     Multiselect.prototype = {
-        addOptions: function(select, options){
-
+        buildDrowdown: function(select, options){
 
             // Build the dropdown.
             $('option', this.select).each($.proxy(function(index, element) {
@@ -121,7 +120,7 @@
                 else {
                     option.removeAttr('selected');
                 }
-                console.log(option);
+                
                 var options = $('option:selected', this.select);
                 $('button', this.container).html(this.options.buttonText(options));
 
@@ -132,6 +131,7 @@
                 event.stopPropagation();
             });
         },
+        
         defaults: {
             // Default text function will either print 'None selected' in case no option is selected,
             // or a list of the selected options up to a length of 3 selected options.
@@ -165,10 +165,6 @@
 
         constructor: Multiselect,
 
-        reset: function() {
-
-        },
-
         // Destroy - unbind - the plugin.
         destroy: function() {
             this.container.remove();
@@ -177,9 +173,6 @@
 
         // Refreshs the checked options based on the current state of the select.
         refresh: function() {
-            $('ul', this.container).html('');
-            this.addOptions(this.select, this.options);
-
             $('option', this.select).each($.proxy(function(index, element) {
                 if ($(element).is(':selected')) {
                     $('ul li input[value="' + $(element).val() + '"]', this.container).prop('checked', true);
@@ -194,6 +187,11 @@
             $('button', this.container).html(this.options.buttonText($('option:selected', this.select)));
         },
 
+		rebuild: function() {
+			$('ul', this.container).html('');
+            this.buildDrowdown(this.select, this.options);
+		},
+
         // Get options by merging defaults and given options.
         getOptions: function(options) {
             return $.extend({}, this.defaults, options);