I'm trying to get this fixed for hours now. The thing is that I don't get any errors. So here is the problematic code:
error_reporting(E_ALL);
ini_set('display_errors', 1);
//Include database configuration file
include('includes/config.php');
if(isset($_POST["country_id"]) && !empty($_POST["country_id"])){
//Get all state data
$query = $dbh->query("SELECT * FROM states WHERE country_id = ".$_POST['country_id']." AND status = 1 ORDER BY state_name ASC");
//Count total number of rows
$rowCount = $query->rowCount();
//Display states list
if($rowCount > 0){
echo '<option value="">Select state</option>';
while($row = $query->fetch(PDO::FETCH_ASSOC)){
echo '<option value="'.$row['state_id'].'">'.$row['state_name'].'</option>';
}
}else{
echo '<option value="">State not available</option>';
}
}
Here is the working one:
<script type="text/javascript">
$(document).ready(function(){
$('#country').on('change',function(){
var countryID = $(this).val();
if(countryID){
$.ajax({
type:'POST',
url:'ajaxData.php',
data:'country_id='+countryID,
success:function(html){
$('#state').html(html);
}
});
}else{
$('#state').html('<option value="">Select country first</option>');
}
});
});
</script>
<?php
//Get all country data
$query = $dbh->query("SELECT * FROM countries WHERE status = 1 ORDER BY country_name ASC");
//Count total number of rows
$rowCount = $query->rowCount();
?>
<div class="form-group">
<label class="col-sm-2 control-label">Country<span style="color:red">*</span></label>
<div class="col-sm-4">
<select name="country" id="country" class="form-control" required>
<option value="">Select Country</option>
<?php
if($rowCount > 0){
while($row = $query->fetch(PDO::FETCH_ASSOC)){
echo '<option value="'.$row['country_id'].'">'.$row['country_name'].'</option>';
}
}else{
echo '<option value="">Country Not Found</option>';
}
?>
</select>
</div>
<label class="col-sm-2 control-label">State<span style="color:red">*</span></label>
<div class="col-sm-4">
<select name="state" id="state" class="form-control" required>
<option value="">Select a State</option>
</select>
</div>
</div>
So any help would be appreciate, I can't understand why in the first file it is not working and in the second it is. Thanks in advance. I search and checked a lot of questions here on stackoverflow but I didn't got my answer yet...