select2.js multiple

by Kabir Hossain

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/select2/3.2/select2.min.js"></script>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/select2/3.2/select2.css">
<h4>After selecting type and garage, When the user will click on stock field, ther previously selected value will be put on the clicked stock, But my code gives me the same as first and second times</h4>
<br/>
<div id="items">
    <p>Type:</p>
    <select name="Type[]" class="select2 pd" style="width: 50%;">
    <option value="1">Garage1</option>
    <option value="2">Garage2</option>
    <option value="3">Garage3</option>
    <option value="4">Street parking4</option>
    <option value="5">Carport5</option>
    </select>
    <input type="hidden"> 
    
    <p>Garage:</p>
    <select name="garage[]" class="select2 gd" style="width: 50%;">
    <option value="1">Garage1</option>
    <option value="2">Garage2</option>
    <option value="3">Garage3</option>
    <option value="4">Street parking4</option>
    <option value="5">Carport5</option>
    </select>
    <p>Stock:</p><input type="text" name="stock[]" class="stock">

    <p>Type:</p>
    <select name="Type[]" class="select2 pd" style="width: 50%;">
    <option value="1">Garage1</option>
    <option value="2">Garage2</option>
    <option value="3">Garage3</option>
    <option value="4">Street parking4</option>
    <option value="5">Carport5</option>
    </select>
    <input type="hidden">  
    
   <p>Garage:</p>
    <select name="garage[]" class="select2 gd" style="width: 50%;">
    <option value="1">Garage1</option>
    <option value="2">Garage2</option>
    <option value="3">Garage3</option>
    <option value="4">Street parking4</option>
    <option value="5">Carport5</option>
    </select>
    <p>Stock:</p><input type="text" name="stock[]" class="stock">
    
          <p>Type:</p>
    <select name="Type[]" class="select2 pd" style="width: 50%;">
    <option value="1">Garage1</option>
    <option value="2">Garage2</option>
    <option...

JavaScript

$(".select2").select2();
$('#items').on('click','.stock',function(){
			var indx = $('.stock').index(this);
			var p_id = $('.pd').eq(indx).select2("val");
			var g_id = $('.gd').eq(indx).select2("val");
            v = p_id+g_id;
              $('.stock').eq(indx).val(v);  
		});