Xrm.Page.ui tab methods

[Applies to: Microsoft Dynamics CRM 2011]

A tab is a group of sections on a page. It contains methods to manipulate tabs as well as access to sections within the tab through the Sections Collection.

Examples shown below are in the Sample: SDK.TabSamples.js library.

The table below lists all the tab methods.

 

Method Description

getDisplayState

Returns a value that indicates whether the tab is collapsed or expanded.

getLabel

Returns the tab label.

getName

Returns the name of the tab.

getParent

Returns the Xrm.Page.ui object.

getVisible

Returns a value that indicates whether the tab is visible.

setDisplayState

Sets the tab to be collapsed or expanded.

setFocus

Sets the focus on the tab

setLabel

Sets the label for the tab.

setVisible

Sets a value that indicates whether the control is visible.

getDisplayState

Returns a value that indicates whether the tab is collapsed or expanded.

tabObj.getDisplayState()
Return Value
Type: String

Possible values:

  • expanded

  • collapsed

Example:The SDK.TabSamples.toggleTabDisplayState function toggles the display state of every tab.


SDK.TabSamples.toggleTabDisplayState = function () {
 var tabs = Xrm.Page.ui.tabs.get();

 for (var i in tabs) {
  var tab = tabs[i];
  var currentTabState = tab.getDisplayState();
  var newTabState = "";

  if (currentTabState == "expanded") {
   newTabState = "collapsed";
  }
  else if (currentTabState == "collapsed") {
   newTabState = "expanded";
  }

  tab.setDisplayState(newTabState);
 }
};

Methods

getLabel

Returns the tab label.

tabObj.getLabel()
Return Value
Type: String

Example:The SDK.TabSamples.toggleTabLabels function will show or hide a specified prefix for all tabs on the form.


SDK.TabSamples.toggleTabLabels = function (prefix) {
 var tabs = Xrm.Page.ui.tabs.get();
 for (var i in tabs) {
  var tab = tabs[i];
  var currentLabel = tab.getLabel();
  if (currentLabel.substring(0, prefix.length) == prefix) {
   var newLabel = currentLabel.substring(prefix.length);
   tab.setLabel(newLabel);
  }
  else {
   tab.setLabel(prefix + currentLabel);
  }
 }
};

Methods

getName

Returns the name of the tab.

tabObj.getName()
Return Value
Type: String

Methods

getParent

Returns the Xrm.Page.ui object.

tabObj.getParent()
Return Value
Type: Object

Example:The SDK.TabSamples.validateTabParent function demonstrates that the tab.getParent() function returns the Xrm.Page.ui function.


SDK.TabSamples.validateTabParent = function () {
 var firstTab = Xrm.Page.ui.tabs.get(0);
 var tabParent = firstTab.getParent();

 if (tabParent == Xrm.Page.ui) {
  alert("The tab.getParent() function does return the Xrm.Page.ui object.");
 }
 else {
  alert("The tab.getParent() function does not return the Xrm.Page.ui object.");
 }
};

Methods

getVisible

Returns a value that indicates whether the tab is visible.

tabObj.getVisible()
Return Value
Type: Boolean

Example:The SDK.TabSamples.toggleVisibleTabs function hides or reveals all tabs except the first tab on the form each time the event occurs..


SDK.TabSamples.toggleVisibleTabs = function () {
 var tabs = Xrm.Page.ui.tabs.get();
 for (var i in tabs) {
  var tab = tabs[i];
  if (i > 0) {
   if (tab.getVisible()) {
    tab.setVisible(false);
   }
   else {
    tab.setVisible(true);
   }
  }
 }
};

Methods

setDisplayState

Sets the tab to be collapsed or expanded.

tabObj.setDisplayState(string)
Arguments
String

Valid argument values values:

  • expanded

  • collapsed

Example:See SDK.TabSamples.toggleTabDisplayState under getDisplayState above.

Methods

setFocus

Sets the focus on the tab.

tabObj.setFocus()

Example:The SDK.TabSamples.setFocusDemo function will open a new page containing a table with rows for each visible tab. Each row contains a button that will use the window.opener to access the Xrm.Page object to call the setFocus method for the tab in the entity record form.


SDK.TabSamples.setFocusDemo = function () {
 var html = "<!DOCTYPE html ><html lang='en-US' ><head><title>Set focus demo</title>";
 html += "<style type=\"text/css\">body { font-family:Calibri;}";
 html += "table {border:1px solid gray; border-collapse:collapse;}";
 html += "th {text-align:left; border:1px solid gray;}";
 html += "td {border:1px solid gray;}</style>";
 html += "<script type=\"text/javascript\" >";
 html += "function setFocus(index) { ";
 html += "window.opener.Xrm.Page.ui.tabs.get(index).setFocus();";
 html += "}";
 html += "</script>";
 html += "</head><body>";
 html += SDK.TabSamples.buildFocusDemoTable();
 html += "</body></html>";
 var theWindow = window.open("", "_blank", "height=400,width=450,scrollbars=1,resizable=1", false);
 theWindow.document.open();
 theWindow.document.write(html);
 theWindow.document.close();
};

SDK.TabSamples.buildFocusDemoTable = function () {
 var html = "<table summary='This table displays a row for each visible tab. Each row contains a button to call the setFocus method on the tab in the page.'><thead><tr><th scope='col'>Tab Label</th><th scope='col'>Set Focus</th>" +
    "</tr></thead><tbody>";
 var tabs = Xrm.Page.ui.tabs.get();
 for (var i in tabs) {
  var tab = tabs[i];
  //setFocus will cause an error if used on a tabs that is not visible.
  if (tab.getVisible()) {
   var tabLabel = tab.getLabel();

   html += "<tr><td>" + tabLabel +
         "</td><td><input type=\"button\" onclick=\"setFocus(" + i +
          ");\" value='Set Focus on " + tabLabel + "' /></td></tr>";
  }
 }
 html += "</tbody></table>";
 return html;
};

Methods

setLabel

Sets the label for the tab.

tabObj.setLabel(String)
Arguments
String

Example: See SDK.TabSamples.toggleTabLabels under getLabel.

Methods

setVisible

Sets a value that indicates whether the control is visible.

tabObj.setVisible(boolean);
Arguments
Boolean

Example:See the SDK.TabSamples.toggleVisibleTabs function under getVisible.

Methods

The sections collection provides access to sections within the tab. For more information, see Xrm.Page.ui tab.sections Collection.

Microsoft Dynamics CRM 2011
Send comments about this topic to Microsoft.
© 2013 Microsoft Corporation. All rights reserved.

Community Additions

ADD
Show: