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