I have a scenario where students need to pay monthly fees for their classes.
My objective is as follows: 1. Dropdown #1: Student Names 2. Dropdown #2: Month Names 3. Textbox: Fees amount for the selected month
The code I am using:
$(document).ready(function() {
$("#myDropdown").change(function() {
var selectedValue = $(this).val();
$("#txtBox").val(selectedValue);
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table id="tab1">
<tr>
<td>Select Affiliate Source:</td>
<td>
<select id="myDropdown">
<option value="jan" label="2000">January</option>
<option value="apr" label="2500">April</option>
<option value="jul" label="2000">July</option>
<option value="oct" label="2500">October</option>
</select>
<div>
<input id="txtBox" type="text" readonly='1'>
</div>
</td>
</tr>
</table>
This code was sourced from stackoverflow. However, I'm facing challenges with: 1. Implementing a chained dropdown for students and months, ensuring that only when a student is selected does the months dropdown become active. 2. Displaying the value in the label attribute of the selected month in the textbox.
Any suggestions would be greatly appreciated.
Thank you, GenXCoders