如何从SQL动态依赖选择中获取值

时间:2017-07-10 08:40:20

标签: php jquery mysql ajax

我已经关注一个网站使用SQL JQuery Ajax和PHP进行动态依赖选择,并且它的工作正常!但是我想从我选择的第二个和第三个选择框中获取值,并自动填写另一个输入框。那可能吗?

look like this

如果我选择了所有3个选择框并且数据已显示(从sql中获取) 我可以将这2个值复制到其他输入框并自动填充到框???

非常感谢

下面的代码

的index.php

<?php
$connect = mysqli_connect("localhost", "root", "", "testing");
$country = '';
$query = "SELECT country FROM country_state_city GROUP BY country ORDER BY country ASC";
$result = mysqli_query($connect, $query);
while($row = mysqli_fetch_array($result))
{
 $country .= '<option value="'.$row["country"].'">'.$row["country"].'</option>';
}
?>
<!DOCTYPE html>
<html>
 <head>
 </head>
 <body>
  <br /><br />
  <div class="container" style="width:600px;">
   <h2 align="center">Dynamic Dependent Select Box using JQuery Ajax with PHP</h2><br /><br />
   <select name="country" id="country" class="form-control action">
    <option value="">Select Country</option>
    <?php echo $country; ?>
   </select>
   <br />
   <select name="state" id="state" class="form-control action">
    <option value="">Select State</option>
   </select>
   <br />
   <select name="city" id="city" class="form-control">
    <option value="">Select City</option>
   </select>
  </div>
 </body>
</html>

<script>
$(document).ready(function(){
 $('.action').change(function(){
  if($(this).val() != '')
  {
   var action = $(this).attr("id");
   var query = $(this).val();
   var result = '';
   if(action == "country")
   {
    result = 'state';
   }
   else
   {
    result = 'city';
   }
   $.ajax({
    url:"fetch.php",
    method:"POST",
    data:{action:action, query:query},
    success:function(data){
     $('#'+result).html(data);
    }
   })
  }
 });
});
</script>

fatch.php

<?php
if(isset($_POST["action"]))
{
 $connect = mysqli_connect("localhost", "root", "", "testing");
 $output = '';
 if($_POST["action"] == "country")
 {
  $query = "SELECT state FROM country_state_city WHERE country = '".$_POST["query"]."' GROUP BY state";
  $result = mysqli_query($connect, $query);
  $output .= '<option value="">Select State</option>';
  while($row = mysqli_fetch_array($result))
  {
   $output .= '<option value="'.$row["state"].'">'.$row["state"].'</option>';
  }
 }
 if($_POST["action"] == "state")
 {
  $query = "SELECT city FROM country_state_city WHERE state = '".$_POST["query"]."'";
  $result = mysqli_query($connect, $query);
  $output .= '<option value="">Select City</option>';
  while($row = mysqli_fetch_array($result))
  {
   $output .= '<option value="'.$row["city"].'">'.$row["city"].'</option>';
  }
 }
 echo $output;
}
?>

1 个答案:

答案 0 :(得分:0)

创建两个输入框,然后使用jquery在更改两个选择框时填充这些输入框。

<div>
    <input id="forState" />
    <input id="forCity" />    
</div>

SCRIPT:

      $('#state').change(function(){              
          console.log($("#state option:selected").val());
          $('#forState').val($("#state option:selected").val());
      } );

      $('#city').change(function(){              
          console.log($("#city option:selected").val());
          $('#forCity').val($("#city option:selected").val());
      } );