H5W3
当前位置:H5W3 > 其他技术问题 > 正文

WebLogic树形结构的实现

一、序

本文是使用WebLogic的自带控件,如果对其比较陌生可以察看E:\bea\weblogic81\samples\workshop\SamplesApp\WebApp\tagSamples\netui\treeE:\bea\weblogic81\samples\workshop\SamplesApp\WebApp\tagSamples\netui\tree_dynamicWebLogic自带的两个例子。

关于静态的树形结构相对简单,不在这里详细说明。

二、自定义的树形结构

1.环境目录———————————

Test\TestWeb\index.jsp   Test为应用程序名,TestWeb为Web名

2.创建页面流———————————

在TestWeb下新建页面流tree。系统会自动生成以下文件,文件夹:Test\TestWeb\treeTest\TestWeb\tree\index.jspTest\TestWeb\tree\TreeController.jpf

3.准备TreeView相关页面文件———————————

这里使用frame框架进行演示,左边显示树形结点,右边显示对应内容。所以还要建立两个文件。tree.jsp作为树形结点页面,content.jsp作为内容页面。Test\TestWeb\tree\tree.jspTest\TestWeb\tree\content.jsp

我们把index.jsp就作为框架容器。代码如下:<netui:html>    <head>        <title>            Web Frame        </title>    </head>    <frameset cols=”20%,*”>        <frame src=”tree.jsp” name=”fraTree” >        <frame src=”content.jsp” name=”fraContent” >    </frameset></netui:html>4.编辑页面流文件TreeController.jpf———————————

tree.jsp,content.jsp内容我们暂时不管,先编辑TreeController.jpf页面流文件,全代码如下:

package tree;/** * @jpf:controller * @jpf:view-properties view-properties:: * <!– 此数据是自动生成的。 不推荐手工编辑此区域。 –> * <view-properties> * <pageflow-object id=”pageflow:/tree/TreeController.jpf”/> * <pageflow-object id=”action:treeState.do”> *   <property value=”180″ name=”x”/> *   <property value=”40″ name=”y”/> * </pageflow-object> * <pageflow-object id=”action:begin.do”> *   <property value=”80″ name=”x”/> *   <property value=”100″ name=”y”/> * </pageflow-object> * <pageflow-object id=”action-call:@page:tree.jsp@#@action:treeState.do@”> *   <property value=”96,120,120,144″ name=”elbowsX”/> *   <property value=”31,31,31,31″ name=”elbowsY”/> *   <property value=”East_1″ name=”fromPort”/> *   <property value=”West_1″ name=”toPort”/> * </pageflow-object> * <pageflow-object id=”page:tree.jsp”> *   <property value=”60″ name=”x”/> *   <property value=”40″ name=”y”/> * </pageflow-object> * <pageflow-object id=”page:index.jsp”> *   <property value=”240″ name=”x”/> *   <property value=”100″ name=”y”/> * </pageflow-object> * <pageflow-object id=”page:content.jsp”> *   <property value=”120″ name=”x”/> *   <property value=”100″ name=”y”/> * </pageflow-object> * <pageflow-object id=”forward:path#tree#tree.jsp#@action:treeState.do@”> *   <property value=”144,120,120,96″ name=”elbowsX”/> *   <property value=”31,31,31,31″ name=”elbowsY”/> *   <property value=”West_1″ name=”fromPort”/> *   <property value=”East_1″ name=”toPort”/> *   <property value=”tree” name=”label”/> * </pageflow-object> * <pageflow-object id=”forward:path#success#index.jsp#@action:begin.do@”> *   <property value=”116,160,160,204″ name=”elbowsX”/> *   <property value=”91,91,91,91″ name=”elbowsY”/> *   <property value=”East_1″ name=”fromPort”/> *   <property value=”West_1″ name=”toPort”/> *   <property value=”success” name=”label”/> * </pageflow-object> * </view-properties> * :: */

