Navigation Navbar

Responsive header for branding, navigation and more.

How To

Step 1: Include LambdaEx Framework in Logi Info Application. Include LambdaEx Framework in Logi Info Application.

Step 2: Include Icon Support Files in Logi Info Application Include Icon Support Files in Logi Info Application
Include Bootstrap in Logi Info Application x
Logi XML
<StyleSheet StyleSheet="Fonts.combined.css" />
<StyleSheet StyleSheet="Fonts.combined.css" />
Download interrupted? Click here to start download.

Navbar Example

<Division Class="navbar navbar-expand-md navbar-light bg-light" HtmlDiv="True">
  <Label Caption="Brand" Class="navbar-brand" HtmlTag="a">
    <EventHandler DhtmlEvent="href">
      <Action Javascript="void(0)" Type="Javascript" />
    </EventHandler>
  </Label>
  <Division Class="navbar-toggler">
    <Label Class="navbar-toggler-icon" />
  </Division>
  <Division Class="collapse navbar-collapse" HtmlDiv="True" ID="collapsable">
    <DataList Class="navbar-nav mr-auto" ID="ulNavbar" Ordered="False">
      <DataLayer ID="dlNavigation" Type="Static">
        <StaticDataRow Caption="Home" class="active" />
        <StaticDataRow Caption="Link" class="" />
        <StaticDataRow Caption="Disabled" class="" lnkClass="disabled" />
      </DataLayer>
      <ListItem Class="nav-item [at]Data.class[tilde]">
        <Label Caption="[at]Data.Caption[tilde]" Class="nav-link [at]Data.lnkClass[tilde]" HtmlTag="a">
          <EventHandler DhtmlEvent="href">
            <Action Javascript="void(0)" Type="Javascript" />
          </EventHandler>
        </Label>
      </ListItem>
    </DataList>
    <Division Class="form-inline " HtmlDiv="True">
      <InputText Class="form-control form-control-sm mr-sm-2" ID="txtSearch" Placeholder="Search" />
      <Label Caption="Search" Class="btn btn-outline-success my-2 my-sm-0" HtmlTag="a">
        <EventHandler DhtmlEvent="href">
          <Action Javascript="void(0)" Type="Javascript" />
        </EventHandler>
      </Label>
    </Division>
  </Division>
</Division>

/*START INCLUDE SCRIPT ELEMENT...*/
$('.navbar-toggler:not([attr=\'data-toggle\'])').each(function() {
   $(this).attr('data-toggle', 'collapse').attr('data-target', '#'+$(this).next('.collapse').attr('id'));
});
/*...END INCLUDE SCRIPT*/

Simple Navbar Example

<Division Class="navbar navbar-expand-lg navbar-light bg-light" HtmlDiv="True">
  <Label Caption="Brand" Class="navbar-brand" HtmlTag="a">
    <EventHandler DhtmlEvent="href">
      <Action Javascript="void(0)" Type="Javascript" />
    </EventHandler>
  </Label>
</Division>
<Division Class="navbar navbar-expand-lg navbar-light bg-light" HtmlDiv="True">
  <Division Class="navbar-brand" HtmlDiv="True">
    <Image Caption="..." Class="d-inline-block align-top" />
  </Division>
  <Label Caption="Brand Image With Text" Class="navbar-text" />
</Division>

Link Example

<Division Class="navbar navbar-expand-lg navbar-light bg-light" HtmlDiv="True">
  <Label Caption="Brand" Class="navbar-brand" HtmlTag="a">
    <EventHandler DhtmlEvent="href">
      <Action Javascript="void(0)" Type="Javascript" />
    </EventHandler>
  </Label>
  <Division Class="navbar-toggler">
    <Label Class="navbar-toggler-icon" />
  </Division>
  <Division Class="collapse navbar-collapse" HtmlDiv="True" ID="collapseLink">
    <DataList Class="navbar-nav mr-auto" ID="ulLinks" Ordered="False">
      <DataLayer ID="dlLinks" Type="Static">
        <StaticDataRow Caption="Home" class="active" />
        <StaticDataRow Caption="Link" class="" />
        <StaticDataRow Caption="Disabled" class="" lnkClass="disabled" />
      </DataLayer>
      <ListItem Class="nav-item [at]Data.class[tilde]">
        <Label Caption="[at]Data.Caption[tilde]" Class="nav-link [at]Data.lnkClass[tilde]" HtmlTag="a">
          <EventHandler DhtmlEvent="href">
            <Action Javascript="void(0)" Type="Javascript" />
          </EventHandler>
        </Label>
      </ListItem>
    </DataList>
  </Division>
