As suggested in Comments, you made mistakes in your code;
1.Binding change function
with wrong selector id
$("#Name2").change(function(){
and the HTML is
<select name="Name" required class="form-control" id="Name">
Should be $("#Name").change(function(){
it will fix the problem Undefined selname at line 5
2.Name Ajax Method success function
success: function(data) {
$("#Schedule2").html(dataname);
}
Should be $("#Schedule2").html(data);
And in PHP; credit goes to @j08691
change $selDate
$selDate = $_POST['selname'];
to $selname
$selname = $_POST['selname'];
$sql="SELECT * FROM clinic.appoint WHERE name='$selname'";
As you said in question, your first Ajax Call is working fine and you are facing problem in 2nd Ajax call method, after fixing above mistakes
HTML
<th><selectname="Name"requiredclass="form-control"id="Name"><optionvalue="">Please Select Name</option><?php$sql3="SELECT * FROM clinic.appoint GROUP BY name";
$result3 = mysqli_query($con, $sql3) ordie($sql3."<br/><br/>".mysql_error());
while($rows3=mysqli_fetch_array($result3)){?><optionvalue="<?phpecho$rows3['name'] ?>"><?phpecho$rows3['name'] ?></option><?php } ?></select></th>
AJAX
$(document).ready(function(){
$("#Name").change(function(){
var selname =$(this).val();
display_name(selname);
});
functiondisplay_name(selname) {
$("#scheduleName").html(selname);
var dataString = 'selname='+ selname;
$.ajax({
type: "POST",
url: "getdatabyname.php",
data: dataString,
cache: false,
success: function(data) {
$("#Schedule").html(data);
}
});
}
});
PHP
<?phprequire_once ('../include/global.php');
if($_POST['selname']) {
$selname = $_POST['selname'];
$sql="SELECT * FROM clinic.appoint WHERE name='$selname'";
$result = mysqli_query($con, $sql) ordie($sql."<br/><br/>".mysql_error());
while($rows=mysqli_fetch_array($result)){
?><tr><tdscope="row"><?phpecho$rows['time'] ?></td><tdscope="row"><?phpecho$rows['name'] ?></td><tdscope="row"><?phpecho$rows['date'] ?></td><tdscope="row"><formaction='/clinic form/appoint/delete.php'=<?phpecho$rows['id']; ?>' method="post"><inputtype="hidden"name="id"value="<?phpecho$rows['id']; ?>"><inputtype="submit"name="submit1"value="Done"></form></td></tr><?php } } ?>
(OP reached me via email and explained what he is trying to do)
Now, you are fetching result by 2 different <select>
element using Ajax and trying to show the result based on <select>
element and in both Ajax calls success: function
you are targeting 2 different id's
to show the data for each <select>
Ajax call e.g
$("#Schedule").html(data);
$("#Schedule2").html(data);
I would suggest to use the same id
selector in both Ajax calls success: function
to show the data
$("#Schedule").html(data);
By doing so, when you switch between select element, to show the data, it will replace the first fetched data.
Last, I totally agree with @Jared Smith what he said about mixing PHP and JavaScript, it's really not good practice.