iOS Phonegap, WebApp and External links

[mciani]

Hi all,

I'm trying to develop a simple web app to be packaged into PhoneGap. I think I did most of what I was trying to achieve, but I'm struggling with a strange (?) behavior of external links.

In few words, I have the following code within my apps:

<div id="forms">
<div class="toolbar">
<h1>Forms</h1>
<a href="#" class="back">Back</a>
</div>
<div>
<iframe src="link to external site" frameborder="0" width="100%" height="100%"> </iframe>
</div>
</div>

In Safari on my Mac it looks great, I have a frame containing my link, everything embedded into the webapp.

If I load it into XCode, with the Phonegap template and build into the simulator, the frame is shown, but it's empty.

If I include the page into the DIV, with the EMBED or OBJECT, it works perfectly on Safari, but in the simulator the application will go in background and Safari is invoked...

Is anyone aware of a way to use either frames or any other way to include an external page into a webapp not allowing Safari to be invoked and remain in the app?

Thanks for your ideas!

Marco

 

[ulbador]

This is a well known "issue" with PhoneGap... Check out some Google

http://groups.google.com/group/phonegap/browse_thread/thread/bd1280d14ff1ff81

http://groups.google.com/group/phonegap/browse_thread/thread/8cfdd755dd33ff2b

The long and short of it: You either create a blank div and update it with javascript and AJAX, or you override the default "clicked link" handler with shouldStartLoadWithRequest.

Personally, I would just forgo the iframes all together and slap together a decent AJAX handler. Infinitely easier to work with once it it set up and can be used for so much more than just embedding remote content.

 

[mciani]

and...

Thanks Ulbador,

may I exploit you a bit more?
I have opened AppDelegate.m, but I don't really know where to start.

Will you be so kind to tell me what I have to change or tell me where I can find a good tutorial for writing the AJAX handler?

THANKS A LOT!!!

 

[ulbador]

PhoneGAP allows you to build an app using HTML and Javascript. Just dig into learning how to refresh a DIV using Javascript and AJAX.

Again google is your friend:

http://www.webdeveloper.com/forum/showthread.php?t=169337

http://bytes.com/topic/javascript/answers/868002-ajax-automatic-refresh-div

 

[mciani]

I did it!

Ubaldor, thanks a lot for helping me out.
I did it, and it's working perfectly!

I have spent several weeks googling and reading forums on that topic!
You solve it, and I really appreciate that!

Thanks a lot again, and have a great 2011!

Marco