</Division>

/*START INCLUDE SCRIPT ELEMENT...*/
$('.navbar-toggler:not([attr=\'data-toggle\'])').each(function() {
   $(this).attr('data-toggle', 'collapse').attr('data-target', '#'+$(this).next('.collapse').attr('id'));
});
/*...END INCLUDE SCRIPT*/

Dropdown and Search

<Division Class="navbar navbar-expand-lg navbar-light bg-light justify-content-between" HtmlDiv="True">
  <Label Caption="Brand" Class="navbar-brand" HtmlTag="a">
    <EventHandler DhtmlEvent="href">
      <Action Javascript="void(0)" Type="Javascript" />
    </EventHandler>
  </Label>
  <Division Class="navbar-nav mr-auto" HtmlDiv="True">
    <Division Class="nav-item dropdown" HtmlDiv="True">
      <Label Caption="Dropdown" Class="nav-link dropdown-toggle" Format="HTML" HtmlTag="a">
        <EventHandler DhtmlEvent="href">
          <Action Javascript="$(this).next().toggleClass('show');" Type="Javascript" />
        </EventHandler>
      </Label>
      <Division Class="dropdown-menu dropdown-menu-right" HtmlDiv="True">
        <Label Caption="Action" Class="dropdown-item" HtmlTag="a">
          <EventHandler DhtmlEvent="href">
            <Action Javascript="void(0);" Type="Javascript" />
          </EventHandler>
        </Label>
        <Label Caption="Something else here" Class="dropdown-item" HtmlTag="a">
          <EventHandler DhtmlEvent="href">
            <Action Javascript="void(0);" Type="Javascript" />
          </EventHandler>
        </Label>
        <Division Class="dropdown-divider" HtmlDiv="True" />
        <Label Caption="Separated link" Class="dropdown-item" HtmlTag="a">
          <EventHandler DhtmlEvent="href">
            <Action Javascript="void(0);" Type="Javascript" />
          </EventHandler>
        </Label>
      </Division>
    </Division>
  </Division>
  <Division Class="form-inline" HtmlDiv="True">
    <InputText Class="form-control mr-sm-2" ID="txtSearch" Placeholder="Search" />
    <Label Caption="Search" Class="btn btn-outline-success my-2 my-sm-0" HtmlTag="a">
      <EventHandler DhtmlEvent="href">
        <Action Javascript="void(0)" Type="Javascript" />
      </EventHandler>
    </Label>
  </Division>
</Division>

/*START INCLUDE SCRIPT ELEMENT...*/
$('.dropdown-toggle:not([attr=\'data-toggle\'])').attr('data-toggle', 'dropdown');
/*...END INCLUDE SCRIPT*/

<Division Class="navbar navbar-expand-lg navbar-light bg-light justify-content-between" HtmlDiv="True"> <Label Caption="Brand" Class="navbar-brand" HtmlTag="a"> <EventHandler DhtmlEvent="href"> <Action Javascript="void(0)" Type="Javascript" /> </EventHandler> </Label> <Division Class="navbar-nav mr-auto" HtmlDiv="True"> <Division Class="nav-item dropdown" HtmlDiv="True"> <Label Caption="Dropdown <span class='caret'></span>" Class="nav-link dropdown-toggle" Format="HTML" HtmlTag="a" ID="navbarTheme"> <EventHandler DhtmlEvent="href"> <Action Javascript="$(this).next().toggleClass('show');" Type="Javascript" /> </EventHandler> </Label> <Division Class="dropdown-menu dropdown-menu-right" HtmlDiv="True"> <Label Caption="Action" Class="dropdown-item" HtmlTag="a"> <EventHandler DhtmlEvent="href"> <Action Javascript="void(0);" Type="Javascript" /> </EventHandler> </Label> <Label Caption="Something else here" Class="dropdown-item" HtmlTag="a"> <EventHandler DhtmlEvent="href"> <Action Javascript="void(0);" Type="Javascript" /> </EventHandler> </Label> <Division Class="dropdown-divider" HtmlDiv="True" /> <Label Caption="Separated link" Class="dropdown-item" HtmlTag="a"> <EventHandler DhtmlEvent="href"> <Action Javascript="void(0);" Type="Javascript" /> </EventHandler> </Label> </Division> <IncludeScript IncludedScript="$('.dropdown-toggle:not([attr=\'data-toggle\'])').attr('data-toggle', 'dropdown');" /> </Division> </Division> <Division Class="form-inline" HtmlDiv="True"> <InputText Class="form-control mr-sm-2" ID="txtSearch" Placeholder="Search" /> <Label Caption="Search" Class="btn btn-outline-success my-2 my-sm-0" HtmlTag="a"> <EventHandler DhtmlEvent="href"> <Action Javascript="void(0)" Type="Javascript" /> </EventHandler> </Label> </Division> </Division>

