Syncfusion controls not loading on iOS native UIWebView - javascript

I have a web application that built with ASP.NET MVC and used Syncfusion controls in it. Also, I am building iOS and Android application using native WebView.
The problem I am currently facing that Syncfusion controls are not working at iOS native UIWebView but it works fine at Android Webview and other Web browsers.
[Error] TypeError: null is not an object (evaluating 't[1]')
getBrowserDetails (ej.web.all.min.js:10:2620892) setWidthToColumns
(ej.web.all.min.js:10:2713042)
_completeAction (ej.web.all.min.js:10:2705521) sendDataRenderingRequest (ej.web.all.min.js:10:2703872)
_renderGridContent (ej.web.all.min.js:10:2684094) render (ej.web.all.min.js:10:2674498)
_initGridRender (ej.web.all.min.js:10:2664775)
_checkDataBinding (ej.web.all.min.js:10:2631224)
_init (ej.web.all.min.js:10:2626321) (anonymous function) (ej.web.all.min.js:10:19759) (anonymous function)
(ej.web.all.min.js:10:20802) (anonymous function)
(actelion-test.pulselinks.com:995)
Above error is thrown only for the page which has SyncFusion control. Becuase of that error page failed to load the required scripts in the WebView and application not working as expected
My current Syncfusion script ej.web.all.min.js version is 14.2.
It would be very helpful if you let me know why I am getting above error and how can I resolve the error?
Thanks to advanced for your help.

We could see you are facing some complexities while launching the Grid from Cordova browser in an IOS Platform. We can overcome this by changing the functionality of the getBrowserDetails as shown in the following code example.
<script>
$(function () {
. ..
var getBrowsedtls = function () {
var b = navigator.userAgent.match(/(firefox|chrome|opera|msie|safari|ipad|iphone|ipod touch|android|)\s?\/?(\d+(.\d+)*)/i);
if (!!navigator.userAgent.match(/Trident\/7\./))
return { browser: "msie", version: $.uaMatch(navigator.userAgent).version };
return { browser: b[1].toLowerCase(), version: b[2] };
};
$("#test").ejGrid({
dataSource: values,
. . . .
showSummary: false,
load: function(args){
this.getBrowserDetails = getBrowsedtls;
},
. . .
});
});
</script>
We have changed the method details in the load event of the Grid. Refer to the following API Reference.
https://help.syncfusion.com/api/js/ejgrid#events:load

Related

bindRows is not a function

I am trying to bind data from NWGW to an existing javascript table for Input value help using getTable().bindRows.
Development tool is WebIDE, All connections are checked. All oData services are OK and providing Live Data, metadata OK.
But I keep getting
Uncaught TypeError: oValueHelpDialog.getTable(...).bindRows is not a
function.
This only happens if the app is running on a small screen device (phone or if I choose phone layout in Chrome Dev Tool).
I don't know if it is because it can get the odata to bind to the table? Does phone handle UI5 differently?
I would appreciate any help. Thanks
-------Update-------
Thank to a nice guy in Answer.SAP. Here is the sample project
Step to reproduce the error:
Import the project to Web IDE
Execute the index.html
Open Chrome Dev Tool
Choose device: iPhone 6/7/8 or whatever phone
Refresh (F5) the app
Click on Value Help Dialog again > lead to a blank table
-------Update END-------
Fragment view
var oValueHelpDialog = new sap.ui.comp.valuehelpdialog.ValueHelpDialog({
title : oController.getStrTextSite(),
supportMultiselect : false,
supportRanges : false,
supportRangesOnly : false,
key : oController.getStrWERKS(),
descriptionKey : oController.getStrNAME1(),
ok: function(oControlEvent) {
oController.setDefaultSiteFromHelp(oControlEvent);
oValueHelpDialog.close();
},
cancel: function(oControlEvent) {
oValueHelpDialog.close();
},
afterClose: function() {
oValueHelpDialog.destroy();
}
});
...
return oValueHelpDialog;
}
Controller
onValueHelpForDefaultSite : function(oEvent) {
var oValueHelpDialog = this.getFragmentForValueHelp();
oValueHelpDialog.open();
...
oValueHelpDialog.getTable().bindRows(
this.getEntitySet(
"ODATA_10_DEFAULT_SITE_SET",
"ODATA_10"
)
);
}
Turns out that in mobile, function bindRows() does not exist so we have to replace it with function bindItems()

