jQTouch Phonegap problems

Question

I am using jQTouch and Phonegap and it perfectly runs in my Xcode and iPhone simulator. What I am trying to develop is to dynamically display external webpages within my application. For example, when you first run the application it shows table with data "User Interface", "Animations" ... etc. What I want to make is when user taps on "User Interface" it should display some external web pages ( lets say google's home page).

I wrote the following code and this is inside User Interface->Edge to Edge->(here I want to dispaly the home page of google). The width:340 and height:420 will be the display area of google's home page. Please help me to make it.

       <div id="edge">
            <div class="toolbar">
                <h1>Edge to Edge</h1>
                <a href="#" class="back">back</a>
            </div>
            <div style="width:340px; height:420px; background:red;">
                <ul class="edgetoedge scroll">
                    <li class="sep">under construction...</li>
                </ul>

            </div>

        </div>

Thank you

Answer 1

You will need to load an <iframe> into the div you want to display the content of the external page.

http://www.w3schools.com/tags/tag_iframe.asp

Make sure to add the external URL to the whitelist (ExternalHosts entry in PhoneGap.plist as per the PhoneGap for iOS FAQ: http://wiki.phonegap.com/w/page/41631150/PhoneGap%20for%20iOS%20FAQ) and set the Boolean for OpenAllWhitelistURLsInWebView to YES.