jQuery Mobile - Include Footer from External File
11,439
Solution 1
Assuming that the rest of the code is valid:
$('#footerDiv').load('Shared/Footer.html').trigger("create");
Solution 2
for me, I had to use the callback function, and add it in my pageinit event :
$(document).on('pageinit', function(event){
$("#footerDiv").load('_footer.html', function(){$(this).trigger("create")});
});
Author by
Admin
Updated on June 13, 2022Comments
-
Admin about 2 years
I would like to create a shared footer (e.g. footer.html) that can be used by all of the pages in my jQuery Mobile application. However, I cannot find a way to get jQuery to refresh the styles in the footer navbar after loading the html from the external file. After thoughts would be greatly appreciated.
Footer.html:
<div data-role="navbar" class="CSS" data-grid="d" id="footerNav"> <ul > <li ><a href="#" id="a" data-icon="custom"><div>a</div></a></li> <li ><a href="#" id="b" data-icon="custom"><div>b</div></a></li> <li ><a href="#" id="c" data-icon="custom"><div>c</div></a></li> <li ><a href="#" id="d" data-icon="custom"><div>d</div></a></li> <li ><a href="#" id="e" data-icon="custom"><div>e</div></a></li> </ul> </div>
Index.html:
<div data-role="page" style="position: relative" data-theme="a" id="index"> <div data-role="header"> <div class="homebutton" onclick="location.href='default.html'"> </div> <h1> EVENT CALENDAR</h1> </div> <div data-role="content"> <p> This is a single page boilerplate template that you can copy to build you first jQuery Mobile page. Each link or form from here will pull a new page in via Ajax to support the animated page transitions.</p> </div> <div data-role="footer" class="CSO" data-position="fixed" id="footerDiv"> </div> <script> $('#index').live('pageinit', function (event, ui) { $('#footerDiv').load('Shared/Footer.html'); [Some code to refresh the footer so it gets redrawn by Jquery Mobile] }); </script>
-
vivek tiwari about 11 yearsthanks. but it will remove my all contant and add a footer only. i just want to append the footer. Do you have some idea?
-
Justin T. Watts almost 11 yearsyes the closest still, best answer, but not exactly the right answer.