XML parsing using jQuery

Question

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

@icktoofay: It is not case sensitive @jAndy: not working means that not is displayed - not sure how else to explain it :o). This is my first time with js - any tips on debugging/fault finding this code. I have tried adding alerts/messageboxes. it enters $.ajax but after that nothing happens if i move the alert further "into" the code — lmkk, Jun 07 '10 at 09:09
Works for me when you correct capitalization: `.find('Scenes')`, `.find('Scene')`, `$(this).attr('Name');`. — user113716, Jun 07 '10 at 12:18
Works in safari now - but not in chrome and firefox @patrick - which browser did you use? — lmkk, Jun 08 '10 at 07:21
@lmkk - Are you hosting from the filesystem? If so, see my answer below. — user113716, Jun 08 '10 at 12:52

score 2 · Accepted Answer · edited May 23 '17 at 12:30

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

score 0 · Answer 2 · edited Dec 19 '11 at 17:56

0

Try changing this:

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

to this:

$('.items')

edited Dec 19 '11 at 17:56

LPL

16,827
6
51
95

answered Jun 07 '10 at 09:35

thedude

1

score 0 · Answer 3 · answered Jun 07 '10 at 15:24

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.

Found two problems and solved one of them. It is case sensitive after all - Thanks to icktoofay and Patrick. But for some reason this only works in safari, but not in chrome or firefox. isn´t safari and chrome the same in terms of javascript - webkit engines? — lmkk, Jun 08 '10 at 07:20

XML parsing using jQuery

3 Answers3

Linked

Related