jQuery Mobile PhoneGap XML parsing ( iOS )

Question

I am using PhoneGap, jQuery mobile in Xcode. I have a local xml (data.xml) file with the following data

<?xml version="1.0" encoding="utf-8" ?>
<RecentTutorials>
<Tutorial author="The Reddest">
    <Title>Silverlight and the Netflix API</Title>
    <Categories>
        <Category>Tutorials</Category>
        <Category>Silverlight 2.0</Category>
        <Category>Silverlight</Category>
        <Category>C#</Category>
        <Category>XAML</Category>
    </Categories>
    <Date>1/13/2009</Date>
</Tutorial>
<Tutorial author="The Hairiest">
    <Title>Cake PHP 4 - Saving and Validating Data</Title>
    <Categories>
        <Category>Tutorials</Category>
        <Category>CakePHP</Category>
        <Category>PHP</Category>
    </Categories>
    <Date>1/12/2009</Date>
</Tutorial>
<Tutorial author="The Tallest">
    <Title>Silverlight 2 - Using initParams</Title>
    <Categories>
        <Category>Tutorials</Category>
        <Category>Silverlight 2.0</Category>
        <Category>Silverlight</Category>
        <Category>C#</Category>
        <Category>HTML</Category>
    </Categories>
    <Date>1/6/2009</Date>
</Tutorial>
<Tutorial author="The Fattest">
    <Title>Controlling iTunes with AutoHotkey</Title>
    <Categories>
        <Category>Tutorials</Category>
        <Category>AutoHotkey</Category>
    </Categories>
    <Date>12/12/2008</Date>
</Tutorial>

And I have the following code in my html file:

<script type="text/javascript">
            $(document).ready(function()
            {
            $.ajax({
            type: "GET",
            url: "data.xml",
            dataType: "xml",
                   success: function(xml){
                   $(xml).find("Tutorial").each(function()
                                                {

                                $("#output").append($(this).attr("author") + "<br />");
                                                });


                   }
            });
            });

            </script>


            <script type="text/javascript">
                function parseXml(xml)
                {

                    $(xml).find("Tutorial").each(function()
                                                 {
                                                 $("#output").append($(this).attr("author") + "<br />");
                                                 });


                }    
            </script>


</head> 

<body> 
    <div data-role="page">

        <div data-role="header" data-position="fixed">
            <h1>The title</h1>
        </div><!-- /header -->

        <div data-role="content" id="output">

  <--!  XML DATA SUPPOSED TO BE DISPLAYED HERE BUT I GOT NOTHING HERE  -->

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

        <div data-role="footer" data-position="fixed">
            <h4>The Footer</h4>
        </div><!-- /header -->
    </div><!-- /page -->
</body>

I am using Xcode for the output in the iPhone simulator and its not displaying anything inside the content which is supposed to be displayed.

Where did I do mistake or do I need third-party xml parser ?

Any suggestions would be a great help. Thanks

Answer 1

I have found the solution for this and it worked perfectly for me. Instead of using

$(document).ready(function() {

});

I wrote the following:

<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>

<script>
$(document).bind("mobileinit", function() {

// AJAX code goes here

});
<script>

<script src="http://code.jquery.com/mobile/1.0/jquery.mobile-
1.0.min.js"></script>

Its important to note that this code should be between the jquery-core and jquery-mobile link as I did above.

jQuery Mobile PhoneGap XML parsing ( iOS )

Question

1 answers

solution1
0 ACCPTED 2012-03-28 14:24:12

jQuery Mobile PhoneGap XML parsing ( iOS )

Question

1 answers

solution1 0 ACCPTED 2012-03-28 14:24:12

solution1
0 ACCPTED 2012-03-28 14:24:12