CODEWITHSUNDEEP
jquery-mobile
Phillip Senn
Phillip Senn

Reputation: 47625

I can't get data-add-back-btn to work

This code is not producing a Previous button:

<div data-role="page" data-add-back-btn="true" data-back-btn-text="Previous">
    <div data-role="header">
        <h1>My Header</h1>
    </div>
</div>

Upvotes: 2

Views: 2893

Answers (2)

Roy Calderon
Roy Calderon

Reputation: 6371

Actually to get the data-add-back-btn="true" work in latest version of jQuery Mobile 1.4, it should be at the header of the second page.

<div data-role="page" id="2ndPage">
  <div data-role="header" data-add-back-btn="true" data-back-btn-text="Previous!">
    <h1>HEADER</h1>
  </div>
  <div data-role="content">
         hi
  </div>
  <div data-role="footer">
    <p>FOOTER</p>
  </div>
</div>

Upvotes: 4

Omar
Omar

Reputation: 31732

jQuery Mobile >= 1.4: https://stackoverflow.com/a/20065246/1771795

Adding data-add-btn-back to single page won't generate a button as there is no page before it in DOM nor in navigation history.

If you make two pages, it will appear on the next page.

<!-- page -->
<div data-role="page">
 <div data-role="header">
    <h1>My Header</h1>
</div>
<a href='#p1'>page 2</a>
</div>

<!-- another page -->
<div data-role="page" data-add-back-btn="true" data-back-btn-text="Previous" id='p1'>
  <div data-role="header">
    <h1>My Header</h1>
 </div>
</div>

Demo: http://jsfiddle.net/uJz3E/1/

Upvotes: 2

Related Questions