vicario
vicario

Reputation: 233

how to use select2 bootstrap

im new at select2 im using bootsrap v3.3.6

how to plugin the select2 bootstrap? i already input

<link href="css/select2.css" rel="stylesheet">
<link href="css/select2-bootstrap.css" rel="stylesheet">
<select id="position" style="width: 15%">
                <option value=""></option>
                <option>One</option>
                <option>Two</option>
<script src="js/select2.js"></script>
 $("#position").select2({
        allowClear:true,
        placeholder: 'Position'
      });

but the output still like the default select2. not like bootstrap, please help

Upvotes: 0

Views: 26792

Answers (2)

Dev
Dev

Reputation: 410

Please update your code as follows:-

 <link href="css/select2.css" rel="stylesheet">
 <link href="css/select2-bootstrap.css" rel="stylesheet">
 <select id="position" style="width: 15%">
 <option value=""></option>
 <option>One</option>
 <option>Two</option>
 <script src="js/select2.js"></script>
 <script>
 $("#position").select2({
 allowClear:true,
 placeholder: 'Position'
 });
 </script>

Links are as follows:

https://cdnjs.com/libraries/select2
https://cdnjs.com/libraries/select2-bootstrap-css
https://cdnjs.com/libraries/select2?ref=driverlayer.com/web

Hope that helps!

Upvotes: 1

Carol Skelly
Carol Skelly

Reputation: 362360

The $("#position").select2(..) instance should be inside script tags. Make sure you close the select tag. Make sure you're properly referencing the select2.css and select2.js and that there are no errors in the browser console.

http://codeply.com/go/YNg1JSaysI

Upvotes: 2

Related Questions