Text

<Division Class="navbar navbar-expand-lg navbar-light bg-light" HtmlDiv="True">
  <Label Caption="Brand" Class="navbar-brand" HtmlTag="a" />
  <Label Caption="Signed in as Admin" Class="navbar-text" />
</Division>

Fixed Top

Add .navbar-fixed-top and include a .container or .container-fluid to center and pad navbar content.

<Division Class="navbar fixed-top navbar-light bg-light" HtmlDiv="True">
  <Label Caption="Top" Class="navbar-brand" />
</Division>

Fixed Bottom

Add .navbar-fixed-bottom and include a .container or .container-fluid to center and pad navbar content.

<Division Class="navbar fixed-bottom navbar-light bg-light" HtmlDiv="True">
  <Label Caption="Bottom" Class="navbar-brand" />
</Division>

Containers

Include .container or .container-fluid to center and pad navbar content.

<Division Class="navbar navbar-light bg-light" HtmlDiv="True">
  <Division Class="container" HtmlDiv="True">
    <Label Caption="container" Class="navbar-brand" />
  </Division>
</Division>
<Division Class="navbar navbar-light bg-light" HtmlDiv="True">
  <Division Class="container-fluid d-block" HtmlDiv="True">
    <Label Caption="container-fluid" Class="navbar-brand" />
  </Division>
</Division>

Offsetting

Use margin utilities like .mr-auto and .ml-auto to force sibling columns away from one another.

<Division Class="navbar bg-light navbar-expand-lg" HtmlDiv="True">
  <Label Caption="Brand" Class="navbar-brand" HtmlTag="Div" />
  <Label Caption="..." Class="navbar-text ml-auto" Format="HTML" HtmlTag="Div" />
</Division>
<Division Class="navbar navbar-light bg-light navbar-expand-lg" HtmlDiv="True">
  <Label Caption="Brand" Class="navbar-brand mr-auto" />
  <Label Caption="..." Class="navbar-text" Format="HTML" />
</Division>

<Division Class="navbar bg-light navbar-expand-lg" HtmlDiv="True"> <Label Caption="Brand" Class="navbar-brand" HtmlTag="Div" /> <Label Caption="Use <code>.ml-auto</code> to move one item to the right" Class="navbar-text ml-auto" Format="HTML" HtmlTag="Div" /> </Division> <Division Class="navbar navbar-light bg-light navbar-expand-lg" HtmlDiv="True"> <Label Caption="Brand" Class="navbar-brand mr-auto" /> <Label Caption="<code>.mr-auto</code> with <code>.nav-brand</code>" Class="navbar-text" Format="HTML" /> </Division>

Color schemes

Theming the navbar has never been easier thanks to the combination of theming classes and background-color utilities. Choose from .navbar-light for use with light background colors, or .navbar-dark for dark background colors. Then, customize with .bg-* utilities.

<Division Class="navbar navbar-light bg-light" HtmlDiv="True">
  <Label Caption="Faded" Class="navbar-brand" />
</Division>
<Division Class="navbar navbar-inverse bg-inverse" HtmlDiv="True">
  <Label Caption="Inverse" Class="navbar-brand" />
</Division>
<Division Class="navbar navbar-dark bg-primary" HtmlDiv="True">
  <Label Caption="Primary" Class="navbar-brand" />
</Division>
<Division Class="navbar navbar-dark bg-info" HtmlDiv="True">
  <Label Caption="Info" Class="navbar-brand" />
