webView with remote HTML - does not fireEvent
Fellow Appcelerators,
Making fireEvent work on iPhone and latest Appcelerator 1.4.x is driving me nuts and I hope community can help me. I have two problems:
Scenario: A simple app with app.js page and and a WebView that should ideally display remote URL signup.php (HTML signup form that post to a 2nd page). I use the event to add update (hidden) FORM elements w device data.
The following is not working:
1) FireEvent is never fired for the remote HTML. If I change to a local HTML file as part of my project it works but when it's a remote PHP file producing same HTML is does not work???
2) When running as local file - after user submit form - on the subsequent 2nd HTML file events are not fired. Seems like subsequent pages loaded in webview do not fire events? Trying to reload the page by forcing url is not going to work as it would double-post my FORM
Code snippets
Apps.js:
.
navGroup=....
Ti.App.addEventListener('callbackUpdateForm', callbackUpdateForm);
signupWebView = Ti.UI.createWebView({url: "screens/signup.html"});
var signupWin = Ti.UI.createWindow({title: "SignUp",barColor: '#111'});
.
signupWin.add(signupWebView);
navGroup.open(signupWin,{animated:true});
.
function callbackUpdateForm(passedData){
var s = "document.signup.q.value='Test'; document.signup.submit();";
signupWebView.evalJS(s);
}
signup.html:
<form name=signup action="signup2.html" method="POSt" onsubmit="return process()">
</form>
<script>
function process(){
Ti.App.fireEvent('callbackUpdateForm', {});
</script>
7 Answers
-
I have not solved all issues but have posted a zipped project with code snippets for example.
Find a downloadable zip of a project which loads external HTML (with a workaround for iPhone as very often in Appcelerator) The URL for the zipfile is here:
http://www.saveass.com/triggertest.zip
The project this end does indeed trigger javascript calls in the html picked up by the app.js file in titanium. It also can do this with external html for iPhone by downloading the html file caching it locally. Code included.
On android the javascript calls are fetched from the external file with no problems for me. iPhone however needed to fiddling around.
So not a complete working example for all problems, but maybe a little help for the one having problems getting user clicks to be picked up in app.js as I did.
-
I have wasted my time trying to get a event to fire in a remote HTML file… never got it working…
Using 1.5.1 and nada is transferred between the webview and titanium for me.
Anyone able to do this, please let us know…
htmlcontent:
<a href='#' onclick='Titanium.App.fireEvent('webtoti', {data:'1'});'>Clicketyclick</a>¨
Listener in app.js
Titanium.App.addEventListener('webtoti', function(e) { Titanium.API.info("from webview"); });
adding the eventlistener to the view itself did not help either…
Harald
-
Hello, did someone ever seen a remote file firing a Titanium event? Is that possible or I am just wasting my time trying?
Thanks!
-
Anyone succeeded with events on remote html-files? An working example for this case would be nice!
-
I found a workaround to execute fireEvent on a remote URL :
webview.addEventListener('beforeload', function(e){ if (e.url.indexOf('front/logout') !== -1) { // Logout webview.stopLoading(); Ti.App.fireEvent('logoutApplication', {}); } });
Like you see, we check the url on the beforeLoad, and execute our logout Application. We could also use hastags in the links instead of real links (mysite.com/#logout).
-
I haven't found a good example for this anywhere, it took me a long time to piece this much together, but I've found something that works for calling functions from within webview.
set a function(doesn't have to be a function) in your TI app.js, such as
goler = function(){ Ti.API.info('Sue-Bob Goler'); };
then assign this function to the webview (still inside the TI app.js, like so :
webview1.goler = goler()
now, inside your webpage code, call that function, like so(inside a JavaScript onclick or the like) :
Ti.UI.currentWindow.goler;
EDIT: Disregard, this 'solution' was just me getting ahead of myself. I've still not found the proper way to do this.
-
I haven't found a good example for this anywhere, it took me a long time to piece this much together, but I've found something that works for calling functions from within webview.
set a function(doesn't have to be a function) in your TI app.js, such as
goler = function(){ Ti.API.info('Sue-Bob Goler'); };
then assign this function to the webview (still inside the TI app.js, like so :
webview1.goler = goler()
now, inside your webpage code, call that function, like so(inside a JavaScript onclick or the like) :
Ti.UI.currentWindow.goler;