weixin_33725270 2017-03-10 04:10 采纳率: 0%
浏览 43

用ajax显示树

I have tree data in mysql table. I have ID and parentID. I wish to display a tree structure with Ajax. When I click on the node, I want to sent a parameter to a page and return a data and then use the data to display the children.

<body>
<div id='jstree'>
</div>
<script>
  $(function () {
    // 6 create an instance when the DOM is ready
    $('#jstree').jstree({
      'core' : {
      'data' : {
       'url' : 'abc.asp?',
      'data' : function (node) {
       return { 'accno' : node.id };
     }
   }
  }
});
    // 7 bind to events triggered on the tree
    $('#jstree').on("changed.jstree", function (e, data) {
      console.log(data.selected);
    });
    // 8 interact with the tree - either way is OK
    $('button').on('click', function () {
      $('#jstree').jstree(true).select_node('child_node_1');
      $('#jstree').jstree('select_node', 'child_node_1');
      $.jstree.reference('#jstree').select_node('child_node_1');
    });
  });
 </script>
</body>

I really hope you guys can help me out. What I want to achieve after my research is called lazy loading. Say I have a sql table with the following data.

   Accno    Referral 
    L1A
    L1B  
    L2A1       L1A   
    L2A2       L1A
    L2A3       L1A    
    L2B1       L1B
    L2B2       L1B
    L2B3       L1B
    L3A1       L2A1
    L3A2       L2A1 
    L3B1       L2B3 
    L3B2       L2B2
   and so on
  1. Initially I want to load L1A and L1B with + sign indicates they have children
  2. When clicked on the node with children, say L1A.
    • How to pass a url with parameter of accno L1A to another page to process? How to indicate node.id is L1A(will it automatically be detected when I click on the node?)
  3. Pass the url abc.asp?accno="L1A" to a html/asp page to process.
  4. Find the children with accno="L1A" in SQL statement, select .... with referral = 'L1A' flag the results for those with children and those without children.
  5. Return the results.
    • How do I return results, in HTML file? I can format it in any strings but what is format?
  6. And, how does JSTREE pick up the results and display?

Please help.

  • 写回答

1条回答 默认 最新

  • weixin_33691598 2017-03-10 04:31
    关注

    You can use jstree. jsTree is jquery plugin, that provides interactive trees. It is absolutely free, open source and distributed under the MIT license. jsTree is easily extendable, themable and configurable, it supports HTML & JSON data sources and AJAX loading.

    jsTree functions properly in either box-model (content-box or border-box), can be loaded as an AMD module, and has a built in mobile theme for responsive design, that can easily be customized. It uses jQuery's event system, so binding callbacks on various events in the tree is familiar and easy.

    Reference

    JSTree Example with Php & Mysql

    评论

报告相同问题?

悬赏问题

  • ¥15 如何在scanpy上做差异基因和通路富集?
  • ¥20 关于#硬件工程#的问题,请各位专家解答!
  • ¥15 关于#matlab#的问题:期望的系统闭环传递函数为G(s)=wn^2/s^2+2¢wn+wn^2阻尼系数¢=0.707,使系统具有较小的超调量
  • ¥15 FLUENT如何实现在堆积颗粒的上表面加载高斯热源
  • ¥30 截图中的mathematics程序转换成matlab
  • ¥15 动力学代码报错,维度不匹配
  • ¥15 Power query添加列问题
  • ¥50 Kubernetes&Fission&Eleasticsearch
  • ¥15 報錯:Person is not mapped,如何解決?
  • ¥15 c++头文件不能识别CDialog