This is a migrated thread and some comments may be shown as answers.

Cordova/Angular/Mobile View Navigation Causes Cannot call method 'triggerBeforeShow' of undefined

3 Answers 105 Views
Integration with other JS libraries
This is a migrated thread and some comments may be shown as answers.
Patrick
Top achievements
Rank 1
Patrick asked on 04 Apr 2016, 06:33 AM
I have an angular application that runs fine on the web and in ripple but the following error on my android device and in the android emulator:

Uncaught TypeError: Cannot call method 'triggerBeforeShow' of undefined

 

The application has a stub default view that redirects to the main home view.

 

A sample cordova project to reproduce the error is included.  Run from VS Empulator 5" KitKat or from an android device.

 
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
 
    <!--
        Customize the content security policy in the meta tag below as needed. Add 'unsafe-inline' to default-src to enable inline JavaScript.
        For details, see http://go.microsoft.com/fwlink/?LinkID=617521
    -->
    <meta http-equiv="Content-Security-Policy" content="default-src  'self' http://cdn.kendostatic.com ; http://ajax.googleapis.com http://code.jquery.com ; https://caredarewebapi.azurewebsites.net ; https://localhost:44309/   https://localhost:44300/  https://caredarestorage.blob.core.windows.net/ 'unsafe-eval' 'unsafe-inline' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">
    <title>CorovaStartupNavigationTest</title>
 
    <!-- CorovaStartupNavigationTest references -->
    <link href="css/kendo.mobile.all.min.css" rel="stylesheet" />
 
 
 
    <script src="scripts/index.js"></script>
</head>
<body kendo-mobile-application skin="'flat'" ng-app="sushiMobileApp">
    <kendo-mobile-view id="viewLogin" data-title="Login" ng-controller="indexController" k-on-before-show="showHome(kendoEvent)">
    </kendo-mobile-view>
 
    <script src="cordova.js"></script>
    <script src="scripts/platformOverrides.js"></script>
    <script src="scripts/jquery.min.js"></script>
    <script src="scripts/angular.js"></script>
    <script src="scripts/kendo.all.min.js"></script>
    <script src="app/modules/cdlogin.js"></script>
 
    <script>
        angular.module('sushiMobileApp', ['kendo.directives', 'cdlogin'])
         .controller('indexController', ['$scope', function ($scope) {
             $scope.showHome = function (kendoEvent) {
                 kendo.mobile.application.navigate("/app/views/viewtabhome.html");
             }
 
             $scope.onCommand = function (kendoEvent) {
                 $scope.command = kendoEvent.currentTarget.data("command");
                 switch ($scope.command) {
                     case "login":
                         kendo.mobile.application.navigate('/app/views/viewlogin.html');
                         break;
                 }
             }
         }]);
        ;
    </script>
 
</body>
 
 
</html>

3 Answers, 1 is accepted

Sort by
0
Patrick
Top achievements
Rank 1
answered on 05 Apr 2016, 03:50 PM
Support indicated to use prevent default in my before show redirect or set initial page view initial syntax but... neither of these suggestions affect the reproducible error which is that the login button does not work on Android devices in cordova.
0
Petyo
Telerik team
answered on 06 Apr 2016, 06:15 AM
Hello,

This does not sound like a known issue. The code below does not seem to be complete - you refer to a button which I am unable to fiund. May you please post a runnable sample of your case (including the suggestions we provided)? You may use plunker for that purpose, in case the problem needs a multiple files like remote views.

Regards,
Petyo
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Patrick
Top achievements
Rank 1
answered on 08 Apr 2016, 01:05 AM
I was able to address the issue.  The issue was caused by including a leading "\" in my application navigate which works on the web platform but not on the device.   The cryptic error messages are very hard to debug but I was able to solve the problem.
Tags
Integration with other JS libraries
Asked by
Patrick
Top achievements
Rank 1
Answers by
Patrick
Top achievements
Rank 1
Petyo
Telerik team
Share this question
or