Why is Handlebarsjs template missing jquery mobile CSS styles?

Question

I'm using Handlebarsjs inside a jquery mobile page and when I get the data posted back from the server, it gets inserted into the template ... but none of the jquery mobile CSS styles are applied to the code inside the template.

My template looks like this:

            <script id="card_list_template" type="text/x-handlebars-template">
            {{#each this}}
            <li>
                <a href="#">
                    <img src="{{path}}" />
                    <h3>{{first_name}}&nbsp;{{last_name}}</h3>
                    <p>Card Owner:&nbsp;{{user_id}}</p>
                </a>
            </li>
            {{/each}}
        </script>

The above code block is inserted into this unordered list:

<ul id="search_results" data-role="listview" data-theme="a">

The data-role="listview" is supposed to apply a certain style to the list items, but it's not working for the items generated through the template.

possible duplicate of jQuery Mobile does not apply styles after dynamically adding content — mu is too short
– mu is too short, Commented Jul 29, 2012 at 9:06

Baz · Accepted Answer · 2012-11-12 21:08:52Z

9

If you call .trigger('create') on the element it should apply the styles.

Example:

var template = Handlebars.compile(source);
var html = template(output);
$('#handlebarsData').html(html);
// Applies jQuery Mobile styles
$('#handlebarsData').trigger('create');

edited Nov 12, 2012 at 21:08

Baz

37k11 gold badges75 silver badges101 bronze badges

answered Nov 12, 2012 at 20:52

rickdmer

1,14712 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Carter · Accepted Answer · 2013-03-28 10:13:00Z

0

.trigger('create')

didn't help me with unordered list. But

$('ul').listview('refresh');

did.

answered Mar 28, 2013 at 10:13

Carter

10.9k12 gold badges65 silver badges79 bronze badges

Collectives™ on Stack Overflow

Why is Handlebarsjs template missing jquery mobile CSS styles?

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related