</Division>
<Division Class="navbar navbar-dark bg-success" HtmlDiv="True">
  <Label Caption="Success" Class="navbar-brand" />
</Division>
<Division Class="navbar navbar-dark bg-warning" HtmlDiv="True">
  <Label Caption="Warning" Class="navbar-brand" />
</Division>
<Division Class="navbar navbar-dark bg-danger" HtmlDiv="True">
  <Label Caption="Danger" Class="navbar-brand" />
</Division>

Responsive Behaviors

Navbars can utilize .navbar-toggler, .navbar-collapse, and .navbar-expand-lg-{sm|md|lg|xl} classes to change when their content collapses behind a button. In combination with other utilities, you can easily choose when to show or hide particular elements.

For navbars that never collapse, add the .navbar-expand-lg class on the navbar. For navbars that always collapse, don’t add any .navbar-expand-lg class.

<Division Class="navbar navbar-light bg-light" HtmlDiv="True">
  <Division Class="navbar-toggler">
    <Label Class="navbar-toggler-icon" />
  </Division>
  <Division Class="collapse navbar-collapse" HtmlDiv="True" ID="Responsive">
    <DataList Class="navbar-nav mr-auto" ID="ulResponsive" Ordered="False">
      <DataLayer ID="dlNavigation" Type="Static">
        <StaticDataRow Caption="Home" class="active" />
        <StaticDataRow Caption="Link" class="" />
        <StaticDataRow Caption="Disabled" class="" lnkClass="disabled" />
      </DataLayer>
      <ListItem Class="nav-item [at]Data.class[tilde]">
        <Label Caption="[at]Data.Caption[tilde]" Class="nav-link [at]Data.lnkClass[tilde]" HtmlTag="a">
          <EventHandler DhtmlEvent="href">
            <Action Javascript="void(0)" Type="Javascript" />
          </EventHandler>
        </Label>
      </ListItem>
    </DataList>
  </Division>
</Division>

/*START INCLUDE SCRIPT ELEMENT...*/
$('.navbar-toggler:not([attr=\'data-toggle\'])').each(function() {
   $(this).attr('data-toggle', 'collapse').attr('data-target', '#'+$(this).next('.collapse').attr('id'));
});
/*...END INCLUDE SCRIPT*/

Navigation Header+Sidebar+Footer

