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>
<select name="Name" required class="form-control" id="Name">
<option value="">Please Select Name</option>
<?php $sql3="SELECT * FROM clinic.appoint GROUP BY name";
$result3 = mysqli_query($con, $sql3) or die($sql3."<br/><br/>".mysql_error());
while($rows3=mysqli_fetch_array($result3)){?>
<option value="<?php echo $rows3['name'] ?>"><?php echo $rows3['name'] ?></option>
<?php } ?>
</select>
</th>
AJAX
$(document).ready(function(){
$("#Name").change(function(){
var selname =$(this).val();
display_name(selname);
});
function display_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
<?php
require_once ('../include/global.php');
if($_POST['selname']) {
$selname = $_POST['selname'];
$sql="SELECT * FROM clinic.appoint WHERE name='$selname'";
$result = mysqli_query($con, $sql) or die($sql."<br/><br/>".mysql_error());
while($rows=mysqli_fetch_array($result)){
?>
<tr>
<td scope="row"><?php echo $rows['time'] ?></td>
<td scope="row"><?php echo $rows['name'] ?></td>
<td scope="row"><?php echo $rows['date'] ?></td>
<td scope="row"><form action='/clinic form/appoint/delete.php'=<?php echo $rows['id']; ?>' method="post">
<input type="hidden" name="id" value="<?php echo $rows['id']; ?>">
<input type="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.