I used the Methode startsWith, which is only working on Android 5 and above.
if(array[var].startsWith("code"))
Is there another easy way to do this, so that its also working on Android 4 ?
startsWith is not a cordova method, is a javascript method. It will deppend on the support of the webview
Here you can see browser support
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith
Note that it says:
"Android" -> No support.
"Chrome for Android" -> 36
On Android 5 the webview is based on chromium and updatable, right now it uses the version 48, so it supports the startsWith
On the link you have a polyfill, so you can use it with previous versions
if (!String.prototype.startsWith) {
String.prototype.startsWith = function(searchString, position){
position = position || 0;
return this.substr(position, searchString.length) === searchString;
};
}
Related
I'am using Kendo for asp.net MVC to have dropdownlist on a website. It's working fine on PC browsers and Firefox on Android 9. But it is not working on Chrome v72.0.3626.105 (and even Opera) for android 9. When I click I have the list of items that drops down but clicking an item is not selecting it and the dropdownlist is back to its initial state. I wonder if someone has faced this case.
The code I use is simple
//c# code
#(
Html.Kendo().DropDownListFor(x => x)
.BindTo(Model)
.ValuePrimitive(true)
.Name(name)
.Events(e => {
if (!string.IsNullOrWhiteSpace(onSelect))
e.Select(onSelect);
})
)
the code for the select event handler is simple:
//js code
function onSelect(e) {
window.location.href = e.dataItem.Value;
}
Turns out that I miss some files that seem to be required by chormium based browsers:
kendo.fx.min.js
kendo.userevents.min.js
kendo.mobile.scroller.min.js
I used a later version of the kendo.js and it solved the problem (v2019.1.220).
i've to work with phonegap build, cli 5.x and try to build a search form with several inputs, 3 of them are select boxes.
all works fine till i wanted to set the css of the select nodes to 100% with. If i enable this css the selection does not open any more.
My Android Device for testing that won't work is a Nexus 7 with Android 5.1.1 (Lollipop). On IOS and Android Devices with 4.x all is working fine.
The language we use is Typescript with JQuery and will be compiled to Javascript ES5 (commonJS Style).
Sample Script:
var sampleData = [{"val": 1, "text": "sample A"}, {"val": 2, "text": "sample B"}];
var myContainer $('#content-box');
var selectBox = $('<select>').attr('id', 'mySelectBox');
selectBox.append($('<option>').attr('value', 'none').html('-- none --'));
for(var index in sampleData) {
var obj = sampleData[index];
selectBox.append($('<option>').attr('value', obj['val']).html(obj['text']));
}
// code above works fine
$('select').css('width', '100%');
// this crashes the popup after compilation
// and i have to use phonegap-build
by the way, if i have extreme long content going over 100% of the screen with it works. just stretching seems to crash.
i don't work with jquery mobile, some features we build won't work with it !!!
tried external css also, same failure.
somebody has a workaround or a fix for it? somebody can confirm this solution?
Try setting an id for the element you want to modify,
then try
$('#select').css('width', '100%');
if id="select"
I am using the digitalbush masked input jQuery plugin. It is working fine in web browsers and the iPhone browser perfectly, but it is not working for Android mobile devices.
My issue :
mask is
in input field _ - _ - ___.
When I type numbers it will 12345685555___--
Example: http://rossbender.com/temp/mask.html
Any suggestions? How can I solve this?
Thanks
Prasad.
I resolved this issue with three actions, which have fixed this for all Android 4.0+ phones:
Update masked-input to at least version 1.4
Add type="tel" to the input, to trigger the numeric keyboard
Remove the input's maxlength attribute or set it to a value certain not to interfere with the caret action, like 20.
I tried using the raw script that Jonathan Rowny mentioned, but I was still having the same problem on an S3 - Chrome browser. I think it has something to do with inputs type="tel" and/or type="number". I ended up having to use another plugin. http://igorescobar.github.io/jQuery-Mask-Plugin/
jquery-mask (not to be confused with jquery-masked-input) is very similar but the syntax was slightly different. Hope this helps anyone else with this issue.
jquery-masked-input syntax:
$("#phone").mask("(999) 999-9999");
VS
jquery-mask syntax: ('#phone').mask('(000) 000-0000');
This was fixed awhile ago but for some reason the distribution posted on the website never took the changes. If you grab from the raw source, the fix works: https://raw.githubusercontent.com/digitalBush/jquery.maskedinput/master/src/jquery.maskedinput.js
After trying different mask libraries (Inputmask, ui-mask, ngMask) I ended up using jQuery-Mask-Plugin https://igorescobar.github.io/jQuery-Mask-Plugin/ which works pretty well and is also lightweight and well documented and has angularjs, react ,... samples.
I just ran into this problem and resolved it by removing the attribute type="number" from the asp textbox. After that masked input worked even on mobile devices.
The library used in the question is no longer being maintained. I switched my application to jQuery Mask Input as it works great, has a very similar base init call to the former library making for an extremely easy transition and, at the time of this post, jQuery Mask Input is regularly maintained at GitHub.
My issue was with the phone number masker moving the cursor back to the second position when 3 or 4 digits were entered. The cursor continued to act odd after that point. The problem was noticed using jQuery Masked Input v1.4.1 (old library) in android tablets using Chrome post major version 51.
To further enhance the accepted answer of Tony Brasunas, add following snippet in jquery.maskedinput.js for point number 3 to dynamically increase maxlength so it doesn't interfere with caret action.
Remove the input's maxlength attribute or set it to a value certain not to interfere with the caret action, like 20.
defs = $.mask.definitions;
tests = [];
partialPosition = len = mask.length;
firstNonMaskPos = null;
//insert snippet below
if (chrome && android) {
console.log("chrome && android");
var allAllowedRegExps = '';
jQuery.each(defs, function (key, value) {
allAllowedRegExps = allAllowedRegExps + key;
});
allAllowedRegExps = allAllowedRegExps.replace(/\[/g, '');
allAllowedRegExps = allAllowedRegExps.replace(/\]/g, '');
allAllowedRegExps = '[^' + allAllowedRegExps + ']';
var re = new RegExp(allAllowedRegExps, "g");
var actual = mask;
var replacedVal = actual.replace(re, "");
var actualValue = actual.length - replacedVal.length;
if ($(this).attr('maxlength') !== undefined) {
$(this).attr('maxlength', parseInt(this.attr('maxlength')) + parseInt(actualValue));
}
}
mask = String(mask);
This can be a quick fix:
var ua = navigator.userAgent;
var isAndroid = /Android/i.test(ua);
var isChrome = /Chrome/i.test(ua);
// Fix masking on Chrome for mobile devices
if (isAndroid && isChrome) {
$('.price_input').attr('type','tel');
}
It worked for me by using 1.4.1 and setting the max length to one plus the number of chars in the mask. The mask limited the actual input and the max length +1 fixed the problem of not being able to type numbers in the field.
I have an iOS/Android app built on cordova 2.6 and jqm 1.3. I need to open a link to an external website after the user clicks on a button. The code I am using is:
var ref = window.open('http://google.com','_self','location=yes');
ref.addEventListener('loadstart',function(event) {
console.log('load started');
});
ref.addEventListener('loadstop',function(event) {
console.log('load stopped');
});
ref.addEventListener('loaderror',function(event) {
console.log('load error = ' + JSON.stringify(event));
});
On iOS everything performs like I would expect. A new browser window opens with the google website loaded. But I cannot get anything to to load in Android. When I click on the button, nothing happens. I have put in console statements before and after the window.open, so I know the code is at least being executed.
My config.xml should be wide open for white listed sites:
<access origin=".*"/>;
I have tested on a Nexus 7 (android 4.2) and an android 2.2 emulator with the same results on both.
Does anyone know why window.open would not be firing correctly on android?
It looked like it was a problem with 2.6 loading plugins on Android. I upgraded to 2.7 and everything started to work.
Perhaps it's a solution to use the ChildBrowser plugin? This gives you a bit more control over the operation itself, while still preserving platform compatibility between iOS and Android.
In most cases, I use something like the following snippet to use the childbrowser to display an external page.
function openBrowser(url) {
// determine if the childbrowser plugin is available
var useChildBrowser = ('plugins' in window && window.plugins.childBrowser);
if (useChildBrowser) {
popup = window.plugins.childBrowser;
popup.showWebPage(url, { showLocationBar: false, showAddress: false });
} else {
popup = window.open(url, 'Share', "['width=600px', 'height=400px', 'resizable=0', 'fullscreen=yes']");
}
}
Note that this falls back to using window.open if the ChildBrowser plugin isn't available, so you won't break anything else with this. Could be worth a shot, perhaps?
I am facing an issue in Android which is like whenever I am using the maxlenth attribute on input e.g. ; After entering 20 characters on android tab, that page gets hang, I am unable to delete anything or add anything in any other input, other pages works fine but not this page where I entered the charcters upto max limit
I am using on KArbonn Smart Tab 8
Android JellyBean
It is a well known Android 4.1 issue.
Jelly Bean WebView not working well with HTML maxlength attribute for text box
http://code.google.com/p/android/issues/detail?id=35264
Unfortunately, no fix yet. You can follow the above stack-overflow post where they have a JS fix.
I have found the answer and it is working for me:
x$("#fieldWithMaxLength").on("keydown", function(e) {
if(e.keyCode != 8) {
maxlength = $(this).attr('maxlength');
if(this.value.length >= maxlength ) {
var curIndex = $(this).attr('tabindex');
$('[tabindex=' + curIndex + ']').focus();
return false;
}
}
});