使用codeigniter jquery填充下拉列表

时间:2014-04-13 01:30:55

标签: php jquery codeigniter

我有这个从数据库填充的下拉列表。状态填充正常,但是城市里面会返回html。

查看..

        <?php $this->load->view('header.php'); ?>

        <?php echo form_open('control_form/add_all'); ?>
        <label for="f_state">State<span class="red">*</span></label>
        <select id="f_state" name="f_state">
            <option value=""></option>
            <?php
            foreach($states as $state) {
     echo '<option value="' . $state->id . '">' . $state->statename .  '</option>';
            }
            ?>
        </select>
        <label for="f_city">City<span class="red">*</span></label>
        <!--this will be filled based on the tree selection above-->
        <select id="f_city" name="f_city" id="f_city_label">
            <option value=""></option>
        </select>
        <label for="f_membername">Member Name<span class="red">*</span></label>
        <!--<input type="text" name="f_membername"/>-->
        <?php echo form_close(); ?>


        <script type="text/javascript">

            $('#f_city, #f_city_label').hide();
            $('#f_state').change(function(){
                var state_id = $('#f_state').val();
                if (state_id != ""){
                    var post_url = "/index.php/control_form/get_cities/" + state_id;
                    $.ajax({
                        type: "POST",
                        url: post_url,
           success: function(cities) //we're calling the response json array 'cities'
                        {
                            $('#f_city').empty();
                            $('#f_city, #f_city_label').show();
                            $.each(cities,function(id,city)
                            {
   var opt = $('<option />'); // here we're creating a new select option for each group
                                opt.val(id);
                                opt.text(city);
                                $('#f_city').append(opt);
                            });
                        } //end success
                    }); //end AJAX
                } else {
                    $('#f_city').empty();
                    $('#f_city, #f_city_label').hide();
                }//end if
            }); //end change

        </script>

...模型

    class Model_form extends CI_Model {
        function __construct() {
            // Call the Model constructor
            parent::__construct();
        }

        function get_state() {
            $query = $this->db->query('SELECT id, statename FROM state');
            return $query->result();
        }





        function get_cities_by_state ($state) {
            $this->db->select('id, city');
            $this->db->where('stateid', $state);
            $query = $this->db->get('cityy');
            $cities = array();

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

控制器

    Class Control_form extends CI_controller
    {
       function add_all(){
            $this->load->library('form_validation');
            #Validate entry form information
            $this->load->model('Model_form','', TRUE);
            $this->form_validation->set_rules('f_state', 'State', 'required');
            $this->form_validation->set_rules('f_city', 'City', 'required');
            $this->form_validation->set_rules('f_membername', 'Member Name', 'required');

            $data['states'] = $this->Model_form->get_state(); //gets the available groups for the dropdown

            if ($this->form_validation->run() == FALSE)
            {
                  $this->load->view('view_form_all', $data);
            }
            else
            {
                #Add Member to Database
                $this->Model_form->add_all();
                $this->load->view('view_form_success');
            }
        }

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

    }

2 个答案:

答案 0 :(得分:0)

以下代码不正确:

opt.val(id);

这纯粹用于retrieve id,而不是设置它。试试这个:

opt.attr('id', id);

这可能是问题的一部分,如果不是全部的话。

答案 1 :(得分:0)

试试这个:

更改

     function get_cities_by_state ($state)

    function get_cities_by_state($state = null){

     $this->db->select('id, city');

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

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

     $cities = array();

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

将base_url()添加到url:

   url: "<?php echo site_url(); ?>control_form/get_cities/"+state_id,

确保在标题中包含jquery库

 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>