1. 程式人生 > >PHP+Ajax+Mysql聯合實現省市區三級聯動

PHP+Ajax+Mysql聯合實現省市區三級聯動

       1.mysql資料檔案匯入,該檔案會上傳到我的資源庫  dh_areas

      2.HTML

   <select  id="province" name="province" onchange="selcity(this.value,this.id)">
      <option value="">請選擇</option>
          <volist name="province" id="vo" >
      <option  value="{$vo.area_id}">{$vo.area_name}</option>
          </volist>
   </select>
   <select  id="city" name="city" onchange="selcity(this.value,this.id)">
      <option value="">請選擇</option>
   </select>
   <select  id="country" name="country">
      <option value="">請選擇</option>
   </select>
    3.ajax
var selcityUrl="__APP__/Home/RegisterInfo/getArea";
			function selcity(areaId,obgId){
				$.ajax({
					type:"post",
					url:selcityUrl,
					async:false,
					data:{
						"areaId":areaId
					},
					success:function(json){
						var json = eval('(' + json + ')');
						
						if(obgId=="province"){
							$("#city").empty();
						var optionObg="<option value=''>請選擇</option>";
						for (var i=0;i<json.count;i++) {
							optionObg+="<option value='"+json[i].area_id+"'>"+json[i].area_name+"</option>";
						}
						$("#city").append(optionObg);
						}else{
							$("#country").empty();
						var optionObg="<option value=''>請選擇</option>";
						for (var i=0;i<json.count;i++) {
							optionObg+="<option value='"+json[i].area_id+"'>"+json[i].area_name+"</option>";
						}
						$("#country").append(optionObg);
						}
						
					}
				});
			}
4.PHP

   (1)獲取省列表

  public function register(){
     	  //獲取省級地區
        $province=M('areas')->where(array('parent_id'=>1))->select();
        $this->assign('province',$province);
     	$this->display();
     }
   (2)獲取市/縣
public function getArea(){
        $where['parent_id']=I('areaId');
        $area=D('areas')->where($where)->select();
		$area['count']=count($area);
        $this->ajaxReturn($area,'json');
    }


相關推薦

PHP+Ajax+Mysql聯合實現省市區三級聯動

       1.mysql資料檔案匯入,該檔案會上傳到我的資源庫  dh_areas       2.HTML <select id="province" name="province" onchange="selcity(this.value,this.id

使用PHP+MySql+Ajax+jQuery實現省市區三級聯動功能

b- 發生 sel substr 要求 java true 選中 .ajax 使用PHP+MySql+Ajax+jQuery實現省市區三級聯動功能 要求:寫一個省市區(或者年月日)的三級聯動,實現地區或時間的下拉選擇。 實現技術:php ajax 實現:省級下拉變化時市下拉

javaweb--json--ajax--mysql實現省市區三級聯動(附三級聯動數據庫)

知識點 request test div 對數 能說 面向對象 inf HA 在web中,實現三級聯動很常見,尤其是利用jquery+json。但是從根本上來說jquery並不是最能讓人容易理解的,接下來從最基本的javascript開始,實現由javascript+jso

springmvc+ajax實現省市區三級聯動以及406 (Not Acceptable)的解決辦法

我做一個小的測試實現功能 最主要是說一下遇到的問題: 我先用的spring3.2的包但是遇到好多的問我問題, (1)首先就是不能使用*.htm,*.html的地址字尾; (2)這個會報406 (Not Acceptable)的錯誤: 辦法:1.你可以換成4.0的包,然後就能

JQuery+Ajax實現省市區三級聯動(附效果圖+資料庫)

一、效果圖 1、頁面載入後(初始化:北京市-北京市-東城區) 2、單擊選擇省份後(改變成:河北省-石家莊市-長安區) 二、jsp頁面 <!DOCTYPE html> <html> <head> <meta http-equiv

js實現省市區三級聯動

