Menu
It's the 3rd June 2011 and I'm using JQuery Mobile's latest version.
My problem is that the back button has gone.
How can I get the back button to show up please?
UPDATE:
I've tried this but still not back button.
<body>
<div data-role="page" data-theme="a" data-iscroll="enable" data-add-back-btn="true">
<div data-role="header" data-theme="a" data-backbtn="true">
<h1>title here</h1>
<a href="index.php" data-icon="home" data-iconpos="notext" data-direction="reverse" class="ui-btn-left jqm-home">Home</a>
<a href="view.php" data-icon="arrow-r" data-theme="a" data-iconpos="right">Events</a>
</div><!-- /header -->
<div data-role="content">
694
If you look at the jQuery mobile blog post in may, the back button is now off by default.
To reenable the back button simply add data-add-back-btn="true" to the page container:
<div data-role="page" id="page1">
<div data-role="header">
<h1>First page</h1>
</div>
<div data-role="content">
<p><a href="#page2">page2</a></p>
</div>
<div data-role="footer">
<h4>Optional footer</h4>
</div>
</div>
<div data-role="page" id="page2" data-add-back-btn="true">
<div data-role="header">
<h1>Second Page</h1>
</div>
<div data-role="content">
<p><a href="#page1">page1</a></p>
</div>
<div data-role="footer">
<h4>Optional footer</h4>
</div>
</div>
Example of the back button on jsfiddle
190
If you're still not seeing it and your markup is all correct, Mark's comment is helpful:
assuming you navigated to another page
I wasn't seeing a back button on the page I was testing when adding the attribute:
data-add-back-btn="true"
It was because there was no browser history on that tab of my browser, thus no chance of a back button. If I navigated to the page I was testing from another page, then I would see the back button.
40
As back button is now turned off by default, you need to turn it on before loading jQuery mobile (and after loading jQuery):
<script type="text/javascript">
$(document).bind("mobileinit", function() {
$.mobile.page.prototype.options.addBackBtn = true;
});
</script>
Also, to prevent back button's sometimes popping up where it shouldn't be, put this:
data-add-back-btn="false"
to page containers on all pages where you don't want to see back button ever.
32
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
