0

I'm trying to build a menu from a SharePoint list but I need to group the main menus and then add links to the appropiate main menus. I have separated the links using the LinkType column if it is a header or a header with a link.

What I need help with is to get the distinct of the Group columns or how to group the groups columns.

My data looks like this:

Title   URL             LinkType        Groups
Test    http://Test     Header Link     Comms
Test2d  http://Test2    Header          Marketing
Test3   http://Test3    Header          Comms
Test4   http://test4    Header          Plans
Test5   http://Test5    Header Link     Marketing
$().SPServices({
  operation: "GetListItems",
  async: false,
  listName: "Menu",
  CAMLViewFields: "<ViewFields></ViewFields>",
  completefunc: function (xData, Status) {
    $(xData.responseXML).find("[nodeName=z:row]").each(function() {
      var title= $(this).attr("ows_Title");
      var groups = $(this).attr("ows_Groups");
      var LinkType = $(this).attr("ows_LinkType");
      var HTMLmarkup = '';
      $(".sf-menu").each(function() {
        if (LinkType == 'Header') {
          HTMLmarkup += '<li class="current"><a href=#>' + groups + '</a>';
          HTMLmarkup += '<ul>';
          HTMLmarkup += '<li><a href="#">' + title+ '</a></li>';
          HTMLmarkup += '</ul>'
          HTMLmarkup += '</li>';
          $(".sf-menu").append(HTMLmarkup);
        } else if (LinkType == 'Header Link') {
          //HTMLmarkup += '<li class="current"><a href="#a">' + groups + '</a>';
          HTMLmarkup += '<li class="current"><a href=' + title + '>' + groups + '</a>';
          HTMLmarkup += '<ul>';
          HTMLmarkup += '<li><a href="#">' + title+ '</a></li>';
          HTMLmarkup += '</ul>'
          HTMLmarkup += '</li>';
          $(".sf-menu").append(HTMLmarkup);
        }
      });
    });
  }
});
1

If your Links are in a standard SharePoint List you can configure it to display your links in groups.

  1. Create a new view.
  2. In the Group By section of the view settings select your LinkType column

You can now place a WebPart displaying this grouped list of links on your page.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.