`

符合Ext tree的全国城市列表json格式

 
阅读更多

需要实现一个多级的中国城市选择树,在以下工程的基础上改进实现了一个:

http://ext-ux-form-combotree.googlecode.com/svn-history/r9/trunk/0.2/Ext.ux.TreeCombo.js

该控件存在两个问题,会导致在同一页面同时存在多个tree控件会产生混乱:

1.

 

id:Ext.id(),

 所有控件共用一个id?

挪到initComponent方法中建立就可以了。

 

2.root节点是传入的,如果外部调用者复用一个root,同样会导致问题。

  可以改进为在initComponent中增加一个自适应检查:

 

if(!this.root)
	this.root = new Ext.tree.AsyncTreeNode({  });

 

控件修改好之后,数据从哪里拿呢?

以下链接给出了中国城市街道列表的json格式,

http://www.1netmedia.cn/base/blogview.asp?logID=1214

感谢同行的工作,赞一个!

但该格式并不符合Ext.tree对数据格式的要求,要求如下形式:

 

[{
    "text": "北京市",
    "checked": false,
    "leaf": false,
    "children": [{
        "text": "东城区",
        "checked": false,
        "leaf": true
    }, {
        "text": "西城区",
        "checked": false,
        "leaf": true
    }

 

  好吧,写一个简单的函数转换形式,打印到浏览器控制台好了。

函数允许设置转换深度level,字符串化利用了浏览器的native JSON API (ECMAScript 3.1定义)

 

var level_limit = 2;
function tree(city,level){
	var obj = {text:city.t,checked:false,leaf:true};
	if(city.s){
		if(level<level_limit){
			obj.leaf=false;
			obj.children=treecitys(city.s,level+1);
		}
	}
	return obj;
}

function treecitys(citys,level){
	var obj=[];
	for(var i=0; i<citys.length; i++){
		obj[obj.length]=tree(citys[i],level);
	}
	return obj;
}
var tcs = treecitys(areaJson,1);
var str_tcs = JSON.stringify(tcs);
console.log(str_tcs);

 

 

1
0
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics