Obsolete
Status Update
No update yet.
Comments
ti...@gmail.com
Confirmed. This is for some phones and/or for 4.4. The same html with keypress events works fine in stock Android browser. The events fire within the webview but the keyCode/which are not set within the WebView.
co...@gmail.com
I am able to reproduce this on the latest Galaxy S5 running 4.4.2.
Found this while debugging a jquery.inputmask issue.
Found this while debugging a jquery.inputmask issue.
ra...@gmail.com
I have also the same issue. How can i solve this issue?
co...@gmail.com
I used some jQuery to get this handled. Here is a sample of the code I
started with.
ib...@gmail.com
Confirmed.
I see it on an Samsung Galaxy Tab 4 with 4.4.2.
Anyone know a solution / workaround?
This is grinding my project to a halt...
I see it on an Samsung Galaxy Tab 4 with 4.4.2.
Anyone know a solution / workaround?
This is grinding my project to a halt...
co...@gmail.com
One more fiddle for y'all. To detect which key events are available...
http://jsfiddle.net/danconde/2w57N/
gr...@gmail.com
conde....@gmail.com, your fiddles simply illustrate code that would not work to capture all of the key codes and events using a native android web view. JQuery relies on the ability of the browser (in this case, the native web view) to send those key codes from the operating system. The problem here is that the key codes are simply not coming through properly, or are not coming through at all.
Build a new native android app, with only a webview, then load a simple html page that includes JQuery and try to run your code to capture key codes. Numbers are the only thing that work properly. All letter keys return 0 for the key code, and the backspace key doesnt even trigger a key event period.
That spells disaster for cordova/phonegap developers who need to capture specific events.
Build a new native android app, with only a webview, then load a simple html page that includes JQuery and try to run your code to capture key codes. Numbers are the only thing that work properly. All letter keys return 0 for the key code, and the backspace key doesnt even trigger a key event period.
That spells disaster for cordova/phonegap developers who need to capture specific events.
co...@gmail.com
True if I were writing code to run IN Android environment...
BUT when developing websites that may be displayed on these devices, and many others, you will find the native browser suffers this limitation.
BUT when developing websites that may be displayed on these devices, and many others, you will find the native browser suffers this limitation.
gr...@gmail.com
If you were to reread the description of the bug, it describes a problem that runs inside a webview in the Android environment, not in the chrome browser, thus your JQuery 101 lessons do nothing to contribute to this.
ib...@gmail.com
I agree with grant, the problem lies in the WebView class.
Wether you catch an onkeydown with JQuery or plain javascript, if the webview doesn't propagate the keyboard events properly to the javascript engine, nothing works.
This is ineed a major problem.
Wether you catch an onkeydown with JQuery or plain javascript, if the webview doesn't propagate the keyboard events properly to the javascript engine, nothing works.
This is ineed a major problem.
ib...@gmail.com
I experimented a bit. The problem is in the
window.onkeypress function. See attachment.
Events from the soft keyboard don't (all) arrive at that function.
Only the numeric ones.
Still no clue whatsoever to resolve this one. Looks like a bug that Google has to fix.
window.onkeypress function. See attachment.
Events from the soft keyboard don't (all) arrive at that function.
Only the numeric ones.
Still no clue whatsoever to resolve this one. Looks like a bug that Google has to fix.
ra...@gmail.com
[Comment deleted]
ra...@gmail.com
I got a solution. its working fine.
<input type="text" id="char" size="15" onblur="showKeyCode()" value="a">
<input type="button" value="Show Key Code" onclick="showKeyCode();">
<script>
function showKeyCode()
{
var character = document.getElementById ( "char" ).value.substr(this.length - 1);
var code = character.charCodeAt();
var stringall = document.getElementById ( "char" ).value;
var msg = "The Key Code for the \""+character+"\" character is "+code+".";
alert(msg);
}
</script>
What I did is just take value from this and converted that value to keycode using charCodeAt function.
Its quite simple
<input type="text" id="char" size="15" onblur="showKeyCode()" value="a">
<input type="button" value="Show Key Code" onclick="showKeyCode();">
<script>
function showKeyCode()
{
var character = document.getElementById ( "char" ).value.substr(this.length - 1);
var code = character.charCodeAt();
var stringall = document.getElementById ( "char" ).value;
var msg = "The Key Code for the \""+character+"\" character is "+code+".";
alert(msg);
}
</script>
What I did is just take value from this and converted that value to keycode using charCodeAt function.
Its quite simple
ra...@gmail.com
My issue was that I cannot get keycode from webview to javascript. In mine keypress event works fine.
ib...@gmail.com
@Rjilesh
The problem is not in the conversion of the keycodes but in the capturing of the window.onkeypress event. see my attachment at #11.
The problem is not in the conversion of the keycodes but in the capturing of the window.onkeypress event. see my attachment at #11.
ra...@gmail.com
oh!
Have you tried this?
document.querySelector('input').addEventListener('keypress',function(){
alert('keypressed');
});
Have you tried this?
document.querySelector('input').addEventListener('keypress',function(){
alert('keypressed');
});
ra...@gmail.com
<!DOCTYPE html>
<html>
<head>
<title>Key events</title>
<script>
function onKeyDownHandler() {
document.body.appendChild(document.createTextNode("a"));
}
function onKeyPressHandler() {
document.body.appendChild(document.createTextNode("b"));
}
</script>
</head>
<body style="width: 200px;">
<form>
Key down: <input type="text" onkeydown="onKeyDownHandler()" /> <br/>
Key press: <input type="text" onkeypress="onKeyPressHandler()" />
</form>
<script type="text/javascript">
document.querySelector('input').addEventListener('keypress',function(){
alert('keypressed');
});
</script>
</body>
</html>
<html>
<head>
<title>Key events</title>
<script>
function onKeyDownHandler() {
document.body.appendChild(document.createTextNode("a"));
}
function onKeyPressHandler() {
document.body.appendChild(document.createTextNode("b"));
}
</script>
</head>
<body style="width: 200px;">
<form>
Key down: <input type="text" onkeydown="onKeyDownHandler()" /> <br/>
Key press: <input type="text" onkeypress="onKeyPressHandler()" />
</form>
<script type="text/javascript">
document.querySelector('input').addEventListener('keypress',function(){
alert('keypressed');
});
</script>
</body>
</html>
ib...@gmail.com
Well when dealing with html input fields, it works.
But to catch the keystrokes NOT in an input field, in other words the keys you type when not focused on an input field, it doesn't work.
Normally in javascript you catch them with window.onkeypress = function(e) { etcetc.}
and within the function you doe something with e.charCode or e.keyCode.
This function is called in WebView 4.2.2, but not 4.4.2 or so it seems. Google changed the webview and underlying browser significantly in 4.4.2 by the way.
But to catch the keystrokes NOT in an input field, in other words the keys you type when not focused on an input field, it doesn't work.
Normally in javascript you catch them with window.onkeypress = function(e) { etcetc.}
and within the function you doe something with e.charCode or e.keyCode.
This function is called in WebView 4.2.2, but not 4.4.2 or so it seems. Google changed the webview and underlying browser significantly in 4.4.2 by the way.
ra...@gmail.com
Thats what i said.
To access keycode, use this code
var character = document.getElementById ( "char" ).value.substr(this.length - 1);
var code = character.charCodeAt();
please try with this. but this will not work with other localisations
To access keycode, use this code
var character = document.getElementById ( "char" ).value.substr(this.length - 1);
var code = character.charCodeAt();
please try with this. but this will not work with other localisations
ra...@gmail.com
document.querySelector('body').addEventListener('keypress',function(){
alert('keypressed');
});
have you tried with this?
alert('keypressed');
});
have you tried with this?
co...@gmail.com
Those are great workarounds...
For my application, I had to re-enable input masks which began to fail on some Android devices.
Reducing the code to simple javascript aided in detecting the affected os's and testing viable solutions.
Our final solution can be found in:https://apply.roadloans.com/
For my application, I had to re-enable input masks which began to fail on some Android devices.
Reducing the code to simple javascript aided in detecting the affected os's and testing viable solutions.
Our final solution can be found in:
ib...@gmail.com
What the?? 'roadloans'?? What kind of spam is THAT!??
Still all your js fiddling does NOT solve the problem.
Read the original problem, and then post #7. That is what this problem is about.
Still all your js fiddling does NOT solve the problem.
Read the original problem, and then post #7. That is what this problem is about.
co...@gmail.com
You mean
"In 4.4.2 (api level 19) a WebView no longer recieves keypress event in javascript correctly when the soft (software) keyboard is used. The javascript function is not called."
And yes this is one of the sites I develop and our work around for this bug.
"In 4.4.2 (api level 19) a WebView no longer recieves keypress event in javascript correctly when the soft (software) keyboard is used. The javascript function is not called."
And yes this is one of the sites I develop and our work around for this bug.
ib...@gmail.com
@grant.st...@gmail.com Did you ever find a soulution or workaround for this one?
You seem to understand the core of the problem in post#7, no one else has.
You seem to understand the core of the problem in post#7, no one else has.
gr...@gmail.com
I did not. If you're trying to blacklist characters, you could do something hacky with a regex to look at the end of the string being entered and truncate it as necessary. Otherwise, I've got nothin. This is a bug in Chromium that google needs to fix. Apparently it hasnt been high enough on their list though.
sh...@gmail.com
Same issue. Best workaround I have found is to just straight up use the following with REGEX (assuming your trying to prevent certain inputs)
onkeyup="this.value = this.value.replace(REGEX_SEARCH, '')"
onkeyup="this.value = this.value.replace(REGEX_SEARCH, '')"
ma...@gmail.com
I need to limit text input to float numbers, a work around for this issue: http://code.google.com/p/chromium/issues/detail?id=79732
I was going to listen to keyPress events and prevent text input. A workaround that I'm using is to listen for change events and check if the value is a float. Works, but not an ideal user experience.
$(".inputPage").on("change", ".floatInput", function(e){
console.log("on change event");
console.log(filterFloat($(this).val()))
if(filterFloat($(this).val())){
console.log("valid float")
}
else{
alert("Please input a valid float.")
}
});
var filterFloat = function (value) {
if(/^(\-|\+)?([0-9]+(\.[0-9]+)?|Infinity)$/
.test(value))
return Number(value);
return NaN;
}
I was going to listen to keyPress events and prevent text input. A workaround that I'm using is to listen for change events and check if the value is a float. Works, but not an ideal user experience.
$(".inputPage").on("change", ".floatInput", function(e){
console.log("on change event");
console.log(filterFloat($(this).val()))
if(filterFloat($(this).val())){
console.log("valid float")
}
else{
alert("Please input a valid float.")
}
});
var filterFloat = function (value) {
if(/^(\-|\+)?([0-9]+(\.[0-9]+)?|Infinity)$/
.test(value))
return Number(value);
return NaN;
}
ri...@gmail.com
The same for Lollipop.
pu...@gmail.com
[Comment deleted]
pu...@gmail.com
[Comment deleted]
pu...@gmail.com
I got this exception without having the software keyboard open. I was implementing faster clicks by doing this:
$.fn.extend(
{
touch: function(func)
{
var element = $(this);
element.mousedown(function()
{
return false;
});
element.click(function()
{
return false;
});
element.kendoTouch(
{
touchstart: function(e)
{
func();
}
});
}
});
and when I touch a div with this touch handler installed, the exception occurs, but func() is called as expected.
$.fn.extend(
{
touch: function(func)
{
var element = $(this);
element.mousedown(function()
{
return false;
});
element.click(function()
{
return false;
});
element.kendoTouch(
{
touchstart: function(e)
{
func();
}
});
}
});
and when I touch a div with this touch handler installed, the exception occurs, but func() is called as expected.
jf...@gmail.com
I too hit this problem developing a phone gap app. I was unable to get any difference by turning off autocomplete.
However my project leverages angular 1.2 and very fortunately I was able to pull and detect changes in an input field with type="number" using a directive that set a keyup listener on the element.
I can get a key by key diff on the field by inspecting the $viewValue on the control - hope this helps someone out there!
Example:
...
link: function (scope, element, attrs, control) {
// listen for key ups on the element
element.bind("keyup", function (evtObj) {
// pull DOM value to work on - angular nabbed the correct viewValue for us, WOOT!
var charsval = control.$viewValue.toString();
cordova -version
4.0.0
phonegap -version
3.5.0-0.20.4
However my project leverages angular 1.2 and very fortunately I was able to pull and detect changes in an input field with type="number" using a directive that set a keyup listener on the element.
I can get a key by key diff on the field by inspecting the $viewValue on the control - hope this helps someone out there!
Example:
...
link: function (scope, element, attrs, control) {
// listen for key ups on the element
element.bind("keyup", function (evtObj) {
// pull DOM value to work on - angular nabbed the correct viewValue for us, WOOT!
var charsval = control.$viewValue.toString();
cordova -version
4.0.0
phonegap -version
3.5.0-0.20.4
en...@google.com
al...@gmail.com
Kindly put the full directive.
tr...@gmail.com
ran into the same problem and this solve detecting keypress on android for me.
.directive("showHidePopover", [function() {
return {
restrict: "A",
link: function(scope, element, attrs) {
element.bind('keyup', function(e) {
scope.popover.hide();
});
}
}
}])
.directive("showHidePopover", [function() {
return {
restrict: "A",
link: function(scope, element, attrs) {
element.bind('keyup', function(e) {
scope.popover.hide();
});
}
}
}])
Description
I have confirmed this both in the emulator and on the Nexus 4 running 4.4.2. I've attached a sample web page.
For the emulator, LogCat displays these messages indicating problems:
04-07 23:59:22.613: E/chromium(2271): [ERROR:immediate_input_router.cc(507)] We seem to have a different key type sent from the renderer. (7 vs. 10). Ignoring event.
04-07 23:59:22.613: E/chromium(2271): [ERROR:immediate_input_router.cc(504)] Got a KeyEvent back from the renderer but we don't seem to have sent it to the renderer!
04-07 23:59:22.633: E/chromium(2271): [ERROR:immediate_input_router.cc(504)] Got a KeyEvent back from the renderer but we don't seem to have sent it to the renderer!
04-07 23:59:54.203: W/UnimplementedWebViewApi(2271): Unimplemented WebView method onKeyDown called from: android.webkit.WebView.onKeyDown(WebView.java:2169)