CODEWITHSUNDEEP
jqueryxml
lmkk
lmkk

Reputation: 609

XML parsing using jQuery

I have the following xml:

<?xml version="1.0" encoding="utf-8"?>
<Area xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema">
 <Scenes>
   <Scene Index="1" Name="Scene1" />
   <Scene Index="2" Name="Scene2" /> 
 </Scenes>
</Area>

Which i am trying to parse with jquery:

<script>
        $(document).ready(function(){
            $.ajax({
                type: "GET",
                url: "list.xml",
                dataType: "xml",
                success: function(xml) {
                    $(xml).find('scenes').each(function(){
                            $(this).find('scene').each(function(){
                            var name = $(this).attr('name');                            
                            $('<div class="items" ></div>').html('<p>'+name+'</p>').appendTo('#page-wrap'); 

                        });                     
                    });
                }
            });
        });
</script>

Why is this not working? Help!! first attempt at javascript/jquery This is based on a example I found, but have so far been unable to adapt it to my usage. / Lars

Upvotes: 1

Views: 2190

Answers (3)

thedude
thedude

Reputation: 1

Try changing this:

$('<div class="items" ></div>')

to this:

$('.items')

Upvotes: 0

user113716
user113716

Reputation: 322452

This code works for me in Safari and (surprisingly) Firefox:

$.ajax({
    type: "GET",
    url: "list.xml",
    dataType: "xml",
    success: function(xml) {
  $(xml).find('Scenes').each(function(){
      $(this).find('Scene').each(function(){
          var name = $(this).attr('Name');                            
          $('<div class="items" ></div>').html('<p>'+name+'</p>').appendTo('#page-wrap'); 
             });                     
         });
    },
    error:function(a,b,c) { console.log( c ) }
});

The reason it doesn't work in some browsers is likely due to the fact that you're hosting from the filesystem (assuming you are). Chrome and Firefox tend to give trouble when accessing the filesystem via AJAX request due to Same Origin Policy.

The javascript is fine. You're just either getting an empty response, or an error.

This question may be applicable:

Problems with jQuery getJSON using local files in Chrome

Upvotes: 2

istruble
istruble

Reputation: 13692

Try running the code from your browser's console instead of when the document is ready. It will allow you to iterate on things much quicker. Try FireBug in Firefox for starters. I find the FB console to be much easier to use when debugging complex actions than what you get in a Webkit based browser.

You might also try adding error and complete callback functions to your $.ajax() call.

$.ajax({
    // ...
    error: function (req, err_type, ex) { console.log("error..."); },
    complete: function (req, status) { console.log("complete..."); }
});

You can also try tossing in some alerts or console.logs inside your success handler. Just enough to make sure you know it is being called and is getting the xml result that you expect it to get.

Upvotes: 0

Related Questions