in our project we are utilizing the jquery-mobile popup dialog
Once the dialog is shown, the first time I attempt to fill in the text on my phone (Huawei P9 lite, Android 6.0.0, Chrome 55.0.2883.91), the popup closes and reopens.
I am able to replicate this issue even on the demo Form popup.
On a sightly larger device (5.7 inches vs 5 inches) with a larger screen and almost the same android (6.0.1, the same browser) this does not happen.
It seems to be caused by popup automatically repositioning after the keyboard appears. Did anyone encounter a similar problem? How did u solve it?
<a href="#popupLogin" data-rel="popup" data-position-to="window" class="ui-btn ui-corner-all ui-shadow ui-btn-inline ui-icon-check ui-btn-icon-left ui-btn-a" data-transition="pop">Sign in</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" class="ui-btn ui-corner-all ui-shadow ui-btn-b ui-btn-icon-left ui-icon-check">Sign in</button>
</div>
</form>
</div>
The answer is based on Omar's comment. Once I comment the following lines of code the behavior does not appear (there is a possible loss of a nice repositioning feature).
_handleWindowResize: function(/* theEvent */) {
if ( this._isOpen && this._ignoreResizeTo === 0 ) {
if ( ( this._expectResizeEvent() || this._orientationchangeInProgress ) &&
!this._ui.container.hasClass( "ui-popup-hidden" ) ) {
// effectively rapid-close the popup while leaving the screen intact
// this._ui.container
// .addClass( "ui-popup-hidden ui-popup-truncate" )
// .removeAttr( "style" );
}
}
},
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With