您的位置:首页 > Web前端 > JavaScript

使用js方式加载tree下拉树形列表

2017-06-27 11:46 531 查看
后台一次性加载tree所需要的数据:

        public ModelAndView queryEqu(HttpServletRequest request,HttpServletResponse response){

        try{

            String pid = request.getParameter("id");

            Map<String,Object> map = null;

            List<Map<String, Object>> trees = new ArrayList<Map<String, Object>>();

            if("0".equals(pid)){

                ConditionParse condParse = new ConditionParse();

                //condParse.addCondition("pid", "=", pid);

                condParse.addWhereStr();

                List<J20804_WzTypeBean>  ros  =j20804_WzTypeManager.queryJ20804_WzType(condParse);

                 for (J20804_WzTypeBean wz : ros) {

                        map = new HashMap<String,Object>();

                        map.put("id", wz.getId());

                        map.put("pId", wz.getPid());

                        map.put("name", wz.getName());

                        map.put("code", wz.getType());

                        if(0 == wz.getLeafValue()){

                            wz.setLeaf(true);

                        }

                        if(!wz.isLeaf()){

                            map.put("isParent", "true");

                            map.put("childs", queryEqus(wz.getId()));

                        }

                        trees.add(map);

                    }

            }

            

            String json = JsonHandler.buildJson(trees,false);

            writeJson(response, json);

        }catch (Exception e) {

            e.printStackTrace();

            log.error("J1042_ZBRKGLController中queryEqu异常:"+e.toString());

        }

        return null;

    }

    private Object queryEqus(String id) {

        Map<String,Object> map = null;

        List<Map<String, Object>> trees = new ArrayList<Map<String, Object>>();

        ConditionParse condParse = new ConditionParse();

        condParse.addCondition("pid", "=", id);

        condParse.addWhereStr();

        List<J20804_WzTypeBean>  ros  =j20804_WzTypeManager.queryJ20804_WzType(condParse);

         for (J20804_WzTypeBean wz : ros) {

                map = new HashMap<String,Object>();

                map.put("id", wz.getId());

                map.put("pId", wz.getPid());

                map.put("name", wz.getName());

                map.put("code", wz.getType());

                if(0 == wz.getLeafValue()){

                    wz.setLeaf(true);

                }

                if(!wz.isLeaf()){

                    map.put("isParent", "true");

                    map.put("childs", queryEqus(wz.getId()));

                }

                trees.add(map);

            }

        return trees;

    }

简单的js加载

html :

    <div class="zTreeDemoBackground left">

        <input id="wzType" type="text" readonly value="${map.code}" name="wzType"  onclick="showMenu()"  class="m-wrap span10"/>

    </div>

    <div id="menuContent" class="menuContent" style="display:none;position:absolute;height:300px; min-width:163px; background-color:white;border:1px solid;overflow-y:auto;overflow-x:auto;top:10px;">

        <ul id="treeDemo" class="ztree" ></ul>

    </div>

js :

    $(document).ready(function(){

        loadData();

    });

 

    function loadData(){

     $.ajax({

         url:'wzStorageController.do?method=queryEqu',

         type:'POST',

         data:{id:"0"},

         dataType:'json',

         success:function(data) {

             zNodes = data;

             alert(JSON.stringify(zNodes));

             $.fn.zTree.init($("#treeDemo"), setting, zNodes);

         }

     });

     }

 

    var setting = {

            view: {

                dblClickExpand: false

            },

            data: {

                simpleData: {

                    enable: true

                }

            },

            callback: {

                beforeClick: beforeClick,

                onClick: onClick

            }

        };

        function beforeClick(treeId, treeNode) {

            var check = (treeNode && !treeNode.isParent);

            if (!check) showAlert("info", "请选择详细物资");

            return check;

        }

        function onClick(e, treeId, treeNode) {

            var zTree = $.fn.zTree.getZTreeObj("treeDemo"),

            nodes = zTree.getSelectedNodes(),

            v = "";

            nodes.sort(function compare(a,b){return a.id-b.id;});

            for (var i=0, l=nodes.length; i<l; i++) {

                v += nodes[i].code + ",";

            }

            if (v.length > 0 ) v = v.substring(0, v.length-1);

                var cityObj = $("#wzType");

                cityObj.attr("value", v);

            }

        function showMenu() {

            $("#menuContent").css({left:"300px", top:"50px"}).slideDown("fast");

            $("body").bind("mousedown", onBodyDown);

        }

        function hideMenu() {

            $("#menuContent").fadeOut("fast");

            $("body").unbind("mousedown", onBodyDown);

        }

        function onBodyDown(event) {

            if (!(event.target.id == "menuBtn" || event.target.id == "menuContent" || $(event.target).parents("#menuContent").length>0)) {

            hideMenu();

            }

        }

 

 后台:

    /**

     *

      * <p>Description:物资入库树形菜单<p>

      * @author 徐磊

      * @version  2017年6月26日

      * @modifier

      * @modifiDate

      * <p>modifiContent:<p>

      * @param request

      * @param response

      * @return

     */

    public ModelAndView queryEqu(HttpServletRequest request,HttpServletResponse response){

        try{

            String pid = request.getParameter("id");

            Map<String,Object> map = null;

            List<Map<String, Object>> trees = new ArrayList<Map<String, Object>>();

            if("0".equals(pid)){

                ConditionParse condParse = new ConditionParse();

                condParse.addWhereStr();

                List<J20804_WzTypeBean>  ros  =j20804_WzTypeManager.queryJ20804_WzType(condParse);

                 for (J20804_WzTypeBean wz : ros) {

                        map = new HashMap<String,Object>();

                        map.put("id", wz.getId());

                        map.put("pId", wz.getPid());

                        map.put("name", wz.getName());

                        map.put("code", wz.getType());

                        if(0 == wz.getLeafValue()){

                            wz.setLeaf(true);

                        }

                        if(!wz.isLeaf()){

                            map.put("isParent", "true");

                            

                        }

                        trees.add(map);

                    }

            }

            

            String json = JsonHandler.buildJson(trees,false);

            writeJson(response, json);

        }catch (Exception e) {

            e.printStackTrace();

            log.error("J1042_ZBRKGLController中queryEqu异常:"+e.toString());

        }

        return null;

    }
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