Page 1 of 3

Hide Header and Footer via code

Posted: Wed Jan 23, 2013 9:41 am
by Joe Bohen

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


Hide Header and Footer via code

Posted: Wed Jan 23, 2013 11:17 am
by Maryna Brodina

Try this JS on screen Load:

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


Hide Header and Footer via code

Posted: Wed Jan 23, 2013 11:44 am
by Joe Bohen

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


Hide Header and Footer via code

Posted: Wed Jan 23, 2013 12:00 pm
by Maryna Brodina

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


Hide Header and Footer via code

Posted: Wed Jan 23, 2013 12:09 pm
by Joe Bohen

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();


Hide Header and Footer via code

Posted: Wed Jan 23, 2013 12:46 pm
by Maryna Brodina

Got it. I'll update.


Hide Header and Footer via code

Posted: Wed Jan 23, 2013 1:26 pm
by Maryna Brodina

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


Hide Header and Footer via code

Posted: Wed Jan 23, 2013 2:29 pm
by Joe Bohen

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;
}


Hide Header and Footer via code

Posted: Wed Jan 23, 2013 3:18 pm
by Maryna Brodina

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


Hide Header and Footer via code

Posted: Wed Jan 23, 2013 5:40 pm
by Kateryna Grynko

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).