在 fancytree 中延迟加载时,如何将 <table> 添加到 child 节点?

How can I add a <table> to a child node when is lazyloaded in fancytree?

我这周刚开始使用fancytree,我想在节点延迟加载时添加一个table,table的数据将是GET请求的输出并且我有生成 table 的代码,因为我想要它 jquery 但是当它的时间将它添加到 data.result 我不知道如何去做,它期待一个列表children 并且我的函数的输出将是 table,因为它在片段

我尝试了很多很可能是愚蠢的事情,但我在示例中找不到任何帮助,请帮忙!

const SOURCEDATA = [
  {
  "title": "group1", 
  expanded: true, 
  children: [
    {
     "title": "Users", 
     expanded: true, 
     children: [
      {"title": "User1", "lazy": true}, 
      {"title": "User2", "lazy": true},
      {"title": "User3", "lazy": true}
      ]
     }]
   },
   {
  "title": "group2", 
  children: [
    {
     "title": "Users", 
     expanded: true, 
     children: [
      {"title": "User4", "lazy": true}, 
      {"title": "User5", "lazy": true},
      {"title": "User6", "lazy": true}
      ]
     }]
   }
   ]

$(function() {
  $("#tree").fancytree({
  source: SOURCEDATA,
  focusOnSelect: true,
  activeVisible: true,
  lazyLoad: function(event, data){
    var node = data.node
    data.result = [{"title":"this should be the place for the table"}]
     }
  });
});
<link href="//cdn.jsdelivr.net/npm/jquery.fancytree@2.25/dist/skin-win8/ui.fancytree.min.css" rel="stylesheet">
<script src="//code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="//code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<script src="//cdn.jsdelivr.net/npm/jquery.fancytree@2.27/dist/jquery.fancytree-all.min.js"></script>
    
<div id="tree">my tree</div>
<table id="user_2">
  <thead>
    <tr>
      <th>Process Name</th>
      <th>Process Hashes</th> 
      <th>Process Author</th>
      <th>Action</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>
        <select id="process_name">
          <option>Foo.exe</option>
          <option></option>
        </select>
      </td>
      <td>
        <select id="process_hash">
          <option></option>
          <option value="0123ABC">0123ABC</option>
          <option value="ABC0123">ABC0123</option>
        </select>
      </td>
      <td>
        <select id="process_author">
          <option></option>
          <option value="Someone">Someone</option>
          <option value="Somebody">Somebody</option>
        </select>
      </td>
      <td>
        <input id="act_allow" type="radio" name="action" value="allow">Allow</input>
        <input id="act_deny" type="radio" name="action" value="deny">Deny</input>
        <input id="act_warn" type="radio" name="action" value="warn">Warn</input>
      </td>
    </tr>
  </tbody>
</table>

只要 escapeTitles 选项未启用,您应该能够添加原始 HTML 标记作为标题。

你试了吗

  lazyLoad: function(event, data){
    var node = data.node
    data.result = [{title: "<table>...</table>", icon: false}]
     }
  });

但是不确定这对标准树的样式和事件处理有多大影响。