extra input box phonegap jquerymobile

Question

I'm using scroller form iscrollview. It's truly appreciated. I am using a JQM 1.3 . The form has some input field. However, when I type a character, and scrolls it overlays an extra input box . This didn't happen until I implemented iscrollview. Any help would be appreciated. thanks.

score 2 · Answer 1 · answered Jun 07 '13 at 11:50

2

use

-webkit-user-modify: read-write-plaintext-only;

answered Jun 07 '13 at 11:50

Sameertha

87
2
11

1

use it but problem with on android numpad – Reshma Shakya Jun 07 '13 at 12:04
this will show alphabetical keyboard instead of numpad when used on number inputs. – Omar Jun 07 '13 at 12:36
but needed number for – Reshma Shakya Jun 07 '13 at 12:38

score 1 · Answer 2 · answered Sep 10 '13 at 15:17

I did workaround by loosing focus of current input when user scrolls.

I've created empty input with position:absolute, and left: -400em (so it won't be visible) and added listener for scroll event:

JS:

$(document).delegate("#main-page", "iscroll_onscrollmove", function () {
  if($("#some-input).is(":focus")){
    //$("#some-input).blur() //in order to hide virtual keyboard uncomment 
    $("#focus-target").focus();
  }
});

HTML:

<input type="text" id="focus-target" style="width: 0; height: 0; position: absolute; left: -400em;"/>

So far I've tested only on Android. It doesn't solve the root problem, but scrolling input is no longer visible for a user.

extra input box phonegap jquerymobile

2 Answers2