jsp怎么从mysql数据库把树形结构展现出来

jsp怎么从mysql数据库把树形结构展现出来,第1张

jsp从mysql数据库读取数据,并填充到树形结构菜单并展现出来的实现方法:

1、引入jquerytreeviewjs树控件

<script type="text/javascript" src="jquery/easyui/jqueryminjs"></script>

 <script type="text/javascript" src="jquery/easyui/jqueryeasyuiminjs"></script>

2、jsp页面中获取后台mysql数据,并传到jsp页面来

<% 

// 数据库的名字

String dbName = "zap";

// 登录数据库的用户名

String username = "sa";

// 登录数据库的密码

String password = "123";

// 数据库的IP地址,本机可以用 localhost 或者 127001

String host = "127001";

// 数据库的端口,一般不会修改,默认为1433

int port = 1433;

String connectionUrl = "jdbc:sqlserver://" + host + ":" + port + ";databaseName=" + dbName + ";user=" + username

+ ";password=" + password;

//

//声明需要使用的资源 

// 数据库连接,记得用完了一定要关闭

Connection con = null;

// Statement 记得用完了一定要关闭

Statement stmt = null;

// 结果集,记得用完了一定要关闭

ResultSet rs = null;

try {

// 注册驱动 

ClassforName("commicrosoftsqlserverjdbcSQLServerDriver");

// 获得一个数据库连接

con = DriverManagergetConnection(connectionUrl);

String SQL = "SELECT from note";

// 创建查询

stmt = concreateStatement();

// 执行查询,拿到结果集

rs = stmtexecuteQuery(SQL);

while (rsnext()) {

%>

<tr>

3、填充树形菜单:

{

 id          : "string" // will be autogenerated if omitted

 text        : "string" // node text

 icon        : "string" // string for custom

 state       : {

   opened    : boolean  // is the node open

   disabled  : boolean  // is the node disabled

   selected  : boolean  // is the node selected

 },

 children    : []  // array of strings or objects

 li_attr     : {}  // attributes for the generated LI node

 a_attr      : {}  // attributes for the generated A node

}

$('#tree')jstree({

   'core' : {

       'data' : function (obj, cb) {

           cbcall(this,

             ['Root 1', 'Root 2']);

       }

   }});

一个带有右键 *** 作的树形菜单

$(document)ready(function(){

    $ajaxSetup({cache:false});

    $("#browser")tree({

    data  : {

        type  : "json",

        url   : src,

        async : true,

        async_data : function (NODE) {

                                        return { parent_Id : $(NODE)attr("id") || 0}

                                     }

      },

      lang:{

           loading:"目录加载中……"

            },

      rules:

      {

      draggable   : "all"   //这个设置可以使得节点进行拖动 *** 作

      },

      ui:{

           context     : [ //自定义右键 *** 作的可 *** 作内容

            {

                id      : "create",

                label   : "添加下级目录", //右键d出菜单的此项 *** 作屏显字样

                visible : function (NODE, TREE_OBJ) { if(NODElength != 1) return false; return TREE_OBJcheck("creatable", NODE); }, //允许节点被右击时出现 *** 作菜单

                icon    : "<%=requestgetContextPath() %>/css/themes/default/createpng",//右键d出菜单的此项 *** 作图标

                action  : function (NODE, TREE_OBJ) {

                                                //进行此项 *** 作,将有这个函数事件被响应

                                                     }

            },

            "separator"//这个是在两个 *** 作之间画一条分隔线

           ,

            {

                id      : "edit",

                label   : "编辑目录信息",

                visible : function (NODE, TREE_OBJ) { if(NODElength != 1) return false; return TREE_OBJcheck("creatable", NODE); },

                icon    : "<%=requestgetContextPath() %>/image/reg2gif",

                action  : function (NODE, TREE_OBJ) {

                                                    openWindow('myurl','','',function(){treeRefresh($(NODE)attr("id"));});

                                                    }

            },

            "separator"

            ,

            {

                id      : "privilege",

                label   : "设置目录权限",

                visible : function (NODE, TREE_OBJ) { if(NODElength != 1) return false; return TREE_OBJcheck("creatable", NODE); },

                icon    : "<%=requestgetContextPath() %>/css/themes/default/renamepng",

                action  : function (NODE, TREE_OBJ) {

                                                    openWindow('myurl','','',function(){treeRefresh($(NODE)attr("id"));});

                                                    }

            },

            "separator",

            {

                id      : "delete",

                label   : "删除",

                visible : function (NODE, TREE_OBJ) { if(NODElength != 1) return false; return TREE_OBJcheck("creatable", NODE); },

                icon    : "<%=requestgetContextPath() %>/css/themes/default/removepng",

                action  : function (NODE, TREE_OBJ) {

                                                    var tree=$tree_reference("browser");

                                                    openWindow('myurl','','',function(){

                                               //下边的parent()和refresh()均为v098版本提供,如果你使用的是其他版本如v096等,这些将不被支持。

                                                    NODE=$(treeparent(NODE));

                                                    if($(NODE)attr("id")==undefined){

                                                        treerefresh();

                                                    }else{

                                                        TreeRefresh();

                                                    }

                                                    });

                                                    }

            },

            "separator",

            {

                id      : "others",

                label   : "其他 *** 作",

                visible : function (NODE, TREE_OBJ) { if(NODElength != 1) return false; return TREE_OBJcheck("creatable", NODE); },

                icon    : "<%=requestgetContextPath() %>/css/images/cutpng",

                action  : function (NODE, TREE_OBJ) {

                                                    alert("暂无可提供 *** 作。");

                                                    }

            }

            ]

      },

   callback : {

         onselect: function(node) {

            //(a);

           

        }

    }

 

});

function treeRefresh(nodeid){

                     var rid=nodeid;

                    var tree=$tree_reference("browser");

                    var par_node=treeparent($("#"+rid));

                    treerefresh(par_node);

}

});

jstree默认打开有两种方式,一种在生成树结构时在有子节点的li中加class="jstree-open"还有一种是树形载入完成后用jstree的所有节点open_all事件所有节点跳转是要在生成时在li中加XXX或在载入完后再用js加载

$(document)ready(function(){

$ajaxSetup({cache:false});

$("#browser")tree({

data : {

type : "json",

url : src,

async : true,

async_data : function (NODE) {

return { parent_Id : $(NODE)attr("id") || 0}

}

},

lang:{

loading:"目录加载中……"

},

rules:

{

draggable : "all" //这个设置可以使得节点进行拖动 *** 作

},

ui:{

context : [ //自定义右键 *** 作的可 *** 作内容

{

id : "create",

label : "添加下级目录", //右键d出菜单的此项 *** 作屏显字样

visible : function (NODE, TREE_OBJ) { if(NODElength != 1) return false; return TREE_OBJcheck("creatable", NODE); }, //允许节点被右击时出现 *** 作菜单

icon : "<%=requestgetContextPath() %>/css/themes/default/createpng",//右键d出菜单的此项 *** 作图标

以上就是关于jsp怎么从mysql数据库把树形结构展现出来全部的内容,包括:jsp怎么从mysql数据库把树形结构展现出来、(JQuery)如何给JsTree生成的树的每个节点添加上自定义的右键菜单、请教关于jstree展开节点加载子节点问题等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/sjk/10197466.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-06
下一篇 2023-05-06

发表评论

登录后才能评论

评论列表(0条)

保存