Question

美好的一天，

我有以下动态下拉列表。在这里，如果您从第一个列表中选择国家/地区，则相关状态将从第二个列表中的数据库中提取。

我需要做什么：现在，根据与第一个下拉列表关联的“ID”填充第二个下拉列表。我需要它依赖于第一个下拉列表的“值”。

如果有人能帮助我这样做，我将非常感激。

我是新来的。我也很感激任何建议。

非常感谢提前。 Ashique

SQL表结构：column1 = id，column2 = country_name，column3 = state_name，column4 = city_name

这是SQL代码：

        CREATE TABLE IF NOT EXISTS `globe` (
  `id` int(3) NOT NULL,
  `country_name` varchar(20) NOT NULL,
  `state_name` varchar(20) NOT NULL,
  `city_name` varchar(20) NOT NULL
) ENGINE=MyISAM DEFAULT CHARSET=latin1;

--
-- Dumping data for table `globe`
--

INSERT INTO `globe` (`id`, `country_name`, `state_name`, `city_name`) VALUES
(3, 'UK', 'LT', 'london'),
(2, 'Canada', 'BC', 'vancuvar'),
(1, 'USA', 'NY', 'new york');

以下是使用Ajax的HTML数据：

    <html xmlns="http://www.w3.org/1999/xhtml"><head profile="http://gmpg.org/xfn/11">
<head>
<title>Country State City Dependent Dropdown using Ajax</title>
<script type="text/javascript" src="jquery-1.9.1.js"></script>

<script type="text/javascript">
$(document).ready(function(){
    load_options('','country');
});

function load_options(id,index){
    $("#loading").show();
    if(index=="state"){
        $("#city").html('<option value="">Select city</option>');
    }
    $.ajax({
        url: "ajax.php?index="+index+"&id="+id,
        complete: function(){$("#loading").hide();},
        success: function(data) {
            $("#"+index).html(data);
        }
    })
}
</script>
</head>
<body>
<div style="width:800px; margin:auto;padding-top:100px;">
<h1>Country,State,City dynamic dependent dropdown</h1>
<form>
        <label>Select Country</label>
        <select id="country" name="country"onChange="load_options(this.value,'state');">
            <option value="">Select country</option>
        </select>
        &nbsp;&nbsp;&nbsp;
        <label>Select State</label>
        <select id="state" name="state" onChange="load_options(this.value,'city');">
            <option value="">Select state</option>
        </select>
        &nbsp;&nbsp;&nbsp;
        <label>Select city</label>
        <select id="city" name="city">
            <option value="">Select City</option>
        </select>
        <img src="loader.gif" id="loading" align="absmiddle" style="display:none;"/>
</form>
</div>
</body>
</html>

PHP代码保存在以下给出的ajax.php文件中：

<?php

class AJAX {

    private $database = NULL;
    private $_query = NULL;
    private $_fields = array();
    public  $_index = NULL;
    const DB_HOST = "localhost";
    const DB_USER = "root";
    const DB_PASSWORD = "";
    const DB_NAME = "2";


    public function __construct(){
        $this->db_connect();                    // Initiate Database connection
        $this->process_data();
    }

    /*
     *  Connect to database
    */
    private function db_connect(){
        $this->database = mysql_connect(self::DB_HOST,self::DB_USER,self::DB_PASSWORD);
        if($this->database){
            $db =  mysql_select_db(self::DB_NAME,$this->database);
        } else {
            echo mysql_error();die;
        }
    }



    private function process_data(){
        $this->_index = ($_REQUEST['index'])?$_REQUEST['index']:NULL;
        $id = ($_REQUEST['id'])?$_REQUEST['id']:NULL;
        switch($this->_index){
            case 'country':
                $this->_query = "SELECT id,country_name FROM globe";
                $this->_fields = array('id','country_name');
                break;
            case 'state':
                $this->_query = "SELECT id,state_name FROM globe WHERE id=$id";
                $this->_fields = array('id','state_name');
                break;
            case 'city':
                $this->_query = "SELECT id,city_name FROM globe WHERE id=$id";
                $this->_fields = array('id','city_name');
                break;
            default:
                break;
        }
        $this->show_result();
    }

    public function show_result(){
        echo '<option value="">Select '.$this->_index.'</option>';
        $query = mysql_query($this->_query);
        while($result = mysql_fetch_array($query)){
            $entity_id = $result[$this->_fields[0]];
            $enity_name = $result[$this->_fields[1]];
            echo "<option value='$entity_id'>$enity_name</option>";
        }
    }
}

$obj = new AJAX;

    ?>

Answer 1

您的查询都错了。对于国家/地区，如果您有不同的城市，则会多次列出同一个国家/地区。对于州和城市而言，您只需返回与所选国家或州相同ID的城市，您必须获得所有这些城市。

private function process_data(){
    $this->_index = ($_REQUEST['index'])?$_REQUEST['index']:NULL;
    $id = ($_REQUEST['id'])? (int)$_REQUEST['id']:NULL;
    switch($this->_index){
        case 'country':
            $this->_query = "SELECT id,country_name 
                             FROM globe 
                             GROUP BY country_name";
            $this->_fields = array('id','country_name');
            break;
        case 'state':
            $this->_query = "SELECT g1.id, g1.state_name 
                             FROM globe AS g1
                             JOIN globe AS g2 USING (country_name)
                             WHERE g2.id = $id
                             GROUP BY g1.state_name";
            $this->_fields = array('id','state_name');
            break;
        case 'city':
            $this->_query = "SELECT g1.id, g1.city_name
                             FROM globe AS g1
                             JOIN globe AS g2 USING (country_name, state_name)
                             WHERE g2.id = $id";
            $this->_fields = array('id','city_name');
            break;
        default:
            break;
    }
    $this->show_result();
}

需要帮助来修复PHP Ajax Jquery Sql Dynamic下拉列表

1 个答案: