When I select any even dropdown, then value of next dropdown will be same as I selected for previous dropdown. For example, when I change 2nd dropdown, the value of 3rd dropdown will be same as 2nd dropdown
$('#FinancialDataTable td:nth-child(2n)').find('select').on('change', function() {
var abc = $(this).next("input:first").val();
alert(abc);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="FinancialDataTable" class="table table-bordered table-hover">
<tbody>
<tr>
<th>From</th>
<th>To</th>
<th>Weight (In KG)</th>
<th>Rate (Rate Per KG)</th>
<th><input type="button" class="btn btn-primary addOption" value="Add Row"></th>
</tr>
<tr>
<td>
<select class="form-control select2 from" style="width:100%;" name="from[]" required="">
<option value="">Seller Firm</option>
<option value="2">XYZ</option>
</select>
</td>
<td>
<select class="form-control select2 to" style="width:100%;" name="to[]" required="">
<option value="">Select Purchaser Firm</option>
<option value="1">Nugen Feeds</option>
<option value="4">Vasu & Sons</option>
</select>
</td>
<td><input type="number" class="form-control weight" name="weight[]" required=""></td>
<td>
<input type="text" class="form-control rate" name="rate[]" required=""></td>
<td> <button class="btn btn-primary removeOption">Remove Rule</button></td>
</tr>
<tr>
<td>
<select class="form-control select2 from" style="width:100%;" name="from[]" required="">
<option value="0">Select Seller Firm</option>
<option value="1">Nugen Feeds</option>
<option value="4">Vasu & Sons</option>
</select>
</td>
<td>
<select class="form-control select2 to" style="width:100%;" name="to[]" required="">
<option value="">Select Purchaser Firm</option>
<option value="1">Nugen Feeds</option>
<option value="4">Vasu & Sons</option>
</select>
</td>
<td><input type="number" class="form-control weight" name="weight[]" required=""></td>
<td>
<input type="text" class="form-control rate" name="rate[]" required=""></td>
<td> <button class="btn btn-primary removeOption">Remove Rule</button></td>
</tr>
<tr>
<td>
<select class="form-control select2 from" style="width:100%;" name="from[]" required="">
<option value="0">Select Seller Firm</option>
<option value="1">Nugen Feeds</option>
<option value="4">Vasu & Sons</option>
</select>
</td>
<td>
<select class="form-control select2 to" style="width:100%;" name="to[]" required="">
<option value="">Select Purchaser Firm</option>
<option value="1">Nugen Feeds</option>
<option value="4">Vasu & Sons</option>
</select>
</td>
<td><input type="number" class="form-control weight" name="weight[]" required=""></td>
<td>
<input type="text" class="form-control rate" name="rate[]" required=""></td>
<td> <button class="btn btn-primary removeOption">Remove Rule</button></td>
</tr>
<tr>
<td>
<select class="form-control select2 from" style="width:100%;" name="from[]" required="">
<option value="0">Select Seller Firm</option>
<option value="1">Nugen Feeds</option>
<option value="4">Vasu & Sons</option>
</select>
</td>
<td>
<select class="form-control select2 to" style="width:100%;" name="to[]" required="">
<option value="">Seller Firm</option>
<option value="3">ABC</option>
</select>
</td>
<td><input type="number" class="form-control weight" name="weight[]" required=""></td>
<td>
<input type="text" class="form-control rate" name="rate[]" required=""></td>
<td> <button class="btn btn-primary removeOption">Remove Rule</button></td>
</tr>
</tbody>
</table>
2
Answers
Thanks to @Raeesh Alam
I got my answer with the help of your answer. I edited my code to following snippet.
Check below snippet I hope this will help you lot.