Falcon Falcon - 5 months ago 16
jQuery Question

Ajax Php dependent dropdown select - How to post name of city instead id into database (submit from data)?

Few days I try to solve problem but no luck.
Problem is next:


  • Web form with dependent dropdown select box where user can select his
    city, zip and street and that work but.

  • When I submit form in my database no
    city_name
    (text) - only
    city_id
    (number/value).



So, question is - How to post
city_name
in database? User is from Rome and I Rome (text) is submited not
city_id
(number).

Select input:

<div class="form-group">
<label class="col-md-4 control-label" for="grad">City:*</label>
<div class="col-md-4">
<select type="text" name="city_name" id="city_name" class="form-control input-sm">
<option value=""></option>
<option value="999">---Enter city yourself---</option>
<?php $sql_query="SELECT * FROM city_table order by city_id asc";
$result=mysqli_query($dbconfig,$sql_query);
while($row=mysqli_fetch_array($result,MYSQLI_ASSOC)){
?>
<option value="<?php echo $row['city_id'].'_'.$row['city_name'];?>"><?php echo $row['city_name'];?></option>
<?php }?>
</select>
</div>
</div>


<!-- Select Basic -->
<div class="form-group">
<label class="col-md-4 control-label" for="post_no">ZIP code:*</label>
<div class="col-md-4">
<select name="zip_name" id="zip_name" class="form-control input-sm" onchange="recalculate_price();">

</select>
</div>
</div>


<!-- Select Basic -->
<div class="form-group">
<label class="col-md-4 control-label" for="address">Street:*</label>
<div class="col-md-4">
<select name="street_name" id="street_name" class="form-control input-sm" onchange="recalculate_price();">

</select>
</div>
</div>


get_zip_php

<?php
include('db_config.php');
if($_POST['id'])
{
$id=$_POST['id'];

$sql_query="SELECT * FROM zip_table where city_id='$id' order by zip_name asc";
$result=mysqli_query($dbconfig,$sql_query);
?>
<option selected="selected">Select ZIP code :</option><?php
while($row=mysqli_fetch_array($result,MYSQLI_ASSOC))
{
?>
<option value="<?php echo $row['zip_id']; ?>-<?php echo $row['limousine']; ?>-<?php echo $row['kombi']; ?>-<?php echo $row['mini_van']; ?>"><?php echo $row['zip_name']; ?></option>
<?php
}
}
?>


get_street_php

<?php
include('db_config.php');
if($_POST['id'])
{
$id=$_POST['id'];

$sql_query="SELECT * FROM street_table where zip_id='$id' order by street_name asc";
$result=mysqli_query($dbconfig,$sql_query);
?>
<option selected="selected">Select street please :</option><?php
while($row=mysqli_fetch_array($result,MYSQLI_ASSOC))
{
?>
<option value="<?php echo $row['street_id']; ?>"><?php echo $row['street_name']; ?></option>
<?php
}
}
?>


Ajax:

<script>
$(document).ready(function()
{
$("#city_name").change(function()
{
var id=$(this).val();
var data = 'id='+ id;

$.ajax
({
type: "POST",
url: "get_zip.php",
data: data,
cache: false,
success: function(html)
{
$("#zip_name").html(html);
recalculate_price();
}
});
});


$("#zip_name").change(function()
{
var id=$(this).val();
var data = 'id='+ id;

$.ajax
({
type: "POST",
url: "get_street.php",
data: data,
cache: false,
success: function(html)
{
$("#street_name").html(html);
recalculate_price();
}
});
});
});
</script>


If I make some changes on "select city part" (I
m beginner and really I
m lost in all this) I can`t pass zip.

So, please tell me where to make all changes to pass all that things and post
city_name
, zip (name...I make it as "xxxx - city") and street name. Please help me, I googled and read here about problems few days and can`t continue work on my project until I fix this. Thanks in advance.

Answer

Use bellow select tag. It may useful for you


<select type="text" name="city_name" id="city_name" class="form-control input-sm">
    <option value=""></option>
    <option value="999">---Enter city yourself---</option>
    <?php 
        $sql_query="SELECT * FROM city_table order by city_id asc";
        $result=mysqli_query($dbconfig,$sql_query);
        while($row=mysqli_fetch_array($result,MYSQLI_ASSOC)){
            echo  "<option value='".$row['city_id']."'>".$row['city_name']."</option>";
        }
    ?>
</select>