In prior versions the JQery click() method worked, but in 1114 it doesn't work at all on touch devices. It works just fine with mice.
Here's a page that demonstrates the issue:
http://Dashboard.Sentegy.com/Test.html
if you are on a mouse device clicking on the button generates the alert. On a touch device (iOS) it doesn't pop up. This causes all kinds of problems because Kendo UI Web is also broken. For example selection of an item in a tree view doesn't work on touch devices. I assume its all the same underlying root cause.
The source follows:
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.8.3.min.js" type="text/javascript"></script>
<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.all.min.js" type="text/javascript"></script>
<link href="http://cdn.kendostatic.com/2012.3.1114/styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="http://cdn.kendostatic.com/2012.3.1114/styles/kendo.dataviz.min.css" rel="stylesheet" type="text/css" />
<link href="http://cdn.kendostatic.com/2012.3.1114/styles/kendo.silver.min.css" rel="stylesheet" type="text/css" />
<link href="http://cdn.kendostatic.com/2012.3.1114/styles/kendo.mobile.all.min.css" rel="stylesheet" type="text/css" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
</head>
<body>
<div data-role="view">
<a id="Button" data-align="left" data-role="button" >Press me</a>
</div>
<script>
app = new kendo.mobile.Application(document.body);
$("#Button").click(function () {
alert("Clicked");
});
</script>
</body>
</html>
Here's a page that demonstrates the issue:
http://Dashboard.Sentegy.com/Test.html
if you are on a mouse device clicking on the button generates the alert. On a touch device (iOS) it doesn't pop up. This causes all kinds of problems because Kendo UI Web is also broken. For example selection of an item in a tree view doesn't work on touch devices. I assume its all the same underlying root cause.
The source follows:
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.8.3.min.js" type="text/javascript"></script>
<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.all.min.js" type="text/javascript"></script>
<link href="http://cdn.kendostatic.com/2012.3.1114/styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="http://cdn.kendostatic.com/2012.3.1114/styles/kendo.dataviz.min.css" rel="stylesheet" type="text/css" />
<link href="http://cdn.kendostatic.com/2012.3.1114/styles/kendo.silver.min.css" rel="stylesheet" type="text/css" />
<link href="http://cdn.kendostatic.com/2012.3.1114/styles/kendo.mobile.all.min.css" rel="stylesheet" type="text/css" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
</head>
<body>
<div data-role="view">
<a id="Button" data-align="left" data-role="button" >Press me</a>
</div>
<script>
app = new kendo.mobile.Application(document.body);
$("#Button").click(function () {
alert("Clicked");
});
</script>
</body>
</html>