Joe Bohen
Posts: 0
Joined: Wed Nov 28, 2012 11:28 am

Hide Header and Footer via code

Hi,

I want to hide the header and footer via code and cannot figure out the correct approach. I have tried:

$("joblist").fixedtoolbar('hide');

This does not through an error but the header and footer remains visible. What is the correct method.

Regards,
Joe

Maryna Brodina
Posts: 0
Joined: Thu Apr 05, 2012 7:27 am

Hide Header and Footer via code

Try this JS on screen Load:

code$('.mobileHeader').remove();
$(".ui-page").triggerHandler('updatelayout');/code

Joe Bohen
Posts: 0
Joined: Wed Nov 28, 2012 11:28 am

Hide Header and Footer via code

Hi Marina,

I wish to hide the headers when displaying a html panel and then re-show the headers when the the panel is closed. The panel is shown from a custom java script file.

Regards,
Joe

Maryna Brodina
Posts: 0
Joined: Thu Apr 05, 2012 7:27 am

Hide Header and Footer via code

Could you post JS which you use to show the panel?

Joe Bohen
Posts: 0
Joined: Wed Nov 28, 2012 11:28 am

Hide Header and Footer via code

Hi, I have some javascript that validates user input, if the user has completed the required input the page loads as normal and I wish to show the headers and footers if the validation fails all page content is hidden and the panel is displayed by simply using Tiggr('infopnl').show();

Maryna Brodina
Posts: 0
Joined: Thu Apr 05, 2012 7:27 am

Hide Header and Footer via code

Got it. I'll update.

Maryna Brodina
Posts: 0
Joined: Thu Apr 05, 2012 7:27 am

Hide Header and Footer via code

To gide the header use next JS:

code$(".mobileHeader").hide();
$(".ui-page").css('padding-top', '0px');/code

to show the header:

code$(".mobileHeader").show();
$(".ui-page").trigger('updatelayout');/code

Joe Bohen
Posts: 0
Joined: Wed Nov 28, 2012 11:28 am

Hide Header and Footer via code

Hi Marina,

No luck I'm afraid I tried the code in the load event and it ran but it did not change the header/footer.

Code: Select all

     var driv = $('#txtdriver').val(); 

var mob = $('#txtel').val();
var reg = $('#txtreg').val();
if (driv == '' mob == '' reg == '' ) {
$(".mobileHeader").hide();
$(".ui-page").css('padding-top', '0px');
console.log('loaded');
}

form chrome developer;

.ui-header-fixed, .ui-footer-fixed {
left: 0;
right: 0;
width: 100%;
position: fixed;
z-index: 1000;
}

Maryna Brodina
Posts: 0
Joined: Thu Apr 05, 2012 7:27 am

Hide Header and Footer via code

Try to use "Page Show" event instead of "Load"

Kateryna Grynko
Posts: 0
Joined: Thu Nov 15, 2012 9:13 am

Hide Header and Footer via code

Hello!

To hide footer and header try following code:
codeTiggzi("mobileheader1").hide();
Tiggzi("mobilefooter1").hide();
$(".ui-page").triggerHandler('updatelayout');/code
To show them use:
codeTiggzi("mobileheader1").show();
Tiggzi("mobilefooter1").show();
$(".ui-page").triggerHandler('updatelayout');/code
mobileheader1 and mobilefooter1 are the names of header and footer components (Name from Properties).

Return to “Issues”