Skip to main content

Page is not found by the Iphone simulator when using ajax /Jquery Mobile-PhoneGap

Image
By User



I am creating a webapp for iPhone using jQuery Mobile and PhoneGap. Everything works fine in Safari for Mac and Chrome for Windows.





When I go to the iPhone Simulator the problems begin. Every button with a link to any page works fine except for one called "Article.html". The only way to open this page from the app is to turn off ajax by doing rel="external".





I have done everything in order to get it work. I have deleted the file and brought it back via add -> existing file with not luck. The content of the page "Article.html" is very simple and I don't think that is the problem because it doesn't even load the page. The loading symbol stays there for ever.







<!DOCTYPE html> 

<html>

    <head>

        <!--jquery and css files are being loaded in another page-->

        <title>This Date in History</title> 

    </head>

<body>

    <div data-role="page" class="type-interior" id="Article" data-add-back-btn="true" data-dom-cache="false"> 

        <div data-role="header" data-theme="a" data-position="fixed">

            <h1></h1>

            <a href="home1.html" data-icon="home" data-iconpos="notext" data-direction="reverse" class="ui-btn-right jqm-home" data-prefetch>Home</a>

        </div><!-- /header -->

        <div data-role="content">

                <h4 id="title"></h4>

                <h5 id="date"></h5>

                <div style="text-align:center;">

                    <img id="img" style="max-height: 138px; max-width: 200px; overflow: hidden;" src=""/>

                </div>

                <p id="milestone_text"></p>



                <a href="" id="more" data-role="button" data-icon="forward" rel="external">More about this event</a>

                </div><!-- /content -->

        <div data-role="footer" class="footer-docs" data-theme="a">

            <center><h5> Archives</h5></center>

        </div><!-- /footer -->

    </div><!--Page ends here-->

</body>







ANY SUGGESTION WOULD BE APPRECIATED..


Labels:

Comments

  1. Tips For AllJanuary 16, 2012 at 1:02 AM

    <a href="home1.html" data-icon="home" data-iconpos="notext" data-direction="reverse" class="ui-btn-right jqm-home" data-prefetch>Home</a>


    please give the full path in href for home1.html

    ReplyDelete
  2. Tips For AllJanuary 16, 2012 at 1:02 AM

    I found the answer by testing line by line.

    For some reason, this line was giving problems:

    <a href="" id="more" data-role="button" data-icon="forward" rel="external">More about this event</a>


    As you can see, href is blank. I just put a bogus url

    <a href="www.google.com" id="more" data-role="button" data-icon="forward" rel="external">More about this event</a>


    and that solved the problem.

    Weird but it works.

    Thanks for your help.

    ReplyDelete

Post a Comment