我的表格有三个选择.每个都取决于上一个值的值

Question

我的表格有三个选择。

每个都取决于上一个的值。

我的意思是有类别的下拉列表， CAR BRAND 和汽车模型。

带有汽车品牌的列表必须显示所选类别的品牌。汽车模型还由选定的品牌组成。

表格HTML，服务器语言是PHP，我想使用Ajax jQuery获取Select的值。

帮助它应该如何？

Answer 1

您应该做这样的事情：

   jQuery(function($) {
var brands = {
    'Trucks': ['Ford', 'Chevrolet'],
    'Cars': ['Honda', 'Volkzwagen'],
}
var models = {
    'Ford': ['Model1', 'Model2'],
    'Chevrolet': ['Model3', 'Model4'],
    'Honda': ['Model5', 'Model6'],
    'Volkzwagen': ['Model7', 'Model8'],
}
var $brands = $('#brand');
var $models = $('#model');

$('#category').change(function () {
    var category = $(this).val(), brnds = brands[category] || [];
    var html = $.map(brnds, function(brnd){
        return '<option value="' + brnd + '">' + brnd + '</option>'
    }).join('');
    $brands.html('<option>Select</option>'+html)
    $models.html('');
});
$('#brand').change(function () {
    var brand = $(this).val(), mdls = models[brand] || [];
    var html = $.map(mdls, function(mdl){
        return '<option value="' + mdl + '">' + mdl + '</option>'
    }).join('');
    $models.html(html)
});
  });

检查此jsfiddle：http：//jsfiddle.net/minijavi19/2pza5/1908/

当然，如果要使用Ajax，则应将变量设置为。

Answer 2

感谢所有关注我问题的人！！！但是我想与您分享我的解决方案。那里的ara 3文件：index.php，ajax-queries.js，php-funcs.php。

//index.php
$categories = $mysqli->query("SELECT category_id, category_name FROM 
categories") or die($mysqli->error);
<form action="../../php/admin_funcs.php" method="post">
    <select id="cat_slc" class="lists" name="category" >
        <option disabled selected>Выберите категорию</option>
        <?php
        while ($crow = $categories->fetch_assoc())
        {
            echo "<option 
          value='".$crow['category_id']."'>".$crow['category_name']."
                  </option>";
        }
        ?>
    </select>
    <select id="marka_slc" class="lists marka-select" name="marka" >
        <option disabled selected>Выберите марку</option>
    </select>
    <select id="model_slc" class="lists model-select" name="mode">
        <option disabled selected>Выберите модель</option>
    </select>
</form>
//ajax-queries.js
$('#cat_slc').change(function () {
var cat_id = $(this).val();
var url = '../../php/data_functions.php';
$('#marka_slc').load(url + '#mark-block', {cat_id: cat_id}, function () {
    $('.marka-select').fadeIn('slow');
  });
});
$('#marka_slc').change(function(){
 var mark_id = $(this).val();
 var url = '../../php/data_functions.php';
$('#model_slc').load(url + '#model-block', {mark_id: mark_id}, function (){
   $('.model-select').fadeIn('slow');
 });
});
//php-funcs.php
<?php
require_once "db_connect.php";
function GetMarkas(){
global $mysqli;
$category_id = $_POST['cat_id'];
$query = "SELECT marka_id, marka_name FROM marka WHERE category_id = 
'".$category_id."'";
$result = $mysqli->query($query);
$data = '';
while ($row = $result->fetch_assoc()){
    $data .= "<option value='".$row['marka_id']."'>".$row['marka_name']."
</option>";
}
return $data;
}
function GetModels(){
global $mysqli;
$mark_id = $_POST['mark_id'];
$query = "SELECT model_id, model_name FROM model WHERE marka_id= 
'".$mark_id."'";
$result = $mysqli->query($query);
$data = '';
while ($row = $result->fetch_assoc()){
    $data .= "<option value='".$row['model_id']."'>".$row['model_name']."
</option>";
}
return $data;
}

if(isset($_POST['mark_id'])){
  echo"<div id='model-block'>" .  GetModels() . "</div>";
}
else if(isset($_POST['cat_id'])){
  echo"<div id='mark-block'>" .  GetMarkas() . "</div>";
}