Select2 plugin in Jquery

Select2, a JQuery Plugin which is used as a replacement for select box with support for searching, tagging, remote data sets, infinite scrolling and many other highly used options and contains event handling.

Include the following lines of code in the <head> section of your HTML.

<script src="http://scriptsgurus.com/download/select2/jquery.min.js"></script>
<link href="http://scriptsgurus.com/download/select2/select2.min.css" rel="stylesheet" />
<script src="http://scriptsgurus.com/download/select2/select2.min.js"></script>

Initialize Select2 on the <select> element that you want to make awesome.

<script type="text/javascript">
   $('select').select2();
</script>

Initialize Select2 on the id element that you want to make awesome.

<script type="text/javascript">
  $('#language').select2();
</script>

Complete page source here.

<!DOCTYPE html>
<html>
    <head>
        <title>Select 2</title>
        <script src="http://scriptsgurus.com/download/select2/jquery.min.js"></script>
        <link href="http://scriptsgurus.com/download/select2/select2.min.css" rel="stylesheet" />
        <script src="http://scriptsgurus.com/download/select2/select2.min.js"></script>
    </head>
    <body>
        <select name="language">
            <option value="">Select Language</option>
            <option value="php">PHP</option>
            <option value="laravel">Laravel</option>
            <option value="codeigniter">Codeigniter</option>
        </select>
    </body>
    <script type="text/javascript">
      $('select').select2();
    </script>
</html>

Leave a Reply

Your email address will not be published. Required fields are marked *