Ajax Php依赖下拉选择 - 如何将城市名称而不是id发布到数据库中（从数据提交）？

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" (Im beginner and really Im 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.

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>

fetch city name from database on the basis of city id in your POST array before INSERT Query.

SELECT `city_name` FROM `city_table` WHERE `city_id`='".$_POST['city_name']."'

then use that city name in your insert query.

Concatenate the id with value like this using delimiter like this

<option value="<?php echo $row['city_id'].'_'.$row['city_name'];?>"><?php echo $row['city_name'];?></option>

In php use explode()

The explode() function breaks a string into an array.

    $ss = explode('_','6_Rome'); 

    print_r($ss); 

    echo $ss[0];  //6 pass the value into query 

In jquery use split()

Split a string into an array of substrings: use split()

    $vv = variable_name.split("_");