nshah
nshah

Reputation: 597

jQuery Mobile Buttons not appended properly

I am trying to append buttons to a header if a case is true, but it ends up looking like this: enter image description here

The edit and new event buttons are supposed to be a control group...

HTML

<div data-role="header">
<h1 class="ui-title" role="heading" id="hdr"></h1>
<div class="ui-btn-right" id ="addbuttons" data-role="controlgroup" data-type="horizontal">
</div>
</div>

JAVASCRIPT

$('#addbuttons').append('<div data-role="button" data-icon="gears" data-theme="b">Edit</div>');
$('#addbuttons').append('<div data-role="button" data-icon="plus" data-theme="b">New Event</div>');

Upvotes: 0

Views: 75

Answers (1)

Omar
Omar

Reputation: 31732

Whenever you do any changes to header or footer, you need to re-enhance the markup this way.

$('[data-role=page]').trigger('pagecreate');

You also can use this,

$('[data-role=header]').trigger('create');

Upvotes: 2

Related Questions