Codeigniter Ajax dropdown

Codeigniter Ajax dropdown


Codeigniter ajax dropdown Codeigniter Framework Lot of task previously discussed. Today discussed Codeigniter dropdown ajax how to implemented. Similarly Codeigniter ajax Pagination  
Codeigniter Ajax dropdown
Codeigniter Ajax dropdown

Dropdown City and Country Used Ajax


Controller
<?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;
        }
    }

}
?>

View
   <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 dropdown Dev2Tricks 5 of 5
Codeigniter Ajax dropdown Codeigniter ajax dropdown Codeigniter Framework Lot of task previously discussed. Today discussed Codeignite...

Share this

Related Posts

Previous
Next Post »