title: Ajax drop down for Country State & City in Codeigniter?
body: <p>I am making country state and city drop down with the help of ajax in our codeigniter frame work .</p>
  
  <p>The structure of database given bellow.</p>
  
  <p><strong>Country</strong></p>
  
  <pre><code>country_id,country_name
  </code></pre>
  
  <p><strong>State</strong></p>
  
  <pre><code>country_id,state_id,state_name
  </code></pre>
  
  <p><strong>city</strong></p>
  
  <pre><code>country_id,state_id,city_id,city_name
  </code></pre>
  
  <p><strong>user controler</strong></p>
  
  <pre><code>function country(){
   $data['header']='Deal Management';
   $data['page'] = 'admin/page/user-view';
   $data['Country'] = $this-&gt;deal-&gt;getCountry(); 
   $this-&gt;load-&gt;view($this-&gt;_admin_container,$data);  
  }
  
  function get_cities($Country){
    $this-&gt;load-&gt;model('city_model');
    header('Content-Type: application/x-json; charset=utf-8');
    echo(json_encode($this-&gt;cities_model-&gt;get_cities($dealCountry)));
  }
  </code></pre>
  
  <p><strong>user-view View</strong></p>
  
  <pre><code>&lt;?php $cities['#'] = 'Please Select'; ?&gt;
  
  &lt;label for="country"&gt;Country: &lt;/label&gt;&lt;?php echo form_dropdown('country_id', $Country, '#', 'id="country"'); ?&gt;&lt;br /&gt;
  
  &lt;label for="city"&gt;City: &lt;/label&gt;&lt;?php echo form_dropdown('city_id', $cities, '#', 'id="cities"'); ?&gt;&lt;br /&gt;
  </code></pre>
  
  <p><strong>deal module country_modle</strong></p>
  
  <pre><code> function getCountry(){
      $this-&gt;db-&gt;select("*");
      $query=$this-&gt;db-&gt;get("deal_country");
      $countries = array();
      if($query-&gt;result()){
            foreach ($query-&gt;result() as $country) {
                $countries[$country-&gt;country_id] = $country-&gt;country_name;
            }
          return $countries;
          }else{
          return FALSE;
          }
      }
  </code></pre>
  
  <p><strong>city_model Module</strong></p>
  
  <pre><code>function get_cities($dealCountry = null){
          echo $dealCountry;die;
        $this-&gt;db-&gt;select('city_id, city_name');
  
        if($dealCountry != NULL){
            $this-&gt;db-&gt;where('country_id', $dealCountry);
        }
  
        $query = $this-&gt;db-&gt;get('deal_city');
  
        $cities = array();
  
        if($query-&gt;result()){
            foreach ($query-&gt;result() as $city) {
                $cities[$city-&gt;id] = $city-&gt;city_name;
            }
        return $cities;
        }else{
            return FALSE;
        }
  }
  </code></pre>
  
  <p><strong>I include ajax script in header file.</strong></p>
  
  <pre><code>&lt;script type="text/javascript"&gt;// &lt;![CDATA[
      $(document).ready(function(){
          $('#country').change(function(){ //any select change on the dropdown with id country trigger this code
          $("#cities &gt; 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: "home/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(city_id,city) //here we're doing a foeach loop round each city with id as the key and city as the value
                      {
                          var opt = $('&lt;option /&gt;'); // 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'
                      });
                  }
  
              });
  
          });
      });
      // ]]&gt;
  &lt;/script&gt;
  </code></pre>
  
  <p>After making code its not working .</p>
  
  <p>Any help is appreciated!</p>
  
  <p>Thanks </p>