Codeigniter Ajax下拉列表

时间:2013-08-24 09:34:14

标签: ajax codeigniter

控制器(user.php的)

<?php

class User extends CI_Controller {

    public function __construct() {
        parent::__construct();
        $this->load->model('country_model');
    }

    public function index() {
        $this->load->view('register');
    }

    public function register() {
        $data['countries'] = $this->country_model->get_countries();
        $this->load->view('post_view', $data);
    }

    public function get_cities($country) {
        $this->load->model('city_model');
        header('Content-Type: application/x-json; charset=utf-8');
        echo(json_encode($this->city_model->get_cities($country)));
    }

}

City_model

<?php

class City_model extends CI_Model {

    public function __construct() {
        $this->load->database();
    }

    function get_cities($country = null) {
        $this->db->select('id, city_name');

        if ($country != NULL) {
            $this->db->where('country_id', $country);
        }

        $query = $this->db->get('cities');
        $cities = array();

        if ($query->result()) {
            foreach ($query->result() as $city) {
                $cities[$city->id] = $city->city_name;
            }
            return $cities;
        } else {
            return FALSE;
        }
    }

}
?>

country_model

<?php

class Country_model extends CI_Model {

    public function __construct() {
        $this->load->database();
    }

    function get_countries() {
        $this->db->select('id, country_name');
        $query = $this->db->get('countries');
        echo "countries";
        $countries = array();

        if ($query->result()) {
            foreach ($query->result() as $country) {
                $countries[$country->id] = $country->country_name;
            }
            return $countries;
        } else {
            return FALSE;
        }
    }

}
?>

查看文件

<html>

    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
        <script type="text/javascript">// <![CDATA[
            $(document).ready(function() {
                $('#country').change(function() { //any select change on the dropdown with id country trigger this code
                    $("#cities > option").remove(); //first of all clear select items
                    var country_id = $('#country').val(); // here we are taking country id of the selected one.
                    $.ajax({
                        type: "POST",
                        url: "http://localhost/task/user/get_cities/" + country_id, //here we are calling our user controller and get_cities method with the country_id

                        success: function(cities) //we're calling the response json array 'cities'
                        {
                            $.each(cities, function(id, city) //here we're doing a foeach loop round each city with id as the key and city as the value
                            {
                                var opt = $('<option />'); // here we're creating a new select option with for each city
                                opt.val(id);
                                opt.text(city);
                                $('#cities').append(opt); //here we will append these new select options to a dropdown with the id 'cities'
                            });
                        }

                    });

                });
            });
            // ]]>
        </script>
    </head>
    <body>
        <?php $countries['#'] = 'Please Select'; ?>

        <label for="country">Country: </label><?php echo form_dropdown('country_id', $countries, '#', 'id="country"'); ?><br />
        <?php $cities['#'] = 'Please Select'; ?>
        <label for="city">City: </label><?php echo form_dropdown('city_id', $cities, '#', 'id="cities"'); ?><br />
    </body>
</html>

我正在尝试使用codeigniter ajax下拉列表来填充数据库中的数据。我无法从数据库中获取值。当我从下拉列表中选择一个国家名称时,应该触发城市名称。我不知道我错在哪里。任何帮助都是值得赞赏的。

2 个答案:

答案 0 :(得分:2)

试试这个:

 public function get_cities($country)
            {
                $this->load->model('city_model');

                $result = $this->city_model->get_cities($country);

                $this->output->set_output(json_encode($result));
            }

    }

答案 1 :(得分:1)

public function get_cities($country) {
        $this->load->model('city_model');
         $this->output->set_content_type('application/json');
        $this->output->set_status_header(200);
        $this->output->set_output(
            json_encode(
                $this->city_model->get_cities($country)
            )
        );
    }

将此代码用于json回复