//以上一堆注释代码,不必理会

public class TreeController extends  com.bea.wlw.netui.pageflow.PageFlowController{    //定义树形根结点    public com.bea.wlw.netui.tags.html.TreeNode liweinode = null;        //页面流加载时运行代码    public void onCreate() throws Exception    {        int i=10;                //实例化树形结点        //第一个参数:结点图标        //第二个参数:结点标签        //第三个参数:一般为null,具体还没搞懂        //第四个参数:结点的点击动作        //第五个参数:作用的页面,即在index.jsp定义的内容框架名fraContent        //第六个参数:展开还是合并        liweinode=new com.bea.wlw.netui.tags.html.TreeNode(         “folder_closed.gif”,                 “root”,                 null,                 “content.jsp”,                 “fraContent”,                 true);           com.bea.wlw.netui.tags.html.TreeNode treenode[]=new com.bea.wlw.netui.tags.html.TreeNode[i];        for(i=0;i<10;i++)        {        treenode[i] = new com.bea.wlw.netui.tags.html.TreeNode(                “folder_closed.gif”,                “test”+i,                 null,                 “content.jsp?sendvalue=”+i,                 “fraContent”,                 true);                 liweinode.addChild(treenode[i]);         }                    }         /**     * Handles the state of the tree when a a link is clicked.     *      * @jpf:action     * @jpf:forward name=”tree” path=”tree.jsp”     */        //点击结点结的动作处理,要 <NETUI:TREE中的ACTION一致。    public com.bea.wlw.netui.pageflow.Forward treeState()    {        String nodeSel = null;        String nodeExpanded = null;             nodeSel = getRequest().getParameter(com.bea.wlw.netui.tags.html.TreeNode.SELECTED_NODE);        nodeExpanded = getRequest().getParameter(com.bea.wlw.netui.tags.html.TreeNode.EXPAND_NODE);

        if (nodeExpanded != null)        {

            com.bea.wlw.netui.tags.html.TreeNode node = liweinode.findNode(nodeExpanded);            if (node != null)            {                node.setExpanded(!node.isExpanded());            }            return new com.bea.wlw.netui.pageflow.Forward(“tree”);        }

        return new com.bea.wlw.netui.pageflow.Forward(nodeSel);    }        /**     * 此方法代表进入页面流的入口     * @jpf:action     * @jpf:forward name=”success” path=”index.jsp”     */    protected com.bea.wlw.netui.pageflow.Forward begin()    {        return new com.bea.wlw.netui.pageflow.Forward(“success”);    }}

5.编辑页面tree.jsp,content.jsp———————————

tree.jsp内容如下,tree对应上面定义的public liweinode,格式必须如此。action即为上面定义的public com.bea.wlw.netui.pageflow.Forward treeState()方法。content.jsp内容如下:

  <body>    <netui:tree tree=”{pageFlow.liweinode}” action=”treeState”></netui:tree>  </body>  content.jsp内容如下:

  <body>      <p>          <%=request.getParameter(“sendvalue”)%>      </p>  </body>6.运行———————————

运行会发现左边树形结构是一堆红x,不过点击对应结点,功能倒是没问题。不要紧,下面就解决红x的问题。这是由于中未指定imageRoot。

将E:\bea\weblogic81\samples\workshop\SamplesApp\WebApp\tagSamples\netui\tree下treeImages复制到Test\TestWeb\tree下。并修改tree.jsp。这时

再运行会发现一切OK,不会很快就会感觉到那些图片实在是太难看了。我这里用的是.net的图片,下载的WebControl里面有。把这些好的图片复制到treeImages下,更改代码为:

运行一切OK!

三、从Xml文件中获取树形结构

E:\bea\weblogic81\samples\workshop\SamplesApp\WebApp\tagSamples\netui\tree_dynamic这个例子就是,有了自定义树形的详细解释,应用也不成问题。

本文地址:H5W3 » WebLogic树形结构的实现

评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址