I need to get the dropdown box value based on the previous dropdown box value in my code I need to get the first name and based on that I need to get last name in another drop down box please find my code.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var List;
jQuery.ajax({
url: "http://some ip address/igasp-admin/api.php/um_users?&transform=1",
type: "GET",
dataType: "json",
async: false,
success: function (data) {
var i;
List = data.um_users
$('#userData').empty();
for (i in List ) {
$('#userData').append('<option value="'+ List[i].last_name + '">' + List[i].first_name + '</option>');
$('#userorgData').append('<option value="">'+ List[i].last_name + '</option>');
}
}
});
});
</script>
</head>
<body>
<select style="width: 250px;" id="userData">
</select>
<select style="width: 250px;" id="userorgData">
</select>
</body>
</html>
You mean
$('#userData').append('<option value="'+ List[i].last_name + '">' + List[i].first_name + '</option>');
$('#userorgData').append('<option value="'+ List[i].last_name + '">' + List[i].last_name + '</option>');
and then have
$('#userData').on("change",function() {
$('#userorgData').val(this.value); // both have the same lastname as value
});
As in
$(function() {
$('#userData').on("change", function() {
$('#userorgData').val(this.value); // both have the same lastname as value
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<select id="userData">
<option value="">Please select</option>
<option value="Lennon">John</option>
<option value="McCartney">Paul</option>
<option value="Harrison">George</option>
<option value="Star">Ringo</option>
</select>
<select id="userorgData">
<option value="">Please select</option>
<option value="Lennon">Lennon</option>
<option value="McCartney">McCartney</option>
<option value="Harrison">Harrison</option>
<option value="Star">Star</option>
</select></div>
If you want to automatically select a lastname based on the selection of the name you should run a second ajax on the "onchange" of the first select.
My aproach would be to listen to the "onchange" of the first select, then fire an ajax request sending the value of the select (hopefully is the id of the table) and on php side use that id to get the lastname then iterate the options of the second select and find the matching "value" when found, set that option "selected"