jQuery select2 get selected value using jQuery.

jQuery select2 get selected value using jQuery.

jQuery select 2 is the most popular javascript framework for the select dropdown. jQuery select 2 provide beautiful functionality for searching value from the dropdown option. jQuery select 2 is the best solution for the dropdown because We can easily render more than thousand of data on the dropdown.

Let’s see how we can use the select 2 and get the value of select 2 value using jQuery.

First of all, let’s create the HTML dropdown for with select 2.

<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css" rel="stylesheet" />
<select class="thecodingstuff-select2">
    <option value="">Select Value</option>
    <option value="first">First</option>
    <option value="second">Second</option>
    <option value="third">Third</option>
    <option value="four">Four</option>
    <option value="five">Five</option>
    <option value="six">Six</option>
    <option value="seven">Seven</option>
    <option value="eight">Eight</option>

Let’s define the select 2 for our dropdown using jQuery.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script>

<script type="text/javascript">
    $(document).ready(function() {

Our select2 example is ready for use now let’s get the selected value using jQuery.


We can get selected value using “val()” function.

If you face any issue after using above code write the comment below.