|
@@ -31,16 +31,21 @@ and turn it into this...
|
|
|
|
|
|
<script type="text/javascript" class="js-code-example-basic-single">
|
|
<script type="text/javascript" class="js-code-example-basic-single">
|
|
$(document).ready(function() {
|
|
$(document).ready(function() {
|
|
- $(".js-example-basic-single").select2();
|
|
|
|
|
|
+ $('.js-example-basic-single').select2();
|
|
});
|
|
});
|
|
</script>
|
|
</script>
|
|
|
|
|
|
Select2 will register itself as a jQuery function if you use any of the distribution builds, so you can call `.select2()` on any jQuery selector where you would like to initialize Select2.
|
|
Select2 will register itself as a jQuery function if you use any of the distribution builds, so you can call `.select2()` on any jQuery selector where you would like to initialize Select2.
|
|
|
|
|
|
```
|
|
```
|
|
-$('.js-example-basic-single').select2();
|
|
|
|
|
|
+// In your Javascript (external .js resource or <script> tag)
|
|
|
|
+$(document).ready(function() {
|
|
|
|
+ $('.js-example-basic-single').select2();
|
|
|
|
+});
|
|
```
|
|
```
|
|
|
|
|
|
|
|
+>>>>>> The DOM cannot be safely manipulated until it is "ready". To make sure that your DOM is ready before the browser initializes the Select2 control, wrap your code in a [`$(document).ready()`](https://learn.jquery.com/using-jquery-core/document-ready/) block. Only one `$(document).ready()` block is needed per page.
|
|
|
|
+
|
|
## Multi-select boxes (pillbox)
|
|
## Multi-select boxes (pillbox)
|
|
|
|
|
|
Select2 also supports multi-value select boxes. The select below is declared with the `multiple` attribute.
|
|
Select2 also supports multi-value select boxes. The select below is declared with the `multiple` attribute.
|
|
@@ -51,11 +56,9 @@ Select2 also supports multi-value select boxes. The select below is declared wit
|
|
</p>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
-```
|
|
|
|
-<script type="text/javascript">
|
|
|
|
-$(".js-example-basic-multiple").select2();
|
|
|
|
-</script>
|
|
|
|
|
|
+**In your HTML:**
|
|
|
|
|
|
|
|
+```
|
|
<select class="js-example-basic-multiple" multiple="multiple">
|
|
<select class="js-example-basic-multiple" multiple="multiple">
|
|
<option value="AL">Alabama</option>
|
|
<option value="AL">Alabama</option>
|
|
...
|
|
...
|
|
@@ -63,6 +66,14 @@ $(".js-example-basic-multiple").select2();
|
|
</select>
|
|
</select>
|
|
```
|
|
```
|
|
|
|
|
|
|
|
+**In your Javascript (external `.js` resource or `<script>` tag):**
|
|
|
|
+
|
|
|
|
+```
|
|
|
|
+$(document).ready(function() {
|
|
|
|
+ $('.js-example-basic-multiple').select2();
|
|
|
|
+});
|
|
|
|
+```
|
|
|
|
+
|
|
<script type="text/javascript">
|
|
<script type="text/javascript">
|
|
$.fn.select2.amd.require([
|
|
$.fn.select2.amd.require([
|
|
"select2/core",
|
|
"select2/core",
|