Question

本周我刚刚开始使用fancytree，当节点被延迟加载时，我想添加一个表，该表的数据将是GET请求的输出，并且我有生成该表的代码为我想要用jquery，但是当它需要将其添加到data.result时，我不知道该怎么做，它期望有一个子代列表，并且我的函数的输出将是表中的表格，如代码片段中所示

我尝试了很多而且很可能是愚蠢的事情，但在示例中找不到任何帮助，请帮助！

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>

Answer 1

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

您尝试过

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

但是不确定这将对标准树的样式和事件处理起到多大的作用。

在fancytree中延迟加载时，如何向子节点添加A？

1 个答案: