JQuery EasyUI(45)

最新推荐文章于 2022-11-12 10:55:18 发布

Roger_CoderLife

最新推荐文章于 2022-11-12 10:55:18 发布

阅读量133

点赞数

分类专栏： WEB - jQuery EasyUI

原文链接：https://study.163.com/course/courseMain.htm?courseId=943002

版权

WEB - jQuery EasyUI 专栏收录该内容

55 篇文章 0 订阅

订阅专栏

第三十六章： Tree（数）组件【2】

学习要点：

异步加载

一、异步加载：

如果想从数据库里获得导航内容，那么就必须实现一张父类子类的无限极分类表。主要有id（编号）、text（名称）、state（状态）、tid（类别）。

PS：在这里点击目录时，不需要通过触发事件来完成异步加载数据。因为它内部已经实现了这个事件。

默认情况下，我们将目录进行了隐藏。如果想要一下子全部展开，可以使用onLoadSuccess(node,data)事件和 expanAll方法。

<!DOCTYPE html>
<html>
  <head>
    <title>JQuery Easy UI</title>
    <meta charset="utf-8"/>
    <script type="text/javascript" src="easyui/jquery.min.js"></script>
    <script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>     
    <script type="text/javascript" src="easyui/locale/easyui-lang-zh_CN.js"></script>     
    <script type="text/javascript" src="js/index.js"></script> 
    <link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css"/>
    <link rel="stylesheet" type="text/css" href="easyui/themes/icon.css"/>  
    <style>
        .textbox{
            height:200px;
            margin:0;
            padding:0 2px;
            box-sizing:content-box;
       }
    </style>            
</head>
  <body>
     <ul id="box"></ul>   
  </body>
</html>

$(function(){
    $('#box').tree({
       url:'tree.php',
       lines:true,
       onLoadSuccess:function(node,data){
           if(data){
             $(data).each(function(index,value){
               if(this.state == 'closed'){
                  $('#box').tree('expandAll');
             }
          });
        }
      }
  });
});

<?php

   //记得是：tree.php

   require 'config.hph';

   $id = 0;   

   if(isset($_POST['id'])){
      $id = $_POST['id'],
 }

   $query = mysql_query("SELECT id,text,state FROM think_nav WHERE tid = '$id'") or die('SQL 错误！');
   
   $json ='';

   while (!!$row = mysql_fetch_array($query,MYSQL_ASSOC)){
      print_r($row);
      $json .= json_encode($row).',';
    }

   $json  = substr($json,0,-1);

   echo '['.$json.']'; 

   mysql_close();
?>

作者：Roger_CoderLife

链接：https://blog.csdn.net/Roger_CoderLife/article/details/103798945

本文根据网易云课堂JQuery EasyUI视频教程翻译成文档，转载请注明原文出处，欢迎转载

Roger_CoderLife

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JQuery EasyUI(45)

第三十六章：Tree（数）组件【2】学习要点：异步加载一、异步加载：如果想从数据库里获得导航内容，那么就必须实现一张父类子类的无限极分类表。主要有id（编号）、text（名称）、state（状态）、tid（类别）。PS：在这里点击目录时，不需要通过触发事件来完成异步加载数据。因为它内部已经实现了这个事件。默认情况下...
复制链接

扫一扫