MFF 8.0 invokeProcedure ReferenceError

I'm migrating MobileFirst Web(Javascript) application developed in MFP7.1 to MFF8.0. When call a Javascript adapter, the following error happens. Does anyone give an advise how to fix the problem?
Error Message:
ibmmfpf.js:2040 Uncaught ReferenceError: extendWithDefaultOptions is not defined
at __WLClient.invokeProcedure (ibmmfpf.js:2040)
Code:
var proc = function(procedure, parameters) {
return WL.Client.invokeProcedure({
adapter: ‘XXXXXXX’,
procedure: procedure,
parameters : (parameters || [])
}, {
timeout: 60000
});
};
var standardHandler = function(res) {
if (typeof res.responseJSON === 'object' && res.responseJSON.code > 0) {
return $.Deferred().reject(res).promise();
}
return $.Deferred().resolve(res).promise();
};
//// invoking proc
return proc(‘getYYYYY’).then(standardHandler);
Some of the APIs from MFP 7.1 have been changed in MFP 8.0.Use Migration Cookbook tool.This tool helps you by identifying areas in your codebase that you will need to inspect and alter, such as APIs that are deprecated, no longer supported, or modified.
For more details about migration IBM MobileFirst Platform Foundation 6.3 - 7.1, to IBM Mobile Foundation 8.0. see below links
Migrating apps from earlier releases
Migrating apps and adapters to MobileFirst Foundation 8.0
Developing for Cordova application

Uncaught TypeError: Cannot read property 'OneSignal' of undefined", source: file:///android_asset/www/js/app

I'm trying to initialize OneSignal to a PhoneGap application.
I tried many ways. But always it gives following error,
Uncaught TypeError: Cannot read property 'OneSignal' of undefined",
source: file:///android_asset/www/js/app.js error.
This is my app.js file
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
oneSignal();
checkConnection();}
function oneSignal(){
console.log("It is calling");
var notificationOpenedCallback = function(jsonData) {
console.log('didReceiveRemoteNotificationCallBack: ' + JSON.stringify(jsonData));
};
window.plugins.OneSignal.init("my app id",
{googleProjectNumber: "my project number"},
notificationOpenedCallback);
// Show an alert box if a notification comes in when the user is in your app.
window.plugins.OneSignal.enableInAppAlertNotification(true);}
Somebody please help me to initialize OneSignal to my PhoneGap application.
The best way to initialize OneSignal is by adding the code in your controller.js file and make sure its in one of your controllers - it might be login, logout, anything.
in other words you need to add the code inside a set controller that responds to a certain action.
Cant explain it better but try that -..
Good luck
Just try installing your plugin, cross verify for it's availability in the plugins folder. Also confirm the corresponding update has been made in config.xml and fetch.json (in the plugins folder). The error usually arises in case the plugin is not installed properly.
Hope this helps... :)

Cordova In App Browser event not firing IOS

