boonya
<%@ 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">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Full Layout - jQuery EasyUI Demo</title>
<%@ include file="/common/taglibs.jsp"%>
<link id="easyuiTheme"    href="${ctx}/res/js/easyui/themes/default/easyui.css" rel="stylesheet"    type="text/css" />
<link href="${ctx}/res/style/common-metro.css" rel="stylesheet"    type="text/css" />
<link href="${ctx}/res/js/easyui/themes/icon.css" rel="stylesheet"    type="text/css" />

<script type="text/javascript" src="${ctx}/res/js/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="${ctx}/res/js/jquery.corner.js"></script>
<script type="text/javascript" src="${ctx}/res/js/jquery.cookie.js"></script>
<script type="text/javascript"
    src="${ctx}/res/js/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript">
    var count = 0;
    var PROJECT_URL = "${ctx}";

    $(function() {
        $(\'#treeGrid\').treegrid({
            url : PROJECT_URL+"/res/js/data/treedata.json",
            idField : \'id\',
            treeField : \'name\',
            title:\'资源列表\',
            rownumbers : "true",
            onlyLeafCheck: true,
            animate: true,
            singleSelect: false, 
            columns : [ [
            {
                title : \'id\',
                field : \'id\',
                checkbox: true,
                width : 100
            }, {
                title : \'resource name\',
                field : \'name\',
                width : 220
            }, {
                title : \'link\',
                field : \'size\',
                width : 120,
                align : \'center\'
            }, {
                field : \'date\',
                title : \'Begin Date\',
                width : 140,
                align : \'center\'
            } ] ],
            onSelected:set_power_status
        });
        $("#consle").bind("click", consleclick);
    });

    function set_power_status() {
        var idList = "";
        $("input:checked").each(function() {
            var id = $(this).attr("id");
            if (id.indexOf("ceshi_") > -1)
                idList += id.replace("ceshi_", \'\') + \',\';
        });
        alert(idList);
    }

    function consleclick() {
        var node = $(\'#treeGrid\').treegrid(\'expandAll\', 2);
    }
</script>
</head>
<body class="easyui-layout">
     <table id="treeGrid"  class="easyui-treegrid" style="width:700px;height:300px"></table>
    <a id="consle" href="#">red</a>
</body>
</html>

此设置跟grid很相似了。

分类:

技术点:

相关文章: