CODEWITHSUNDEEP
jqueryjquery-mobile
bollo
bollo

Reputation: 1634

refresh jquery mobile text inputs

I have been working with JQM for a couple of weeks and after studying various examples and reading the docs, I cannot seem to find a way to refresh text inputs in a success callback. Is this possible with v1.0b2. I can refresh(reset) other elements just not text inputs. Any help would be appreciated. Thanks

Upvotes: 2

Views: 5064

Answers (3)

Vette
Vette

Reputation: 541

I am dynamically creating some text inputs in my code (based on button clicks). Because they are being created after the page is rendered, they were all showing the standard UI (instead of jquery mobile css look and feel.) I found out that I have to "refresh" them after creating them (similar to how you refresh a button or other element.)

After creating the inputs, I add the line:

$('#myInputName').textinput();

to refresh

Upvotes: 2

Phill Pafford
Phill Pafford

Reputation: 85308

Example:

JS

$('#reset').click(function() {
    $('.resetMe').val('');
    $("input[name='checkbox-1']").attr("checked",false).checkboxradio("refresh");
    $("input[name='radio-choice-1']").attr("checked",false).checkboxradio("refresh");
});

HTML

<div data-role="page" id="home"> 
    <div data-role="content"> 
        <div data-role="fieldcontain">
            <label for="name">Text Input:</label>
            <input type="text" name="name" id="name" value="" class="resetMe" />
        </div>
        <div data-role="fieldcontain">
            <label for="textarea">Textarea:</label>
            <textarea cols="40" rows="8" name="textarea" id="textarea" class="resetMe"></textarea>
        </div>
        <div data-role="fieldcontain">
            <fieldset data-role="controlgroup">
                <legend>Agree to the terms:</legend>
                <input type="checkbox" name="checkbox-1" id="checkbox-1" />
                <label for="checkbox-1">I agree</label>
            </fieldset>
        </div>
        <div data-role="fieldcontain">
            <fieldset data-role="controlgroup">
                <legend>Choose a pet:</legend>
                <input type="radio" name="radio-choice-1" id="radio-choice-1" value="choice-1" />
                <label for="radio-choice-1">Cat</label>

                <input type="radio" name="radio-choice-1" id="radio-choice-2" value="choice-2"  />
                <label for="radio-choice-2">Dog</label>

                <input type="radio" name="radio-choice-1" id="radio-choice-3" value="choice-3"  />
                <label for="radio-choice-3">Hamster</label>

                <input type="radio" name="radio-choice-1" id="radio-choice-4" value="choice-4"  />
                <label for="radio-choice-4">Lizard</label>
            </fieldset>
        </div>
        <a href="#" data-role="button" id="reset">Reset button</a>
    </div>
</div>

Upvotes: 2

Gerard
Gerard

Reputation: 4848

Why not just add a class to the text inputs and then set the values on those elements like so:

$(".my_class").val("");

Upvotes: 1

Related Questions