Trying to authenticate users on my ionic application through an external service and I need to use cordovas In app browser! The code works perfectly on android however on iOS the "loadstop" event never fires and thus, the browser never redirects itself back to the application. The code I have looks like this:
$rootScope.$on('$cordovaInAppBrowser:loadstop', function (e, event) {
console.log('inappbrowser loaded', event);
var regex = /* regex to determine if url is correct redirected url */
var res = regex.test(event.url);
alert('loaded: ' + event.url);
alert('regex result: ' + res);
if(res === true) {
$cordovaInAppBrowser.close();
}
});
if(okta) {
if (typeof window.localStorage.msRefreshToken === 'undefined') {
document.addEventListener('deviceready', function () {
$cordovaInAppBrowser.open('urlforExternalservicehere', '_blank', options);
}, false);
} else {
TokenStore.refreshAccessToken();
}
}
when the code is run no alert appears on the screen. Also, once the app has reached the external service and the username of the user is entered, it is then redirected to another url, which the user will then use another set of credentials to authenticate against. This in turn returns a token for the application to authenticate use.
Thus, in a perfect iOS world where it matches the current android experience, the loadstop event fires three times, and the third time the "loadstop" event would fire and the regex would return true and close the in app broswer.
If I need to supply more code to help solve this issue please let me know!
Cordova Version: 4.2.0
Ionic: 1.4.5
iOS: 8 and 9
Using NgCordova for Cordova functionality
UPDATE: when running the application on an emulator and checking the console logs, I find this error:
Error: Module cordova-plugin-inappbrowser.inappbrowser does not
exist., http://10.117.1.46:8100/cordova.js, Line: 1402
I have the plugin installed so I don't know how its missing the plugin. Does anyone have a remedy for this? Thanks!
iabRef = window.open('http://XYZ.php', '_blank', 'location=no,toolbar=no');
iabRef.addEventListener('loadstart', iabLoadStart);
iabRef.addEventListener('loadstop', iabLoadStop);
iabRef.removeEventListener('loaderror', iabLoadError);
iabRef.addEventListener('exit', iabClose);
iabRef.addEventListener('loadstart', function(event) {
if (event.url.match("mobile/close")) {
iabRef.close();
window.location = 'index.html';
}
}
);
Problem was my iOS platform wasn't latest.
So when you developing apps using cordova make sure your platform versions and plugins are up-to date with OS upgraded.
So all I had to do is
Removing iOS platform.
cordova platform rm ios
Adding iOS platform - Latest Version
cordova platform add ios
Removing the plugin cordova-plugin-inappbrowser
cordova plugin remove cordova-plugin-inappbrowser
Adding the plugin cordova-plugin-inappbrowser - Latest Version
cordova plugin add cordova-plugin-inappbrowser

Ti.App.fireEvent not working; error Uncaught TypeError: Cannot read property 'App' of undefined

I have a simple Titanium app which opens a webview, and loads a URL. I want the links to open in the default browser, not the app.
I have some jQuery code which adds a click event to all links in the page.
<script>
jQuery('a').click(function() {
console.log("Handler for .click() called for URL: " + this.href);
Ti.App.fireEvent('ynOpenURL', {url: this.href });
});
In the app.js file I have:
var win = Ti.UI.createWindow();
var mywebview = Ti.UI.createWebView({
url : 'http://xxxx.xxxxx.com/',
enableZoomControls: false
});
win.add(mywebview);
win.open();
Ti.App.addEventListener('ynOpenURL', function(e) {
Ti.API.info('yyyyyy');
Ti.API.info(e.url);
if (Ti.Platform.canOpenURL(e.url)){
Ti.Platform.openURL(e.url);
} else {
alert("Cannot open URL");
}
When I run the app on my Android (4.4) the web page loads correctly.
When I click a link on the phone I get the following in the console:
Handler for .click() called for URL: http://xxx.xxxxx.xxx/
Uncaught TypeError: Cannot read property 'App' of undefined (xxxx)
None of the Titanium console events are logged, only the javascript events in the webpage.
As you mentioned that the webview is loading remote url. So Ti.* or Titanium.* are not available at your remote server.
What you can do is :
Create a html file within the app and load the data via ajax and use fireEvent.
Load the data via titanium http client and use Ti.Platform.openURL accordingly.
Edit : Quote from Titanium WebView Docs
Remote Scripts
Scripts downloaded from remote web servers cannot access the Titanium namespace.
To interact with remote content, wait until the content is loaded, then use the evalJS method to execute a JavaScript expression inside the web view and retrieve the value of an expression.

Categories

Resources