The example in this topic show how to use JSOM to Get all the nodes from top navigation in SharePoint
- You can use Content Editor or Script Editor web part
on your site, put Html and
JSOM (Java Script Object Model) code and that's it. You can perform any action supported by JSOM APIs
How to execute JSOM code in SharePoint?
- Note: This is just a sample, you can go ahead with your
implementation.
- Open your Site. Create a webpart page.
- Put a Content Editor Web part and a Script Editor Web part
on it.
- I have added below Html in Content Editor webpart.
You can replace MainFunction with your actual method name.
<button onclick="MainFunction();"
type="button">Click
me</button>
- And below references in Script Editor Webpart.
You can keep jQuery reference as per your need. ScriptFile.js is a JavaScript
file where you can keep below function i.e. your actual logic.
<script src="https://code.jquery.com/jquery-2.2.4.js"
type="text/javascript"></script>
<script type="text/javascript"
src="/_layouts/15/sp.runtime.js"></script>
<script type="text/javascript"
src="/_layouts/15/sp.js"></script>
<script src="https://MyServer/sites/SiteCollection/style
library/js/ScriptFile.js"></script>
- Once you are done with setting your page, click on the button and your method should
get executed.
- var clientContext, topNavigationCollection;
-
- function GetTopNavigationNodes() {
- // You can optionally specify the Site URL here to get
the context
- // If you don't specify the URL, the method will get
the context of the current site
- // var clientContext = new
SP.ClientContext("http://MyServer/sites/SiteCollection");
-
clientContext = new SP.ClientContext();
-
- var oWeb = clientContext.get_web();
-
- // Get Top Navigation node collection
-
topNavigationCollection = oWeb.get_navigation().get_topNavigationBar();
-
- //Load the client context and execute the batch
-
clientContext.load(topNavigationCollection);
-
- // Execute the query to the server.
-
clientContext.executeQueryAsync(onsuccess, onfailed);
- }
-
- function onsuccess() {
-
- //Get the item count
- var itemCount = topNavigationCollection.get_count();
-
- for (var i = 0; i
< itemCount; i++) {
- var title =
topNavigationCollection.get_item(i).get_title();
- var url =
topNavigationCollection.get_item(i).get_url();
-
-
console.log("Title of the node: "
+ title + " == URL of the node: " +
url);
- }
- }
-
- function onfailed(sender, args) {
-
console.log('Failed' +
args.get_message() + '\n' +
args.get_stackTrace());
- }
Thank you for reading this article. This code was tested in SharePoint 2013