<Division Class="master-content" HtmlDiv="True" ID="Master">
  <Division Class="nav-sidebar navbar-dark Closed" HtmlDiv="True" ID="Sidebar" ShowModes="rdBrowser">
    <Division Class="nav-sidebar-content" HtmlDiv="True">
      <Division Class="nav-sidebar-wrapper" HtmlDiv="True">
        <RepeatElements ID="reMenu">
          <DataLayer ID="dlReports" Type="Static">
            <StaticDataRow Caption="Home" icon="fa fa-home" Report="Default" ReportID="Default" />
            <StaticDataRow Caption="Dropdown" icon="fa fa-check-square-o" Report="" ReportID="Dropdown" />
            <CalculatedColumn Formula="if(('[at]Request.rdReport[tilde]' == '' &amp;&amp; ('[at]Data.ReportID[tilde]' == 'Default' || '[at]Data.ReportID[tilde]' == 'GettingStarted')) &#xD;&#xA;	|| ('[at]Data.Report[tilde]' != '' &amp;&amp; '[at]Request.rdReport[tilde]' == '[at]Data.Report[tilde]')) {&#xD;&#xA;	'active';&#xD;&#xA;}&#xD;&#xA;else {&#xD;&#xA;	'';&#xD;&#xA;}" ID="ActiveClass" />
          </DataLayer>
          <Division Class="dropdown" Condition="'[at]Repeat.Report[tilde]' == ''" HtmlDiv="True" ID="DropDown">
            <Division Class="report-caption">
              <Label Class="[at]Repeat.icon[tilde] fa-fw" HtmlTag="I" ID="icon" />
              <Label Caption="[at]Repeat.Caption[tilde]" />
              <Label Class="fa fa-angle-right expand-sub fa-fw" HtmlTag="I" />
              <Action Javascript="$(this).parent('.dropdown').toggleClass('open').find('.expand-sub').toggleClass('fa-angle-right fa-angle-down');" Type="Javascript" />
            </Division>
            <DataList ID="dlstSubReports[at]Repeat.ReportID[tilde]" Ordered="False">
              <DataLayer ID="dlReports[at]Repeat.ReportID[tilde]" Type="Static">
                <StaticDataRow Caption="Example 1" icon="" Parent="Dropdown" Report="Default" />
                <StaticDataRow Caption="Example 2" icon="" Parent="Dropdown" Report="Default" />
                <CompareFilter CompareType="=" CompareValue="[at]Repeat.ReportID[tilde]" DataColumn="Parent" ID="compReportParent" />
                <CalculatedColumn Formula="if(('[at]Request.rdReport[tilde]' == '' &amp;&amp; '[at]Data.Report[tilde]' == 'Default') || ('[at]Data.Report[tilde]' != '' &amp;&amp; '[at]Request.rdReport[tilde]' == '[at]Data.Report[tilde]')) {&#xD;&#xA;	'active';&#xD;&#xA;}&#xD;&#xA;else {&#xD;&#xA;	'';&#xD;&#xA;}" ID="ActiveClass" />
              </DataLayer>
              <ListItem Class="report-caption [at]Data.ActiveClass[tilde]">
                <Division Condition="'[at]Data.Report[tilde]' != ''" ID="Report">
                  <Label Class="[at]Data.icon[tilde]" HtmlTag="I" ID="icon" />
                  <IncludeHtml Html="[at]Data.Caption[tilde]" />
                  <Action CrawlerFriendly="True" Type="Link">
                    <Target Link="./rdPage.aspx?rdReport=[at]Data.Report[tilde]" Type="Link" NoQuestionMark="True" />
                  </Action>
                </Division>
                <Division Condition="'[at]Data.Link[tilde]' != ''" ID="LinkTo">
                  <Label Class="[at]Data.icon[tilde]" HtmlTag="I" ID="icon" />
                  <IncludeHtml Html="[at]Data.Caption[tilde]" />
                  <Action Type="Link">
                    <Target FrameID="NewWindow" Link="[at]Data.Link[tilde]" Type="Link" />
                  </Action>
                </Division>
              </ListItem>
            </DataList>
          </Division>
          <Division Class=" [at]Repeat.ActiveClass[tilde]" Condition="'[at]Repeat.Report[tilde]' != ''" HtmlDiv="True" ID="LinkTo">
            <Division Class="report-caption">
              <Label Class="[at]Repeat.icon[tilde] fa-fw" HtmlTag="I" ID="icon" />
              <Label Caption="[at]Repeat.Caption[tilde]" />
              <Action CrawlerFriendly="True" Type="Link">
                <Target Link="./rdPage.aspx?rdReport=[at]Repeat.Report[tilde]" Type="Link" NoQuestionMark="True" />
              </Action>
            </Division>
          </Division>
        </RepeatElements>
      </Division>
    </Division>
  </Division>
  <Division Class="navbar navbar-dark fixed-top navbar-expand-md p-0" HtmlDiv="True" ID="Header" ShowModes="rdBrowser">
    <Division Class="sidebar-toggle" ID="SidebarToggler">
      <Label HtmlTag="i" ID="SidebarTogglerIcon" />
      <EventHandler DhtmlEvent="onclick">
        <Action Javascript="$(this).parent().prev().toggleClass('Open Closed');" Type="Javascript" />
      </EventHandler>
    </Division>
    <Division Class="navbar-brand" HtmlDiv="True">
      <Image Caption="Framework.images.logo.png" Height="40" Width="98" />
    </Division>
    <Division Class="navbar-text p-3 hidden-sm-down mr-auto" HtmlDiv="True">
      <Label Caption="App Title" Class="text-nowrap" />
    </Division>
    <Division Class="navbar-collapse collapse" HtmlDiv="True" Condition="'[at]Function.UserName[tilde]' != ''">
      <Division Class="navbar-nav ml-auto" HtmlDiv="True">
        <Division Class="nav-item pull-xs-right" HtmlDiv="True">
          <Label Caption="Logout &lt;I class='fa fa-sign-out'&gt;&lt;/I&gt;" Class="nav-link p-3" Format="HTML" HtmlTag="a">
            <EventHandler DhtmlEvent="href">
              <Action Type="Link">
                <Target Link="rdPage.aspx?rdLogoffRedirect=rdPage.aspx" Type="Link" />
              </Action>
            </EventHandler>
          </Label>
        </Division>
      </Division>
    </Division>
  </Division>
  <Division Class="content-wrapper" HtmlDiv="True" ID="Content">
    <MasterReportContent />
  </Division>
  <Division Class="navbar navbar-dark fixed-bottom bottom py-1" HtmlDiv="True" ID="Footer" ShowModes="rdBrowser">
    <Division Class="navbar-text" HtmlDiv="True" ShowModes="rdBrowser">
      <Label Caption="© Logi Analytics" Format="HTML" />
    </Division>
  </Division>
