Hub.onheaderinvoked event

Raised when the user clicks on an interactive header.

Syntax

<div 
    data-win-control="WinJS.UI.Hub" 
    data-win-options="{onheaderinvoked : handler}">
</div>
function handler(eventInfo) { /* Your code */ }

// addEventListener syntax
hub.addEventListener("headerinvoked", handler);
hub.removeEventListener("headerinvoked", handler);

Event information

Synchronous No
Bubbles Yes
Cancelable Yes

Event handler parameters

  • eventInfo
    Type: CustomEvent**

    An object that contains information about the event. The detail property of this object contains the following sub-properties:

    • detail.index
      The index of the header that the user clicked.

    • detail.section
      The HubSection that contains the header that the user clicked.

Remarks

Setting event handlers declaratively (in HTML)

To set the event handler declaratively, it must be accessible to the global scope, and you must also call WinJS.Utilities.markSupportedForProcessing or WinJS.UI.eventHandler on the handler. You can make the handler accessible to the global scope by using WinJS.Namespace.define. For more information, see How to set event handlers declaratively.

Requirements

Minimum WinJS version

WinJS 2.0

Namespace

WinJS.UI

See also

Hub

HubSection

AppBar

NavBar

BackButton

Your first app - Part 3: PageControl objects and navigation

Quickstart: Using a hub control for layout and navigation

Navigating between pages (HTML)

Adding app bars

Adding nav bars

HTML Hub control sample

HTML AppBar control sample

HTML NavBar control sample

Navigation and navigation history sample

Designers

Command patterns

Navigation patterns

Hub

Guidelines for the hub control