pre 聯動 準備 path div data- pic asc com 電商平臺或者一些網站的個人信息部分,通常會有填寫地址的功能。該功能一般分為二級聯動(省、市)和三級聯動(省、市、區),只需要JavaScript就可以實現。 這裏介紹一種很簡潔易用的方法。參考地址:h

WheelView實現省市區三級聯動(數據庫實現版本號附帶完整SQL及數據)

tdi delet avi ipp cte public lis 網上 count() 近期在實現收貨地址功能。用到了省市區三級聯動效果。網上找到一般都是xml或json,數據源陳舊改動麻煩,改動了一下使用數據庫方式實現了一下 數據源解決,因為數據量

收貨地址--實現省市區三級聯動和使用drf-extensions擴展使用緩存

onf area trie resp 圖集 lan 路由 iso 輸入 主要實現省市區三級聯動和在Django REST framework中使用緩存。 在用戶錄入地址時,需要進行省市區的選擇。在頁面加載時,向後端請求省份數據,當用戶選擇確定省份後,向後端請求該省份的城市數

vue結合android,mint中popup和picker實現省市區三級聯動

template: //觸發事件 <div :class="{borBm: borBm == 4}"> <span>通訊住址:</span> <span v-if="countyName && countyName

javascript利用selected屬性實現省市區三級聯動

javascript實現省市區三級聯動 原理是根據<select>選框下<option>的selected屬性來確定上一個值被選中,確定陣列下標,傳遞給下一個陣列作為迴圈結束

Android仿蘋果實現省市區三級聯動選擇

效果圖:    一、新增依賴dependencies { ····· implementation 'liji.library.dev:citypickerview:0.7.0' } 二、這裡就不在介紹佈局檔案了,直接演示實現程式碼: package c

Jquery.city-picker 實現省市區三級聯動

效果圖:如 安徽省、蕪湖市CSS程式碼 引用<!-- Bootstrap Stylesheet --> <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css" media="screen"

vue.js實現省市區三級聯動

<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>vue實現省市級三級聯動</title> <script src="vue.min.js"

Android 地址選擇器,實現省市區三級聯動

最近專案裡面用到了一個地址選擇器,實現現在主流的WheelView滑動選擇,整理了下,做了個Demo.廢話不多說,直接上程式碼: 主佈局: <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xml

運用小程式實現 省市區三級聯動

// wxml 部分程式碼如下<view class="list"> <view class='list-left'>地區:</view> <view bindtap='showPicker' class="list-right {{flag ? '' : 'pl

使用dropkick.js外掛實現省市區三級聯動效果

一、工作準備: 1、匯入jquery.js 2、匯入jquery.dropkick.js和dropkick.css(可以去官網下載最新的外掛) 3、匯入省市區的json資料(開發者自己json格式資料) 二、html程式碼部分: <select class="sele

用Vue、element-ui、axios實現省市區三級聯動

現在大部分電商的網站、app都需要使用者或者管理者去選擇設定地區等位置資訊。下面我就介紹一下前端開發者用vue,axios,element-ui開發一個省市區三級聯動的元件。 1.準備工作,首先我們需要全中國的省市區資源的json資料(科普一下:前六位數字是身份證前六位)

讀取本地json資料實現省市區三級聯動PickerView

這個功能在應用中還是用的比較多的,這裡我將之前的一個電商專案中使用到的省市區三級聯動選擇器的程式碼粘出來,需要的自取。實現UI如圖: 首先是省市區的json資料 專案目錄結構 使用程式碼 匯入jar包 co

Android實現省市區三級聯動效果Spinner

public class MainActivity extends AppCompatActivity { Spinner s_sheng; ArrayAdapter<String> adapter_sheng; ArrayAdapter<String> ada

實現省市區三級聯動

首先是js$(document).ready(function(){ getErpMarketByParentCode(0,'province',province); getErpMarketByParentCode(province,'city',city); ge