ExtJs 3.1 XmlTreeLoader Example Error
程序员文章站
2022-03-07 11:20:54
前言 关键字:extjs 3.1 xmltreeloader example error,xmltreeloader 错误,treepanel error
extj...
前言
关键字:extjs 3.1 xmltreeloader example error,xmltreeloader 错误,treepanel error
extjs 3.1的xmltreeloader例子折腾了我近一个下午加晚上,官方的没有问题,可以加载xml的数据,本地iis死活不行,也不报错,直接查看官方的代码也是一模一样的,今早意外给让我搜到了,不是在官方,而是在貌似一个韩国的博客里面找到的,致敬一下,本文且做其简单中文"译"本。
原文
http://javarush.com/entry/extjs-xmltreeloader-error
正文
1. 代码位置:ext3.1\examples\tree\xml-tree-loader.js
2. 注意标红新增代码",requestmethod: 'get'"!!
复制代码 代码如下:
/*!
* ext js library 3.1.0
* copyright(c) 2006-2009 ext js, llc
* licensing@extjs.com
* http://www.extjs.com/license
*/
//
// extend the xmltreeloader to set some custom treenode attributes specific to our application:
//
ext.app.bookloader = ext.extend(ext.ux.tree.xmltreeloader, {
processattributes : function(attr){
if(attr.first){ // is it an author node?
// set the node text that will show in the tree since our raw data does not include a text attribute:
attr.text = attr.first + ' ' + attr.last;
// author icon, using the gender flag to choose a specific icon:
attr.iconcls = 'author-' + attr.gender;
// override these values for our folder nodes because we are loading all data at once. if we were
// loading each node asynchronously (the default) we would not want to do this:
attr.loaded = true;
attr.expanded = true;
}
else if(attr.title){ // is it a book node?
// set the node text that will show in the tree since our raw data does not include a text attribute:
attr.text = attr.title + ' (' + attr.published + ')';
// book icon:
attr.iconcls = 'book';
// tell the tree this is a leaf node. this could also be passed as an attribute in the original xml,
// but this example demonstrates that you can control this even when you cannot dictate the format of
// the incoming source xml:
attr.leaf = true;
}
}
});
ext.onready(function(){
var detailstext = '<i>select a book to see more information...</i>';
var tpl = new ext.template(
'<h2 class="title">{title}</h2>',
'<p><b>published</b>: {published}</p>',
'<p><b>synopsis</b>: {innertext}</p>',
'<p><a href="{url}" target="_blank">purchase from amazon</a></p>'
);
tpl.compile();
new ext.panel({
title: 'reading list',
renderto: 'tree',
layout: 'border',
width: 500,
height: 500,
items: [{
xtype: 'treepanel',
id: 'tree-panel',
region: 'center',
margins: '2 2 0 2',
autoscroll: true,
rootvisible: false,
root: new ext.tree.asynctreenode(),
// our custom treeloader:
loader: new ext.app.bookloader({
dataurl:'xml-tree-data.xml'
,requestmethod: 'get'
}),
listeners: {
'render': function(tp){
tp.getselectionmodel().on('selectionchange', function(tree, node){
var el = ext.getcmp('details-panel').body;
if(node && node.leaf){
tpl.overwrite(el, node.attributes);
}else{
el.update(detailstext);
}
})
}
}
},{
region: 'south',
title: 'book details',
id: 'details-panel',
autoscroll: true,
collapsible: true,
split: true,
margins: '0 2 2 2',
cmargins: '2 2 2 2',
height: 220,
html: detailstext
}]
});
});
结束语
不要放弃和接受一次失败的搜索,不断的尝试改变搜索关键字,哪怕是用词霸翻成英文也得努力去试试,看不懂不要紧,看懂代码就行,代码无国界: )