How to get data from dropdown menu into table?

Hello everyone
I have web page with 4 drop down menu list and one description box.
and there is infinity table with 5 columns with the button (Save)
when user click on (Save) button … new row will add to the table.
now I need to get the data that user selected from drop menu list into the table and click (Save) to add new row in the table an choose new data from the drop menu to add them in the new row in the table…

<div class="col-12" style="width: 1514px">
	<select name="pavlocation" id="locapavm" style="width: 26%">
			<option value="">- Location -</option>
			<option value="Runway 17">Runway 17</option>
			<option value="Runway 35">Runway 35</option>
		    <option value="Runway 18">Runway 18</option>
		    <option value="Runway 36">Runway 36</option>
</select><br></div>
<!---------------------------------------------------------------------->
 <div class="col-12" style="width: 1514px">
<select name="pavseverity" id="sevepavm" style="width: 26%">
	<option value="">- Severity -</option>
	<option value="Low">Low</option>
	<option value="Medium"> Medium</option>
	<option value="High">High</option>
</select><br> </div>
<!---------------------------------------------------------------------->
<div class="col-12">
<select name="ddlPassport" id="ddlPassport" style="width: 26%" onchange = "ShowHideDiv()">
<option value="">- Pavement Type -</option>
<option value="Flexible Pavement (Asphalt)">Flexible Pavement (Asphalt)</option>
<option value="Rigid Pavement (Concrete)">Rigid Pavement (Concrete)</option>
</select></div>
<!---------------------------------------------------------------------->
<select name="lightoper" id="gh" style="width: 42%" class="auto-style2" >
			<option value="">- Operational -</option>
			<option value="Yes"  style="background-color: #29BB29">Yes</option>
			<option value="No"  style="background-color: #FE4E4E">No</option>
</select><br>
<p class="auto-style1">Maintenance Plan:</p>  
   <textarea name="pavplan" id="planpavm" style="width: 572px; height: 129px" ></textarea><br>
   <ul class="actions">
	<li><a class="button add_another" value="Save">Save</a></li></ul>
	<table id="tbl" style="width: 67%">
<thead>
  <tr>
	<th>Location</th>
	<th>severity</th>
	<th>Pavement Type</th>
	<th>Maintenance Plan</th>
</tr>
</thead>
   <tr>   
      <td><input type="text" name="loca" disabled/></td>
      <td><input type="text" name="seve" disabled/></td> 
      <td><input type="text" name="type" disabled/></td>
      <td><input type="text" name="plan" disabled/></td>
    </tr>
</table>
<script>
$('document').ready(function() {
  $('.add_another').click(function() {
      $("#tbl").append('<tr><td><input type="text" class="txtbox" value="" disabled/></td><td><input type="text" class="txtbox" value="" disabled/></td><td><input type="text" class="txtbox" value="" disabled/></td><td><input type="text" class="txtbox" value="" disabled/></td></tr>');
   });
})</script>

this is the code
How to get the data that chosen into this table?

1 Like

Let’s say I have a dropdown menu with an id=“my-dropdown”, I could use the following jQuery selector to get the value of the selected dropdown value. You would assign the value returned to a variable which you could then insert (via concatenation) to the value attribute of the applicable input element in your append method.

$('#my-dropdown option:selected').val();
1 Like

How I can make for loop to get the data last 10 minute only??

What for loop are you talking about? I do not see a for loop in your current code.