[code="java"]<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
Insert title here Ext.onReady(function() { Ext.BLANK_IMAGE_URL = '/ExtDemo/images/s.gif'; var root = new Ext.tree.TreeNode({ id:"root", text:"树的根" }); var c1 = new Ext.tree.TreeNode({ id:"c1", url:"/ExtDemo/demo/table.jsp", //hrefTarget:"_blank", text:"子节点1" }) var c2 = new Ext.tree.TreeNode({ id:"c2", url:"/ExtDemo/demo/tree.jsp", //hrefTarget:"_blank", text:"子节点2" }) root.appendChild(c2); root.appendChild(c1); var tree = new Ext.tree.TreePanel({ [color=red]renderTo:"hello",[/color] root:root, enableDD : true, width:200 }); // tree.on("click",function(node,event) { // Ext.MessageBox.alert("提示","您点击了--"+node.id); // }); tree.on('click', function(node) { //当我点击某个节点的时候会出发这个事件 if (node.attributes.url != null) { //拆分节点的id,判断是否为二级节点 addtab(node.id, node.attributes.url, node.text); //调用上面对应的方法 } }); });
[/code]
我想问下在上面的代码中renderTo:"hello",这里可以用其他的代码代替吗,我不想指定div,也就是不行用renderTo:"hello",和
而直接显示在页面可以么?
多学点例子,有时间看看底层实现就明白了,学自己写一些组件,这个对学习ext有很大的帮助。我没怎么看过书,有一本书我翻了几眼觉得写的很好,《深入浅出ExtJS》-----徐会生 康爱媛、何启伟 著。应该会对你学习Ext有所帮助。
1、首先ext的页面渲染到dom节点上你可以自己控制,只要是已存在的节点都可以渲染,也就是说你可以让你的panel使用renderTo方式渲染到任何一个已存在的dom节点上。
2、若你不想使用renderTo,那么你需要为你的panel找到一个父容器,将panel加入到父容器中,让panel显示到父容器所在的区域,其实质也是渲染到父容器所在的dom节点内。
3、你现在要显示你的panel要么你有一个已知的父容器(Ext的Container或其子类的对象)来添加你的panel,要么有一个dom节点来使用renderTo方法。
4、补充,如果这个panel是你Ext架构层的顶级容器的话,那么你肯定是要使用renderTo的。
希望能对你有所帮助。
楼上说的对,
你是一个TreePanel.
如果不想render渲染.就需要有一个父容器.
比如说Viewport
将TreePanel加入到Viewport的items中.
Viewport是一个顶级容器不用渲染,你看看api应该就会用了。
方式1:继续使用加载jsp的方式的话,修改jsp文件,去掉jsp文件中的head、body、html等标签。这样加载回来的东西就可以看做是一个“innnerHtml”语句放到panel的html属性中(不知道这个比喻是否确切,实在难以描述我想表达的意思,总是不要带有body等标签就可以了)。
[code="java"]<%@ page language="java" pageEncoding="UTF-8"%>
<%@ include file="/common/taglibs.jsp"%>
<%
response.setHeader("progma","no-cache");
response.setHeader("Cache-Control","no-cache");
%>
Ext.onReady(function() { Ext.BLANK_IMAGE_URL = '/ExtDemo/images/s.gif'; var root = new Ext.tree.TreeNode({ id:"root", text:"树的根" }); var c1 = new Ext.tree.TreeNode({ id:"c1", url:"/ExtDemo/demo/table.jsp", //hrefTarget:"_blank", text:"子节点1" }) var c2 = new Ext.tree.TreeNode({ id:"c2", url:"/ExtDemo/demo/tree.jsp", //hrefTarget:"_blank", text:"子节点2" }) root.appendChild(c2); root.appendChild(c1); var tree = new Ext.tree.TreePanel({ [color=red]renderTo:"hello",[/color] root:root, enableDD : true, width:200 }); // tree.on("click",function(node,event) { // Ext.MessageBox.alert("提示","您点击了--"+node.id); // }); tree.on('click', function(node) { //当我点击某个节点的时候会出发这个事件 if (node.attributes.url != null) { //拆分节点的id,判断是否为二级节点 addtab(node.id, node.attributes.url, node.text); //调用上面对应的方法 } }); });
renderTo:document.body, 8)