jQuery Mobile Popup loading same old value

Question

jquery mobile popup is loading same old value in my text box whenever popup is opened. how to load new popup with cleared data. Following are my html for popup.

<a href="#popupLogin" data-rel="popup" data-position-to="window" data-role="button" data-inline="true">Form</a>
<div data-role="popup" id="popupLogin" data-theme="a" class="ui-corner-all">
            <form>
                <div style="padding:10px 20px;">
                  <h3>Please sign in</h3>
                  <label for="un" class="ui-hidden-accessible">Username:</label>
                  <input type="text" name="user" id="un" value="" placeholder="username" data-theme="a" />

                  <label for="pw" class="ui-hidden-accessible">Password:</label>
                  <input type="password" name="pass" id="pw" value="" placeholder="password" data-theme="a" />

                  <button type="submit" data-theme="b">Sign in</button>
                </div>
            </form>
        </div>

Answer 1

You need to reset input within popup on either popupbeforeposition or popupafteropen events.

$(document).on("pagecreate", "#pageID", function () {
    $("#popupLogin").on("popupbeforeposition", function () {
        $("input", this).val("");
    });
});

Demo