Select option not showing data after selected option - php

Question

I'm trying to get a list of the "states" after I select the "country".
The list of countries appear correctly, but when I select the country the states don't actually show up in dropdown selection form.
I'm using ajax to send the data to ajaxData.php from index.php, but I can't figure out what I'm doing wrong.
Any help would be appreciated.
This is index.php
<script src="jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#country').on('change',function(){
var countryID = $(this).val();
if(countryID){
$.ajax({
type:'POST',
url:'ajaxData.php',
data:'marka_id='+countryID,
success:function(html){
$('#state').html(html);
$('#city').html('<option value="">Select state first</option>');
}
});
}else{
$('#state').html('<option value="">Select country first</option>');
$('#city').html('<option value="">Select state first</option>');
}
});
$('#state').on('change',function(){
var stateID = $(this).val();
if(stateID){
$.ajax({
type:'POST',
url:'ajaxData.php',
data:'modeli_id='+stateID,
success:function(html){
$('#state').html(html);
}
});
}else{
'');
}
});
});
</script>
<?php
//Include database configuration file
include('dbConfig.php');
//Get all country data
$query = $db->query("SELECT * FROM marka WHERE `status` = 1 ORDER BY marka_name ASC");
//Count total number of rows
$rowCount = $query->num_rows;
?>
<select name="country" id="country">
<option value="">SelectMarken </option>
<?php
if($rowCount > 0){
while($row = $query->fetch_assoc()){
echo '<option value="'.$row['marka_id'].'">'.$row['marka_name'].'</option>';
}
}else{
echo '<option value="">Country doesnt exist</option>';
}
?>
</select>
<select name="state" id="state">
<option value="">Select state</option>
</select>
and this is : ajaxData.php
<?php
//Include database configuration file
include('dbConfig.php');
if(isset($_POST["marka_id"]) && !empty($_POST["marka_id"])){
//Get all state data
$query = $db->query("SELECT * FROM modeli WHERE `marka_id` = ".$_POST['marka_id']." AND `status` = 1 ORDER BY modeli_name ASC");
//Count total number of rows
$rowCount = $query->num_rows;
//Display states list
if($rowCount > 0){
echo '<option value="">Select modelin</option>';
while($row = $query->fetch_assoc()){
echo '<option value="'.$row['modeli_id'].'">'.$row['modeli_name'].'</option>';
}
}else{
echo '<option value="">Modeli doesnt exist</option>';
}
}
?>
[UPDATED CODE] I forgot to post it immediately, so now this is what I have and it works.
ajaxData.php
<?php
//Include database configuration file
include('dbConfig.php');
if(isset($_POST["marka_id"]) && !empty($_POST["marka_id"])){
//Get all state data
$query = $db->query("SELECT * FROM modeli WHERE `marka_id` = ".$_POST['marka_id']." AND `status` = 1 ORDER BY modeli_name ASC");
//Count total number of rows
$rowCount = $query->num_rows;
//Display states list
if($rowCount > 0){
$optionHTML = '<option value="">Select modelin</option>';
while($row = $query->fetch_assoc()){
$optionHTML .= '<option value="'.$row['modeli_id'].'">'.$row['modeli_name'].'</option>';
}
echo $optionHTML;
}else{
echo '<option value="">Modeli doesnt exist</option>';
}
}
?>
index.php
<script src="jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#country').on('change',function(){
var countryID = $(this).val();
if(countryID){
$.ajax({
type:'POST',
url:'ajaxData.php',
data:'marka_id='+countryID,
success:function(html){
$('#state').html(html);
$('#city').html('<option value="">Select state first</option>');
}
});
}else{
$('#state').html('<option value="">Select country first</option>');
}
});
});
</script>
<?php
//Include database configuration file
include('dbConfig.php');
//Get all country data
$query = $db->query("SELECT * FROM marka WHERE `status` = 1 ORDER BY marka_name ASC");
//Count total number of rows
$rowCount = $query->num_rows;
?>
<select name="country" id="country">
<option value="">SelectMarken </option>
<?php
if($rowCount > 0){
while($row = $query->fetch_assoc()){
echo '<option value="'.$row['marka_id'].'">'.$row['marka_name'].'</option>';
}
}else{
echo '<option value="">Ss</option>';
}
?>
</select>
<select name="state" id="state">
<option value="">Select state</option>
</select>

Answer 1

The mistake was at the #state function, I had another part of code which was waiting data for cities once the state was selected.
So I had to make 'else' turn nothing for it to work.
Thanks guys.