CODEWITHSUNDEEP
jquerymobileinputjquery-mobilerefresh
Victor Santos
Victor Santos

Reputation: 350

Refresh text input on jQuery Mobile (themes)

I'd like to refresh in an input text after dynamically add the attribute "data-theme".

How can I do this?

I'd like that: http://jsfiddle.net/Sgrve/5/

If I click the "Change Theme", I want to change the color of the input.

Data-theme attribute change but the color don't change.

Upvotes: 0

Views: 10536

Answers (2)

Phill Pafford
Phill Pafford

Reputation: 85308

Live Example:

JS

$('#addContent').append('<input type="text" value="Default Value" id="newContent" />');
alert('Adding Dynamic content/element');

$('#newContent').val('Hello new Value 123');
alert('Changing the value');

$('#home').trigger('create');
alert('Refreshing JQM controls and look');

HTML

<div data-role="page" id="home"> 
    <div data-role="content">
        <div id="addContent">
            <!-- Add Dynamic content here -->
        </div>
    </div>
</div>

UPDATE From your comment

JS

$("#btn1").click(function() {
    $('#txtContent').attr('data-theme','e').removeClass('ui-body-d').addClass('ui-body-e').trigger('create');
});

$("#btn2").click(function() {
    alert("Theme = " + $('#txtContent').attr('data-theme'));
});

HTML

<div data-role="page" id="home"> 
    <div data-role="content">
        <div id="addContent">
            <p><input type="text" value="I want to copy you" data-theme="d" id="txtContent" /></p>
            <p><input type="text" value="Try to look like me" data-theme="e" id="txtContent2" /></p>
            <p><button id="btn1">Change theme</button></p>
            <p><button id="btn2">View theme</button></p>
            <!-- Add Dynamic content here -->
        </div>
    </div>
</div>

Upvotes: 3

Naoise Golden
Naoise Golden

Reputation: 8913

Try running

$('#page_id').page('refresh');

or

$('#list_id').listview('refresh');

if it's inside a List.

Upvotes: -1

Related Questions