easyui combobox级联

easyui combobox省市县的级联案例

javascript:

 

01	$(function(){

02	var province = $('#province').combobox({

03	valueField:'areaid',

04	textField:'name',

05	editable:false,

06	url:'cascade-data.php',

07	onChange:function(newValue, oldValue){

08	$.get('cascade-data.php',{parentid:newValue},function(data){

09	city.combobox("clear").combobox('loadData',data);

10	county.combobox("clear")

11	},'json');

12

}

13

});

14

15	var city = $('#city').combobox({

16	valueField:'areaid',

17	textField:'name',

18	editable:false,

19	onChange:function(newValue, oldValue){

20	$.get('cascade-data.php',{parentid:newValue},function(data){

21	county.combobox("clear").combobox('loadData',data);

22	},'json');

23

}

24

});

25

26	var county = $('#county').combobox({

27	valueField:'areaid',

28	textField:'name',

29	editable:false

30

});

31

});

 后台代码PHP：

1

<?php

2	$parentid = isset($_GET['parentid']) ? $_GET['parentid'] : 0;

3	$mysql = new SaeMysql();

4	$sql = "SELECT * FROM `area` where parentid=$parentid order by vieworder";

5	$data = $mysql->getData( $sql );

6	echo json_encode($data);

 

鉴于有人提到要初始化就选中第一个：

那么你可以给combobox都加上onLoadSuccess:onLoadSuccess,onLoadSuccess方法内容如下：

1	function onLoadSuccess(){

2	var target = $(this);

3	var data = target.combobox("getData");

4	var options = target.combobox("options");

5	if(data && data.length>0){

6	var fs = data[0];

7	target.combobox("setValue",fs[options.valueField]);

8

}

9

}

 

区县sql数据：

area.zip