Dynamic Dropdown via PHP and Ajax - php

Question

Hey im trying to create a dynamic dropdown list using PHP and AJAX. Its worth mentioning that im using visual composer on my wordpress site. So i have to make it a shortcode for visual composer.
Here is currently what ive got.
function dropdownmenu() {
include_once "connection.php";
?>
<div class="make">
<label>Make</label>
<select name="makelist" onchange="getId(this.value);">
<option value="">Select Make</option>
<?php
$query = "select distinct(Make) from websitemasterlist order by Make ASC";
$results = mysqli_query($conn, $query);
foreach($results as $info) {
?>
<option value="<?php echo $info[Make]; ?>"><?php echo $info[Make]; ?></option>
<?php
}
?>
</select>
</div>
<div class="model">
<label>Model</label>
<select name="model" id="modellist">
<option value="">Select Model</option>
</select>
</div>
<script src="code.jquery.com/jquery-3.2.1.min.js"></script>
<script>
function getId(val){
$.ajax({
type: "POST",
url: "getdata.php",
data: "make="+val,
success: function(data){
$("#modellist").html(data);
}
});
}
</script>
<?php
}
add_shortcode('dropdownform','dropdownmenu');
?>
I think the error is somewhere in the ajax. because my ajax is weak.
here is the code for the secondary dynamic dropdown
<?php
include_once "connection.php";
if (!empty($_POST["make"])) {
$make = $_POST["make"];
echo $make;
$query = "SELECT distinct(Model) FROM websitemasterlist where Make=$make";
$results = mysqli_query($conn, $query);
foreach ($results as info2){
?>
<option value="<?php echo info2["Model"]; ?>"><?php echo info2["Model"]; ?></option>
<?php
}
}
?>
The first dropdown works. but the second dropdown doesn't show any choices when i make a choice on the first dropdown. Any help would be appreciated thank you. Its also worth mentioning that when i try to echo the make .... i dont see the make. so im pretty sure the ajax portion is messed up.
The errors I'm getting from the console