Share via


Vwa.Page.getId Method

Applies to: apps for SharePoint | SharePoint Server 2013

Returns the unique identifier of the active page within the document.

var value = Page.getID()

Return value

string A string that represents the unique identifier of the active page within the document.

Remarks

The unique identifier is the Microsoft Visio 2013 PageSheet name that is established when the Visio file is published. This name is the same as that returned by the Visio 2010 Page.Name property.

For more information about how to add a Visio Web Access Web Part to a SharePoint Web Parts page, see Customizing Visio Web Drawings in the Visio Web Access Web Part.

Example

The following example displays a custom HTML message in the Visio Web Access Web Part that lists each page in the Web Drawing.

<script type='text/javascript'>

// Add a button to display or dismiss the custom message.
document.write("<input type='button' value='Show Message' onclick='buildPageList()' />");

// Declare global variables.
var vwaControl;
var vwaPages;
var isPageSet;
 
// Hook into the AJAX Sys.Application.load event.
Sys.Application.add_load(onApplicationLoad)

// Capture a reference to the current session of the Visio Web Access Web Part.
function onApplicationLoad() {
    try{
        vwaControl= new Vwa.VwaControl(getVWAWebPartID());
        vwaControl.addHandler("diagramcomplete", onDiagramComplete);
    }
    catch(err){
        alert(err);
    }
}

// Search the SharePoint page to get the WebPartID# for the Visio Web Access Web Part.
function getVWAWebPartID() {
    
    // Get a NodesList of all the div tags on the page. 
    var divArray = document.getElementsByTagName("div");
    var webPartElementID;
    
    // Iterate through the NodesList to get the node with the class attribute "VisioWebAccess."
    for (var i = 0; i < divArray.length; i++) {
        var node = divArray[i];
        
        // Return the first instance of the Visio Web Access Web Part.
        if (node.className == "VisioWebAccess") {
            webPartElementID = node.parentNode.parentNode.id;
            break;
        }
    }
    return webPartElementID;
}

// Check to see whether the currently rendered page has already been selected by user.
function onDiagramComplete() {
    if (!isPageSet) {
        buildPageList();
    }
}

// Create list of pages in the currently displayed Web Drawing.
function buildPageList() {
    try{
        // Get references to the pages in the Web Drawing.
        vwaPages = vwaControl.getAllPageIds();
        var pageCount = vwaPages.length;
        var vwaPage = vwaControl.getActivePage();
        var vwaPageName = vwaPage.getId();
        var vwaPageId;

        // Create an HTML fragment.
        var htmlBuilder = "<h1>Pages In This Diagram</h1>";
        htmlBuilder += "Select a page from the list to dismiss this message.<br />"
        htmlBuilder += "<ol id='pages'></ol>";
        
        // Display the HTML fragment in Visio Web Access Web Part.
        vwaControl.displayCustomMessage(htmlBuilder);

        // Add DOM nodes (HTML content) in the displayed HTML fragment for each page in the Web Drawing.
        for (var i = 0; i < pageCount; i++){
            // Get page ID from array of pages IDs.
            vwaPageId = vwaPages[i];

            // Create a new list item element and text for the list item.
            var newNode = document.createElement("li");
            var newText = document.createTextNode(vwaPageId);
            
            // Append new nodes to the displayed HTML fragment. 
            newNode.appendChild(newText);
            document.getElementById("pages").appendChild(newNode);

            // Add a new text node if the page is currently displayed in Web Drawing.
            if (vwaPageName == vwaPageId){
                var activeText = document.createTextNode(" (Current)");
                newNode.appendChild(activeText);
            }

            // Set the id attribute for list item to the ID of the VwaPage object and set callback for the onclick event.
            newNode.setAttribute("id", vwaPageId);
            newNode.setAttribute("onclick", "javascript:setPage(this)");

        }
    }
    catch(err){
        alert(err);
    }
}

// Go to the page in the list clicked by the user and dismiss the displayed message.
function setPage(callingNode) {
    try {
    
        // Dismiss the custom HTML message.
        vwaControl.hideCustomMessage();
        isPageSet = true;

        // Get id from calling DOM node and set the corresponding page.
        vwaControl.setActivePage(callingNode.id);
    }
    catch(err) {
        alert(err);
    }
}

</script>

See also

Reference

Vwa.Page Class

Vwa.Page Class Methods