ci框架下的省市区三级联动

前端之家收集整理的这篇文章主要介绍了ci框架下的省市区三级联动前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

代码。这个直接拿过来就能用。

视图

<?PHP
		 	$data['province_selected'] = $address['province_id'];
			$data['city_selected'] = $address['city_id'];
			$data['district_selected'] = $address['district_id'];
            $this->load->view('district_select',$data); 
  ?>
<?PHP
$CI = get_instance();
$CI->load->model('region_model','region');
$provinces   = $CI->region->provinces();
$citys = $CI->region->children_of($province_selected);
?>
<script  language="JavaScript">
 

<?PHP if(isset($province_selected)):?>
var province_selected = <?PHP echo (int)$province_selected?>;
<?PHP else:?>
var province_selected = 0;
<?PHP endif?>

<?PHP if(isset($city_selected)):?>
var city_selected = <?PHP echo (int)$city_selected?>;
<?PHP else:?>
var city_selected = 0;
<?PHP endif?>

<?PHP if(isset($district_selected)):?>
var district_selected = <?PHP echo (int)$district_selected?>;
<?PHP else:?>
var district_selected = 0;
<?PHP endif?>

$(document).ready(function() {

  var change_city = function(){
	$.ajax({
	  url: '<?PHP echo  ITURL.'/admin.PHP/region_change/select_children/parent_id'// site_url('region_change/select_children/parent_id')?>'+'/'+$('#province_id').val(),type: 'GET',dataType: 'html',success: function(data){
		city_json = eval('('+data+')');
		var city = document.getElementById('city_id');
		city.options.length = 0;
		city.options[0] = new Option('城市','-11');
		for(var i=0; i<city_json.length; i++){
            var len = city.length;
			city.options[len] = new Option(city_json[i].region_name,city_json[i].region_id); 
			if (city.options[len].value == city_selected){
				city.options[len].selected = true;
			}
		}
		change_district();//重置地区
	  }
	});
  }

  change_city();//初始化城市

  $('#province_id').change(function(){
     change_city();
  });


  var change_district = function(){
	$.ajax({
	  url: '<?PHP echo  ITURL.'/admin.PHP/region_change/select_children/parent_id'//site_url('region_change/select_children/parent_id')?>'+'/'+$('#city_id').val(),success: function(data){
        district_json = eval('('+data+')');
		var district = document.getElementById('district_id');
		district.options.length = 0;
		district.options[0] = new Option('县/区','-22');
		for(var i=0; i<district_json.length; i++){
            var len = district.length;
			district.options[len] = new Option(district_json[i].region_name,district_json[i].region_id); 
			if (district.options[len].value == district_selected){
				district.options[len].selected = true;
			}
		}
	  }
	});
  }

  $('#city_id').change(function(){
     change_district();
  });
  


});

 
</script>
<select name="province_id" id="province_id"  style="width:100px;">
    <option value="-1" >省份</option>
	<?PHP foreach($provinces as $key => $province): ?>
	<option value="<?PHP echo $province['region_id']; ?>" <?PHP if($province['region_id']==$province_selected){echo 'selected';}?> ><?PHP echo $province['region_name']; ?></option>
	<?PHP endforeach; ?>

</select>

<select name="city_id" id="city_id"  style="width:100px;">
    
</select>

<select name="district_id" id="district_id" style="width:100px;">
    <option value=""></option>
</select>

模型

<?PHP
/**
 * 省市县
 *
 *
 */
class Region_Model extends CI_Model
{
    /**
     * 
     *
     * @return Region_Model
     */
    function Region_Model()
    {
        parent::__construct();
    }
    
	// --------------------------------------------------------------------

    /**
     * 
     *
     * @param integer $parent_id
     */
    function children_of($parent_id,$select="*")
    {
        $parent_id = (int)$parent_id;
        
        $regions = array();
        $this->db->select($select);
        $this->db->where('parent_id',$parent_id);
        if ($query = $this->db->get('region')){
            return $query->result_array(); 
		}
		return array();       
    }

    // --------------------------------------------------------------------

	/**
     * 
     *
     * @return array
     */
    function provinces()
    {
        return $this->children_of(1);
    }

    // --------------------------------------------------------------------

    /**
	 * 区域名
	 *
	 *
	 */	
    function get_name($id)
	{
		if (!$id){
            return array();
        }
		$this->db->select('region_name');
        $query = $this->db->get_where('region',array('region_id' => $id));

        if ($row = $query->row_array()){
            return $row['region_name'];
        }
		return array();
	}

   // --------------------------------------------------------------------

    /**
	 * load by id
	 *
	 *
	 */	
	function load($id)
	{
        if (!$id){
            return array();
        }
        $query = $this->db->get_where('region',array('region_id' => $id));
        if ($row = $query->row_array()){
            return $row;
        }
		return array();
	}

}

直接将视图粘贴到视图文件中就可以了,然后引入后面的文件。非常简单

原文链接:https://www.f2er.com/ajax/166832.html

猜你在找的Ajax相关文章