Geek Answers Handbook

Jquerymobile back button not showing in title

I am trying to make a mobile site in MVC , I am new to jquerymobile, I copied the following code from a JQM tutorial and pasted it into View in MVC

 <div data-role="page" id="home"> <div data-role="header"> <h1>Home</h1> </div> <div data-role="content"> <p><a href="#about" data-role="button">About this app</a></p> </div> </div> <div data-role="page" id="about"> <div data-role="header"> <h1>About This App</h1> </div> <div data-role="content"> <p>This app rocks! <a href="#home" data-role="button">Go home</a></p> </div> </div>

My problem is that it shows the back button on header in the demo where I copied the code from, but when I ran it, the back button is not there can anyone tell me why this happened?

+7
source share
3 answers

Try putting the following attribute on your "page" div:

 data-add-back-btn="true"

eg.

 <div data-role="page" id="home" data-add-back-btn="true">
+15
source

EDIT:
OK JQM has this function, but it is disabled by default, however you can enable it by setting addBackBtn to true or by adding the data-add-back-btn="true" attribute to the page div.

http://jquerymobile.com/demos/1.1.0/docs/toolbars/docs-headers.html - adding return buttons.

In general, if you want the back button, you simply use the data-rel="back" attribute, and if you want it to appear in the header, you need to add it there.

 <div data-role="page"> <div data-role="header"> <a href="#" data-rel="back">back</a> <h1> Title of page </h1> </div> <div data-role="content"> </div> <div data-role="footer"><h1>Footer </h1></div> </div>
+6
source

This is for version 1.4.4 and higher

 <div data-role="header" > <h1>PAGE_NAME</h1> <a href="#" data-rel="back" class="ui-btn-left ui-btn ui-icon-back ui-btn-icon-notext ui-shadow ui-corner-all" data-role="button" role="button">Back</a> </div>
+2
source

More articles:


All Articles