</Division>

/*START INCLUDE SCRIPT ELEMENT...*/
$(document).ready(function() {
   $('#SidebarMenu div#MenuWrapper ul>li.active').closest('.dropdown').addClass('open').find('i.fa-angle-right').toggleClass('fa-angle-right fa-angle-down');
   $('.sidebar-toggle').click(function() {
      /*Resize visuals when sidebar state changes*/
      setTimeout(function() {
         //Get all charts on the page
         var chartsArray = Highcharts.charts.filter(function(n){ return n != undefined });
         
         //Loop through the array
         $.each(chartsArray,function(i){
            //Update the current chart
            chartsArray[i].reflow();
         });
      }, 300);
   });
   $('.dropdown-toggle:not([attr=\'data-toggle\'])').attr('data-toggle', 'dropdown');
});
/*...END INCLUDE SCRIPT*/

<Division Class="master-content" HtmlDiv="True" ID="Master"> <Division Class="nav-sidebar navbar-dark Closed" HtmlDiv="True" ID="Sidebar" ShowModes="rdBrowser"> <Division Class="nav-sidebar-content" HtmlDiv="True"> <Division Class="nav-sidebar-wrapper" HtmlDiv="True"> <RepeatElements ID="reMenu"> <DataLayer ID="dlReports" Type="Static"> <StaticDataRow Caption="Home" icon="fa fa-home" Report="Default" ReportID="Default" /> <StaticDataRow Caption="Dropdown" icon="fa fa-check-square-o" Report="" ReportID="Dropdown" /> <CalculatedColumn Formula="if(('[at]Request.rdReport[tilde]' == '' && ('[at]Data.ReportID[tilde]' == 'Default' || '[at]Data.ReportID[tilde]' == 'GettingStarted')) 
 || ('[at]Data.Report[tilde]' != '' && '[at]Request.rdReport[tilde]' == '[at]Data.Report[tilde]')) {
 'active';
}
else {
 '';
}" ID="ActiveClass" /> </DataLayer> <Division Class="dropdown" Condition="'[at]Repeat.Report[tilde]' == ''" HtmlDiv="True" ID="DropDown"> <Division Class="report-caption"> <Label Class="[at]Repeat.icon[tilde] fa-fw" HtmlTag="I" ID="icon" /> <Label Caption="[at]Repeat.Caption[tilde]" /> <Label Class="fa fa-angle-right expand-sub fa-fw" HtmlTag="I" /> <Action Javascript="$(this).parent('.dropdown').toggleClass('open').find('.expand-sub').toggleClass('fa-angle-right fa-angle-down');" Type="Javascript" /> </Division> <DataList ID="dlstSubReports[at]Repeat.ReportID[tilde]" Ordered="False"> <DataLayer ID="dlReports[at]Repeat.ReportID[tilde]" Type="Static"> <StaticDataRow Caption="Example 1" icon="" Parent="Dropdown" Report="Default" /> <StaticDataRow Caption="Example 2" icon="" Parent="Dropdown" Report="Default" /> <CompareFilter CompareType="=" CompareValue="[at]Repeat.ReportID[tilde]" DataColumn="Parent" ID="compReportParent" /> <CalculatedColumn Formula="if(('[at]Request.rdReport[tilde]' == '' && '[at]Data.Report[tilde]' == 'Default') || ('[at]Data.Report[tilde]' != '' && '[at]Request.rdReport[tilde]' == '[at]Data.Report[tilde]')) {
 'active';
}
else {
 '';
}" ID="ActiveClass" /> </DataLayer> <ListItem Class="report-caption [at]Data.ActiveClass[tilde]"> <Division Condition="'[at]Data.Report[tilde]' != ''" ID="Report"> <Label Class="[at]Data.icon[tilde]" HtmlTag="I" ID="icon" /> <IncludeHtml Html="[at]Data.Caption[tilde]" /> <Action CrawlerFriendly="True" Type="Link"> <Target Link="./rdPage.aspx?rdReport=[at]Data.Report[tilde]" Type="Link" NoQuestionMark="True" /> </Action> </Division> <Division Condition="'[at]Data.Link[tilde]' != ''" ID="LinkTo"> <Label Class="[at]Data.icon[tilde]" HtmlTag="I" ID="icon" /> <IncludeHtml Html="[at]Data.Caption[tilde]" /> <Action Type="Link"> <Target FrameID="NewWindow" Link="[at]Data.Link[tilde]" Type="Link" /> </Action> </Division> </ListItem> </DataList> </Division> <Division Class=" [at]Repeat.ActiveClass[tilde]" Condition="'[at]Repeat.Report[tilde]' != ''" HtmlDiv="True" ID="LinkTo"> <Division Class="report-caption"> <Label Class="[at]Repeat.icon[tilde] fa-fw" HtmlTag="I" ID="icon" /> <Label Caption="[at]Repeat.Caption[tilde]" /> <Action CrawlerFriendly="True" Type="Report"> <Target Link="./rdPage.aspx?rdReport=[at]Repeat.Report[tilde]" Type="Link" NoQuestionMark="True" /> </Action> </Division> </Division> </RepeatElements> </Division> </Division> </Division> <Division Class="navbar navbar-dark fixed-top navbar-expand-md p-0" HtmlDiv="True" ID="Header" ShowModes="rdBrowser"> <Division Class="sidebar-toggle" ID="SidebarToggler"> <Label HtmlTag="i" ID="SidebarTogglerIcon" /> <EventHandler DhtmlEvent="onclick"> <Action Javascript="$(this).parent().prev().toggleClass('Open Closed');" Type="Javascript" /> </EventHandler> </Division> <Division Class="navbar-brand" HtmlDiv="True"> <Image Caption="Framework.images.logo.png" Height="40" Width="98" /> </Division> <Division Class="navbar-text p-3 hidden-sm-down mr-auto" HtmlDiv="True"> <Label Caption="App Title" Class="text-nowrap" /> </Division> <Division Class="navbar-collapse collapse" HtmlDiv="True" Condition="'[at]Function.UserName[tilde]' != ''"> <Division Class="navbar-nav ml-auto" HtmlDiv="True"> <Division Class="nav-item pull-xs-right" HtmlDiv="True"> <Label Caption="Logout <I class='fa fa-sign-out'></I>" Class="nav-link p-3" Format="HTML" HtmlTag="a"> <EventHandler DhtmlEvent="href"> <Action Type="Link"> <Target Link="rdPage.aspx?rdLogoffRedirect=rdPage.aspx" Type="Link" /> </Action> </EventHandler> </Label> </Division> </Division> </Division> </Division> <Division Class="content-wrapper" HtmlDiv="True" ID="Content"> <MasterReportContent /> </Division> <Division Class="navbar navbar-dark fixed-bottom bottom py-1" HtmlDiv="True" ID="Footer" ShowModes="rdBrowser"> <Division Class="navbar-text" HtmlDiv="True" ShowModes="rdBrowser"> <Label Caption="© Logi Analytics" Format="HTML" /> </Division> </Division> <IncludeScript ID="SetActiveMenuItem" IncludedScript="$(document).ready(function() {
 $('#SidebarMenu div#MenuWrapper ul>li.active').closest('.dropdown').addClass('open').find('i.fa-angle-right').toggleClass('fa-angle-right fa-angle-down');
 $('.sidebar-toggle').click(function() {
 /*Resize visuals when sidebar state changes*/
 setTimeout(function() {
 //Get all charts on the page
 var chartsArray = Highcharts.charts.filter(function(n){ return n != undefined });
 
 //Loop through the array
 $.each(chartsArray,function(i){
 //Update the current chart
 chartsArray[i].reflow();
 });
 }, 300);
 });
 $('.dropdown-toggle:not([attr=\'data-toggle\'])').attr('data-toggle', 'dropdown');
});" /> </Division>