Skip to content

B
bootstrap-multiselect
Commit bbe5381f authored by David Stutz's avatar David Stutz
Browse files
Options

Updated readme, demos. 

Updated readme and demonstration files.
parent 7758d767
Show whitespace changes
Inline Side-by-side
Showing with 11 additions and 120 deletions
README.md
View file @ bbe5381f
...@@ -4,125 +4,11 @@ Bootstrap Multiselect is a JQuery based plugin to provide an intuitive user inte ...@@ -4,125 +4,11 @@ Bootstrap Multiselect is a JQuery based plugin to provide an intuitive user inte
**Note:** The option names may have changed due to the latest updates. **Note:** The option names may have changed due to the latest updates.
## Demo ## Demos
A demo of different configurations can be found [here](http://davidstutz.github.com/bootstrap-multiselect/). A demo of different configurations can be found [here](http://davidstutz.github.com/bootstrap-multiselect/).
## Examples For Knockout JS integration see some examples [here](http://davidstutz.github.io/bootstrap-multiselect/knockout-examples.html).
These examples can also be seen in action in index.html:
<link rel="stylesheet" href="css/bootstrap.min.css" type="text/css">
<link rel="stylesheet" href="css/bootstrap-responsive.min.css" type="text/css">
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/bootstrap-multiselect.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#example1').multiselect();
$('#example2').multiselect();
$('#example3').multiselect({
buttonClass: 'btn btn-link'
});
$('#example4').multiselect({
buttonClass: 'btn btn-small'
});
$('#example5').multiselect({
buttonClass: 'btn btn-primary disabled'
});
$('#example6').multiselect();
$('.example7').multiselect({
buttonContainer: '<span class="dropdown" />',
});
});
</script>
<p>
<select id="example1">
<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>
</p>
<p>
<select id="example2" multiple="multiple">
<option value="cheese" selected>Cheese</option>
<option value="tomatoes" selected>Tomatoes</option>
<option value="mozarella" selected>Mozzarella</option>
<option value="mushrooms">Mushrooms</option>
<option value="pepperoni">Pepperoni</option>
<option value="onions">Onions</option>
</select>
</p>
<p>
<select id="example3" 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>
</p>
<p>
<select id="example4" 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>
</p>
<p>
<select id="example5" 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>
</p>
<p>
<div class="input-prepend input-append btn-toolbar">
<span class="add-on"><b class="icon-list-alt"></b></span>
<select id="example6" 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 class="btn btn-danger">Cancel</button>
<button class="btn btn-success">Save</button>
</div>
</p>
<p>
<div class="input-prepend input-append">
<span class="add-on"><b class="icon-list-alt"></b></span>
<select class="example7" 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>
<select class="example7" multiple="multiple">
<option value="small">Small</option>
<option value="medium">Medium</option>
<option value="large">Large</option>
<option value="extra">Extra Large</option>
</select>
<button class="btn btn-primary">Save</button>
</div>
</p>
## Configuration Options ## Configuration Options
...@@ -312,7 +198,7 @@ Thanks to [@robwesterlund](https://twitter.com/robwesterlund) for the hint :) ...@@ -312,7 +198,7 @@ Thanks to [@robwesterlund](https://twitter.com/robwesterlund) for the hint :)
## License ## License
Copyright 2012 David Stutz Copyright 2012, 2013 David Stutz
Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at
......
index.html
View file @ bbe5381f
...@@ -42,6 +42,11 @@ ...@@ -42,6 +42,11 @@
<div class="page-header"> <div class="page-header">
<h1>Examples</h1> <h1>Examples</h1>
</div> </div>
<ul class="dropdown-menu">
<li><a href="">1</a></li>
<li><a href="">2</a></li>
<li><a href="">3</a></li>
</ul>
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function() { $(document).ready(function() {
window.prettyPrint() && prettyPrint(); window.prettyPrint() && prettyPrint();
...@@ -1354,7 +1359,7 @@ ...@@ -1354,7 +1359,7 @@
<div class="container-fluid"> <div class="container-fluid">
<hr> <hr>
<p> <p>
&copy; 2012 &copy; 2012, 2013
<a href="http://davidstutz.de">David Stutz</a> - <a href="http://www.apache.org/licenses/LICENSE-2.0">Apache License v2.0</a> <a href="http://davidstutz.de">David Stutz</a> - <a href="http://www.apache.org/licenses/LICENSE-2.0">Apache License v2.0</a>
</p> </p>
</div> </div>
......
knockout-examples.html
View file @ bbe5381f
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
<link rel="stylesheet" href="css/prettify.css" type="text/css"> <link rel="stylesheet" href="css/prettify.css" type="text/css">
<script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/knockout-2.2.1.debug.js"></script> <script type="text/javascript" src="js/knockout.debug.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script> <script type="text/javascript" src="js/bootstrap.js"></script>
<script type="text/javascript" src="js/bootstrap-multiselect.js"></script> <script type="text/javascript" src="js/bootstrap-multiselect.js"></script>
<script type="text/javascript" src="js/prettify.js"></script> <script type="text/javascript" src="js/prettify.js"></script>
...@@ -74,7 +74,7 @@ ...@@ -74,7 +74,7 @@
<div class="container-fluid"> <div class="container-fluid">
<hr> <hr>
<p> <p>
&copy; 2012 &copy; 2012, 2013
<a href="http://davidstutz.de">David Stutz</a> - <a href="http://www.apache.org/licenses/LICENSE-2.0">Apache License v2.0</a> <a href="http://davidstutz.de">David Stutz</a> - <a href="http://www.apache.org/licenses/LICENSE-2.0">Apache License v2.0</a>
</p> </p>
</div> </div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment