0

I need to iterate through a site to list all it's top level sites then each sites subsite, then each subsites subsite, etc, until I end up with a tree of my entire site collection. I'm not sure how to loop my function to accomplish this.

This is my initial html:

      <div id="treeviewDiv" style="width:200px;height:150px;overflow:scroll">
        <ui id="treeviewList"></ui>
      </div>

This is the Javascript I'm using:

So the way I tried to do it was that after I find my first site, run the $().SPServices to give me a list of the subsites based on the $(this).attr(url)

function getSiteTree(){
    var tree = $('#treeviewList');
    var rootsite = window.location.protocol + "//" + window.location.hostname;

$().SPServices({
    operation: "GetWebCollection",
    webURL: rootsite,
    async: true,
    completefunc(xData, Status){
        $(xData.responseXML).find("Web").each(function(){
            tree.append("<li value='" + $(this).attr("Url") + "'>" + $(this).attr("Title") + "</li>");

             $().SPServices({
                operation: "GetWebCollection",
                webURL: $(this).attr("Url"),
                async: true,
                completefunc: function(xData, Status){
                    if($(xDate.responseXML.find("Web"))){
                        $(xData.responseXML).find("Web").each(function(){
                        strHTMLTopSites += "<li value='" + $(this).attr("Url") + "'>" + $(this).attr("Title") + "</li>";

*** I kind of gave up at this point, it seemed like I'd just be copying the amount of times I run this function arbitrarily which seemed like a bad way to do it.  
                      });
                    }

        });
    }
});

}

This is the XML response you get when running $().SPServices:

<Webs xmlns="http://schemas.microsoft.com/sharepoint/soap/">
   <Web Title="Subsite1_Name" Url="http://Server_Name/[sites]/
      [Site_Name]/[Subsite1]" />
   <Web Title="Subsite2_Name" Url="http://Server_Name/[sites]/
      [Site_Name]/[Subsite2]" />
</Webs>

This is the XML when there are no subsites:

<?xml version="1.0" encoding="utf-8"?><soap:Envelope xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema"><soap:Body><GetWebCollectionResponse xmlns="http://schemas.microsoft.com/sharepoint/soap/"><GetWebCollectionResult>`<Webs />`</GetWebCollectionResult></GetWebCollectionResponse></soap:Body></soap:Envelope>

Something like this is what I'm trying to create:

<div class="demo-section">
    <ul id="treeview">
        <li>Furniture
            <ul>
                <li>Tables & Chairs</li>
                <li>Sofas</li>
                <li>Occasional Furniture</li>
                <li>Childerns Furniture</li>
                <li>Beds</li>
            </ul>
        </li>
        <li>Decor
            <ul>
                <li>Bed Linen</li>
                <li>Throws</li>
                <li>Curtains & Blinds</li>
                <li>Rugs</li>
                <li>Carpets</li>
            </ul>
        </li>
        <li>Storage
            <ul>
                <li>Wall Shelving</li>
                <li>Kids Storage</li>
                <li>Baskets</li>
                <li>Multimedia Storage</li>
                <li>Floor Shelving</li>
                <li>Toilet Roll Holders</li>
                <li>Storage Jars</li>
                <li>Drawers</li>
                <li>Boxes</li>
            </ul>
        </li>
    </ul>
</div>
7
  • Take a look at recursion. Basically, a function calling itself. Recursion allows for some rather elegant code. In this case, you'll want to call the $().SPServices thing from within itself, making sure to stop calling once you can't go any deeper within that branch of the site map.
    – TheCrzyMan
    Oct 17, 2013 at 20:52
  • Lets say I reach the end of a branch, wouldn't I need a loop to move to the next top branch? I'll look into it, but I've never used Recursion, it's going to take me some time to figure out
    – Batman
    Oct 17, 2013 at 22:08
  • The beauty of recursion is that the answer is no. Suppose you have a function walk(branch) that evaluates the given branch. Within walk(), you can call walk() for each sub-branch. Imagine you passed the function your hips (key word "imagine"). It would look at your hips and see that you (probably) have two legs. So, from within the function, you might have a loop which effectively does walk(left leg); walk( right leg). As it evaluates your left leg, it sees you (probably) have 5 toes. it loops and calls the walk() function 5 times, passing a single toe each time... [continued]
    – TheCrzyMan
    Oct 18, 2013 at 3:17
  • within the functions that were passed toes, it sees that it can't go any further, so it stops. We now have taken care of the left leg and all it's toes. Your concern is about looking at the right leg. But if you remember, we called the function and passed it the right leg further up in the explanation. So, fantastically, we have taken care of the hip down.
    – TheCrzyMan
    Oct 18, 2013 at 3:22
  • A key thing with recursion, though, is that your function takes care of ALL the appropriate "branches", and that you have "base case." For your specific example, the base case is when there are no more branches to go down, so it really takes care of itself. but you always need to make sure that the function has a condition that will eventually be fulfilled, and the recursion stops when it is.
    – TheCrzyMan
    Oct 18, 2013 at 3:33

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.