1. 效果图

这是一个简单的solr检索的例子

 

输入关键词,显示树

 

选择一个节点,得到该节点下文档信息

 

  1. 代码:

JSP:

重点是标红的URL传递

<body>

    <div
class="easyui-panel"
title="Solr">

        <div
style="padding: 10px 60px 20px 60px;">

            <table
cellpadding="5"
align="center">

                <tr>

                    <td>Carrot2:</td>

                    <td><input
class="easyui-validatebox textbox"
type="text"

                        name="q"
data-options="required:true"></input></td>

                    <td><a
href="javascript:void(0)"
class="easyui-linkbutton"

                        onclick="submitForm()">Search</a></td>

                </tr>

            </table>

        </div>

    </div>

    <br />

    <table>

        <tr>

            <td>

                <div
class="easyui-panel"

                    style="padding: 5px; width: 400px; height: 600px;">

                    <ul
id="cluster_tree"
class="easyui-tree"></ul>

                </div>

            </td>

            <td>

                <div
class="easyui-panel"

                    style="padding: 5px; width: 1160px; height: 600px;">

                    <table
id="docs"></table>

                </div>

            </td>

        </tr>

    </table>

    <script>

        function submitForm() {

            $('#cluster_tree').tree(

                    {

                        url : 'tree.do/' + $("input[name='q']").val(),

                        method : 'GET',

                        onClick : function(node) {

                            $('#docs').datagrid(

                                    {

                                        url : 'docs.do/' + node.id + '/'

                                                + $("input[name='q']").val(),

                                        method : 'GET',

                                        width : 'auto',

                                        striped : true,

                                        singleSelect : true,

                                        loadMsg : '数据加载中请稍后……',

                                        rownumbers : true,

                                        columns : [ [ {

                                            field : 'name',

                                            title : '文档编号',

                                            align : 'center'

                                        }, {

                                            field : 'title',

                                            title : '文档名称',

                                            align : 'left'

                                        }, {

                                            field : 'score',

                                            title : '得分',

                                            align : 'left'

                                        } ] ]

                                    });

                        }

                    });

        }

    </script>

</body>

 

JAVA:

这里只提供接口级别的定义

    /**

     * 得到聚类树

     * @param q     检索的字段

     * @return        使用JSONArray生成JSON

     * @throws SolrServerException

     */

    @RequestMapping(value = "tree.do/{q}", method = RequestMethod.GET, produces = MediaType.APPLICATION_JSON_VALUE)

    @ResponseBody

    public String getTreeList(@PathVariable String q) throws SolrServerException

    {}

 

    /**

     * 得到文档列表

     * @param name     文档的ID

     * @param q     检索的字段,再检索

     * @return        使用JSONArray生成JSON

     * @throws SolrServerException

     */

    @RequestMapping(value = "docs.do/{name}/{q}", method = RequestMethod.GET, produces = MediaType.APPLICATION_JSON_VALUE)

    @ResponseBody

    public String getDocList(@PathVariable String name, @PathVariable String q) throws SolrServerException

    {}

 

  1. 总结:

    需要注意的是,这里虽然使用检索获得Tree,但是并没有采用POST表单的方式得到Tree的数据而是使用GET+参数方式获得.

    EasyUI使的不多,感觉这方面的资料比较少,如果有更好的实现方式请告诉我,谢谢!

