Sys.UI.DomElement getVisibilityMode Method

Returns a value that represents the layout characteristics of a DOM element when it is hidden by invoking the Sys.UI.DomElement.setVisible method. This member is static and can be invoked without creating an instance of the class.

var v = Sys.UI.DomElement.getVisibilityMode(element);

Parameters

Term

Definition

element

The target DOM element.

Returns

A Sys.UI.VisibilityMode enumeration value that indicates the layout characteristics of element when it is hidden by invoking the setVisible method.

Remarks

Use the getVisibilityMode method to determine the layout characteristics of a DOM element when the element hidden by invoking the setVisible method. For example, if value is Sys.UI.VisibilityMode.hide, the element occupies space when the setVisible method is invoked to hide the element.

For information about how to set the layout characteristics of hidden DOM elements, see Sys.UI.DomElement setVisibilityMode Method.

Example

The following example shows how to use the getVisibilityMode method.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "https://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<script runat="server">

</script>

<html xmlns="https://www.w3.org/1999/xhtml">

<head id="Head1" runat="server">
  <title>Example of getVisibilityMode Method</title>
</head>
<body>
  <form id="form1" runat="server">
  <asp:ScriptManager ID="ScriptManager1" runat="server" EnableScriptGlobalization="true" />
  <asp:UpdatePanel ID="UpdatePanel1" 
    runat="server" 
    ChildrenAsTriggers="False" 
    UpdateMode="Conditional">
    <ContentTemplate>
      <asp:Panel ID="Panel1" 
          runat="server" 
          GroupingText="Update Panel">
        <br />
        <asp:Label ID="Label1" 
          runat="server" 
          BackColor="Blue" 
          ForeColor="White" 
          Text="Label1"></asp:Label>
        <p></p>
        <asp:Button ID="Button1" 
          runat="server" 
          Text="Toggle Visibility of Label1" />
        <asp:Button ID="Button2" 
          runat="server" 
          Text="Toggle VisibilityMode of Label1" />
      </asp:Panel>
      </ContentTemplate>
    </asp:UpdatePanel>
  </form>
</body>
</html>

<script type="text/javascript">
    // Add handlers using the $get shortcut to the 
    //Sys.UI.DomElement.getElementById method
    $addHandler($get("Button1"), "click", toggleVisible);
    $addHandler($get("Button2"), "click", toggleVisibilityMode);
    
    // Method called when Button2 is clicked
    function toggleVisible() {
        var anElement = $get("Label1");
        if (Sys.UI.DomElement.getVisible(anElement)){
             Sys.UI.DomElement.setVisible(anElement, false);  
        }
        else{
             Sys.UI.DomElement.setVisible(anElement, true);  
        }
    }
    
    // This method is called when Button1 is clicked.
    function toggleVisibilityMode() {
        var anElement = $get("Label1");
        var visMode = Sys.UI.DomElement.getVisibilityMode(anElement); 
        var status = visMode
         
        if (visMode === 0){
           Sys.UI.DomElement.setVisibilityMode(anElement, 
               Sys.UI.VisibilityMode.collapse); 
           if (document.all)
           {
                anElement.innerText = 
                "Label1  VisibilityMode: Sys.UI.VisibilityMode.collapse";
            }
            else{
                //Firefox
                anElement.textContent = 
                "Label1  VisibilityMode: Sys.UI.VisibilityMode.collapse";
            }
        }
        else{
           Sys.UI.DomElement.setVisibilityMode(anElement, 
               Sys.UI.VisibilityMode.hide); 
           if (document.all)
           {
                anElement.innerText = 
                "Label1  VisibilityMode: Sys.UI.VisibilityMode.hide";
           }
           else{
               //Firefox
               anElement.textContent = 
               "Label1  VisibilityMode: Sys.UI.VisibilityMode.hide";
           }
        }
    }

</script>

See Also

Reference

Sys.UI.DomElement Class

Other Resources

Language Reference