I noticed that setting up the condition on self, does work without a page reload.
I am wondering how to reduce the amount of selections available.
since the condition of self using if empty hide,works instant without reload, as soon as its selected the next row appears.
is there a query available to select the province from the country code of the country previously selected field? the database has the country codes and province codes,
i did create index for all 3 as follows
CREATE INDEX countries_full_name_idx
ON countries (name)
if a basic query can not handle this, could a combination of query and indexes work for something like this?
am i going the wrong direction on this?
here are a couple files i am referring too
index.php
<?php
error_reporting(E_ALL);
ini_set('display_errors', 1);
include("connection.php");
?>
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css" type="text/css" />
</head>
<body>
<div id="container">
<div id="body">
<div id="dropdowns">
<div id="center" class="cascade">
<?php
$sql = "SELECT DISTINCT state FROM tbl_zip ORDER BY state ASC";
$query = mysqli_query($con, $sql);
?>
<label>State:
<select name="state" id = "state">
<option value="">Please Select</option>
<?php while ($rs = mysqli_fetch_array($query, MYSQLI_ASSOC )) { ?>
<option value="<?php echo $rs["state"]; ?>"><?php echo $rs["state"]; ?></option>
<?php } ?>
</select>
</label>
</div>
<div id="city" class="cascade"></div>
<div id="zip" class="cascade"></div>
</div>
</div>
</div>
<script src="
ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js
">
<script>
$(document).ready(function(){
$("select#state").change(function(){
var state = $("select#state option:selected").attr('value');
alert(state);
$("#city").html( "" );
$("#zip").html( "" );
if (state.length > 0 ) {
alert(state.length);
$.ajax({
type: "POST",
url: "fetch_state.php",
data: "state="+state,
cache: false,
beforeSend: function () {
$('#city').html('<img src="loader.gif" alt="" width="24" height="24">');
},
success: function(html) {
$("#city").html( html );
}
});
}
});
});
</script>
<script src="
ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js
">
<script>
$(document).ready(function(){
$("select#drop2").change(function(){
var state_id = $("select#drop2 option:selected").attr('value');
// alert(state_id);
if (state_id.length > 0 ) {
$.ajax({
type: "POST",
url: "fetch_city.php",
data: "city="+city,
cache: false,
beforeSend: function () {
$('#city').html('<img src="loader.gif" alt="" width="24" height="24">');
},
success: function(html) {
$("#city").html( html );
}
});
} else {
$("#city").html( "" );
}
});
});
</script>
</body>
</html>
fetch_state.php
<?php
include("connection.php");
var_dump($_POST);
$state = trim(mysqli_escape_string($con, $_POST["state"]));
$sql = "SELECT DISTINCT city FROM tbl_zip WHERE state = '".$state ."' ORDER BY city";
$count = mysqli_num_rows( mysqli_query($con, $sql) );
if ($count > 0 ) {
$query = mysqli_query($con, $sql);
?>
<label>City:
<select name="city" id="drop2">
<option value="">Please Select</option>
<?php while ($rs = mysqli_fetch_array($query, MYSQLI_ASSOC)) { ?>
<option value="<?php echo $rs["city"]; ?>"><?php echo $rs["city"]; ?></option>
<?php } ?>
</select>
</label>
<?php
}
?>
krileon