EasyUI Tree与Datagrid联动的更多相关文章

  1. 数据网格和树-EasyUI Datagrid 数据网格、EasyUI Propertygrid 属性网格、EasyUI Tree 树、EasyUI Treegrid 树形网格

    EasyUI Datagrid 数据网格 扩展自 $.fn.panel.defaults.通过 $.fn.datagrid.defaults 重写默认的 defaults. 数据网格(datagrid ...

  2. Jquery EasyUI Tree .net实例

    图片: 针对tree: 数据库: CREATE TABLE [dbo].[SystemModel]( [Id] [,) NOT NULL, [Name] [nvarchar]() NULL, [Fat ...

  3. jQuery EasyUI教程之datagrid应用（三）

    今天继续之前的整理,上篇整理了datagrid的数据显示及其分页功能 获取数据库数据显示在datagrid中:jQuery EasyUI教程之datagrid应用(一) datagrid实现分页功能: ...

  4. jQuery EasyUI教程之datagrid应用（二）

    上次写到了让数据库数据在网页datagrid显示,我们只是单纯的实现了显示,仔细看的话显示的信息并没有达到我们理想的效果,这里我们丰富一下: 上次显示的结果是这样的 点击查看上篇:jQuery Eas ...

  5. Easyui Tree方法扩展 - getLevel(获取节点级别)

    Easyui Tree一直就没有提供这个方法,以前没有用到,所以一直没怎么在意,这次自己用到了,顺便扩展了一个方法,分享给大家. $.extend($.fn.tree.methods, { getLe ...

  6. [转]easyui tree 模仿ztree 使用扁平化加载json

    原文地址:http://my.oschina.net/acitiviti/blog/349377 参考文章:http://www.jeasyuicn.com/demo/treeloadfilter.h ...

  7. 【项目经验】EasyUI Tree

    ITOO5.0开始了,我参加了伟大的基础系统,从整体上来说,基础系统有三个职能: 1.自己的核心职能--选课(公共选修课,专业选修课),课表: 2.为其他系统提供真实数据: 3.维护信息 而近两三天, ...

  8. jQuery EasyUI教程之datagrid应用（一）

    最近一段时间都在做人事系统的项目,主要用到了EasyUI,数据库操作,然后抽点时间整理一下EasyUI的内容. 这里我们就以一个简洁的电话簿软件为基础,具体地说一下datagrid应用吧 datagr ...

  9. Jquery easyui Tree的简单使用

    Jquery easyui Tree的简单使用 Jquery easyui 是jQuery EasyUI是一组基于jQuery的UI插件集合,而jQuery EasyUI的目标就是帮助web开发者更轻 ...

随机推荐

  1. 【JZOJ2867】Contra

    description 偶然间,chnlich 发现了他小时候玩过的一个游戏"魂斗罗",于是决定怀旧.但是这是一个奇怪的魂斗罗 MOD. 有 N 个关卡,初始有 Q 条命. 每通过 ...

  2. dos中文乱码怎么办？

    最简单的方法: 通过 chcp命令改变代码页,UTF-8的代码页为65001 即chcp 65001 chcp 65001  就是换成UTF-8代码页 chcp 936 可以换回默认的GBK chcp ...

  3. identifier of an instance of xx.entity was altered from xxKey@249e3cb2 to xxKey@74e8f4a3; nested exception is org.hibernate.HibernateException: identifier of an instance of xxentity was altered from错误

    用entityManager保存数据时报错如下 identifier of an instance of xx.entity was altered from xxKey@249e3cb2 to xx ...

  4. 利用bu命令下延迟断点

    bu可以针对符号下断点.这里是用bu下延迟断点的意义在于即使目标驱动没有被加载,windbg也允许我们针对符号设置断点.当新加载驱动程序后,windbg就会检查驱动程序中是否包含了设置了延迟断点的函数 ...

  5. CSS3视口单位vw,wh

    vw和vh是视口(viewport units)单位,何谓视口,就是根据你浏览器窗口的大小的单位,不受显示器分辨率的影响,是不是很神奇,这就代表了,我们不需要顾虑到现在那么多不同电脑有关分辨率的自适应 ...

  6. http://www.jianshu.com/简书。

    http://www.jianshu.com/ 简书,类似于博客园.也是一个交流平台.

  7. [kuangbin带你飞]专题一 简单搜索 - C - Catch That Cow

    #include<iostream> #include<cstdio> #include<string> #include<vector> #inclu ...

  8. vue-router的访问权限管理

    路由守卫(路由钩子.拦截器) vue-router 提供的导航守卫主要用来通过跳转或取消的方式守卫导航.有多种机会植入路由导航过程中:全局的, 单个路由独享的, 或者组件级的. 可以不登录直接进入系统 ...

  9. 2019-8-31-C#-如何给-ValueTuple-返回值添加注释

    title author date CreateTime categories C# 如何给 ValueTuple 返回值添加注释 lindexi 2019-08-31 16:55:58 +0800 ...

  10. 杂项-关于strlen()的使用

    发现了一个很坑的东西. 看下面两份代码: //code1 char s[N]; ;i<strlen(s);i++)Do(); //code2 char s[N]; ;s[i];i++)Do(); ...