How to use Jquery Select2 – Select box with search ?

Today now here we know How to use Jquery Select2 – Select box with search ? We are always like to choose a good plugin for the search option in our select box. Now In this example i will be added select2.js, that will provide us select box with the search option.

If we are use select2.js, then we don’t need to add bootstrap js or css file. It is provides us it’s own js and css code. Here I will give you full example of the select box aalso with search option. 

Example:
<html lang="en">
<head>
    <title>Jquery Select2 - Select Box with Search Option</title>  
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>
	<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" />
	<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>
</head>
<body>
<div style="width:520px;margin:0px auto;margin-top:30px;height:500px;">
  <h2>Select Box with Search Option Jquery Select2.js</h2>
  <select class="myselect" style="width:500px;">
	  <option>Laravel</option>
	  <option>Laravel ACL</option>
	  <option>Laravel PDF</option>
	  <option>Laravel Helper</option>
	  <option>Laravel API</option>
	  <option>Laravel CRUD</option>
	  <option>Laravel Angural JS Crud</option>
	  <option>C++</option>
  </select>
</div>
<script type="text/javascript">
      $(".myselect").select2();
</script>
</body>
</html>

Read Also: How we can create virtual host in ubuntu apache?

Thanks for read. I hope it help you. For more you can follow us on facebook

close

About Shahriar Sagor

My name is Shahriar sagor. I'm a developer. I live in Bangladesh and I love to write tutorials and tips that will help to other Developer's. I am a big fan of PHP, Javascript, JQuery, Laravel, Codeigniter, VueJS, AngularJS and Bootstrap from the early stage.

View all posts by Shahriar Sagor →