Question

我正在尝试构建一个组件，用于呈现sharepoint网站集的网站和子网站的结构，并使用code from here

这段代码很棒，但不幸的是，它会一个接一个地返回所有站点而没有层次结构，我有兴趣返回/构建输出类似于这样的行:(因为我可以绑定到树视图库）

<ul>
  <li>site 1
  <li>site 2
  <li>site 3
  <ul>
  <li>Sub-site 3.1
  <ul>
    <li>Sub-site 3.1.1
    <li>Sub-site 3.1.2
  </ul>
  <li>Sub-site 3.2
  <ul>
    <li>Sub-site 3.2.1
    <li>Sub-site 3.2.2
  </ul>
</ul>

很想听到有关于此的想法或做过类似事情的人。我希望为SharePoint 2013找到类似jquery站点树视图导航的内容，但我找到的只是KWizCom treeview component（这将完美地解决我们的挑战），我们不允许将服务器端代码部署到服务器场。

提前致谢

Answer 1

如果你愿意在混合中加入一点递归，这是相对简单的。

基本流程如下：获取给定Web的所有子Web，在层次结构中显示它们，然后为每个子Web重复该过程。

这是一个让你入门的例子。

<ul id="root_hierarchy"></ul>

<script>
ExecuteOrDelayUntilScriptLoaded(showWebHierarchy,"sp.js");

function showWebHierarchy(){
    var rootUrl = "/yoursitecollectionurl";
    rootNode = document.getElementById("root_hierarchy");   
    get_subwebs(rootUrl,rootNode);
}

// get_subwebs is a recursive function that accepts the following parameters:
// url: the server relative url of a web 
// node: <ul> element in which to display subsites
function get_subwebs(url,node){
    var clientContext = new SP.ClientContext(url);
    var webs = clientContext.get_web().get_webs();
    clientContext.load(webs);
    clientContext.executeQueryAsync(function(){
        for(var i = 0, len = webs.get_count(); i < len; i++){
            var web = webs.getItemAtIndex(i);
            node.insertAdjacentHTML("beforeend","<li><a target='_blank' href='"
                 + web.get_serverRelativeUrl() + "'>"
                 + web.get_title() + "</a><ul url='" 
                 + web.get_serverRelativeUrl() + "'></ul></li>");
        }
        var subnodes = node.querySelectorAll("ul");
        for(var i = 0, len = subnodes.length; i < len; i++){
            var subnode = subnodes[i];
            var url = subnode.getAttribute("url");
            get_subwebs(url,subnode);
        }
    },function(sender,args){alert(args.get_message());});   
}
</script>

请注意，这是以当前登录用户的权限运行的，因此无法显示当前用户无权访问的网站。

SharePoint 2013使用javascript构建站点树导航

1 个答案: