append not working

  • mindfullsilence
  • Professor
  • Professor
  • User avatar
  • Joined: Aug 04, 2008
  • Posts: 846
  • Status: Offline

Post December 11th, 2009, 12:29 pm

there a reason why this isn't working?

JAVASCRIPT Code: [ Select ]
$.ajax({
    url: "js/img3.xml",type: 'GET',dataType: 'xml',timeout: 1000,error: function(){alert('Error loading XML document');},
    success: function(xml) {
       var source = $(this).find('image[source]').text(this);
       var desc = $(this).find('image[description]').text(this);
       var category = $(this).find('image[id]').text(this);
       var index = $(this).index(this);
         $(this).find('image').each(function(){
             $("#textcontainer").append('<p>' + desc + '</p>');
         });
    }
});
 
  1. $.ajax({
  2.     url: "js/img3.xml",type: 'GET',dataType: 'xml',timeout: 1000,error: function(){alert('Error loading XML document');},
  3.     success: function(xml) {
  4.        var source = $(this).find('image[source]').text(this);
  5.        var desc = $(this).find('image[description]').text(this);
  6.        var category = $(this).find('image[id]').text(this);
  7.        var index = $(this).index(this);
  8.          $(this).find('image').each(function(){
  9.              $("#textcontainer").append('<p>' + desc + '</p>');
  10.          });
  11.     }
  12. });
  13.  


It's not generating anything in my html, at all.
Use your words like arrows to shoot toward your goal.
  • Anonymous
  • Bot
  • No Avatar
  • Joined: 25 Feb 2008
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post December 11th, 2009, 12:29 pm

  • UPSGuy
  • Lurker ಠ_ಠ
  • Web Master
  • User avatar
  • Joined: Jul 25, 2005
  • Posts: 2735
  • Loc: Nashville, TN
  • Status: Offline

Post December 11th, 2009, 12:56 pm

You're not really inside an object operator when you start that bit of code, so I'm not sure $(this) would refer to a valid object at that point. Have you tried outputting anything on source/desc/category/index to make sure they're getting the expected values? I'm pretty sure your selector just as you step into the success callback would have to be $(xml).find() etc. etc.

Here's an example from an IBM tuto I came across when verifying my thought:
Code: [ Select ]
success: function(xml){
  $(xml).find('item').each(function(){
    var item_text = $(this).text();

    $('<li></li>')
      .html(item_text)
      .appendTo('ol');
  });
}
  1. success: function(xml){
  2.   $(xml).find('item').each(function(){
  3.     var item_text = $(this).text();
  4.     $('<li></li>')
  5.       .html(item_text)
  6.       .appendTo('ol');
  7.   });
  8. }
I'd love to change the world, but they won't give me the source code.
  • mindfullsilence
  • Professor
  • Professor
  • User avatar
  • Joined: Aug 04, 2008
  • Posts: 846
  • Status: Offline

Post December 11th, 2009, 7:55 pm

so then this should work, and yet it is not,

JAVASCRIPT Code: [ Select ]
$.ajax({
    url: "js/img3.xml",type: 'GET',dataType: 'xml',timeout: 1000,error: function(){alert('Error loading XML document');},
    success: function(xml) {
         $(xml).find('image').each(function(){
      var source = $(this).attr('source').text(this);
      var desc = $(this).attr('description').text();
      var category = $(this).attr('id').text();
      var index = $(this).index(this);
                      $("#textcontainer").append('<p>' + desc + '</p>');
          $("#webthumblist").append('<li><a id="' + index + '"></a>');
          $("#imagecontainer").append('<img src="' + source + '" />');
         });
    }
});
 
  1. $.ajax({
  2.     url: "js/img3.xml",type: 'GET',dataType: 'xml',timeout: 1000,error: function(){alert('Error loading XML document');},
  3.     success: function(xml) {
  4.          $(xml).find('image').each(function(){
  5.       var source = $(this).attr('source').text(this);
  6.       var desc = $(this).attr('description').text();
  7.       var category = $(this).attr('id').text();
  8.       var index = $(this).index(this);
  9.                       $("#textcontainer").append('<p>' + desc + '</p>');
  10.           $("#webthumblist").append('<li><a id="' + index + '"></a>');
  11.           $("#imagecontainer").append('<img src="' + source + '" />');
  12.          });
  13.     }
  14. });
  15.  


this is what my xml looks like:

XML Code: [ Select ]
<root>
      <image
         source="tadesign/images/carcare.jpg"
         description="Description text goes here about carcaredetail"
         id="web"
      />
     
      <image
         source="tadesign/images/monster.jpg"
         description="Description text goes here about monster resolution"
         id="web"
      />
     
      <image
         source="tadesign/images/rantingbill.jpg"
         description="Description text goes here about rantingbill"
         id="web"
      />
     
      <image
         source="tadesign/images/voltecsite.jpg"
         description="Description text goes here about voltec design"
         id="web"
      />
</root>
 
  1. <root>
  2.       <image
  3.          source="tadesign/images/carcare.jpg"
  4.          description="Description text goes here about carcaredetail"
  5.          id="web"
  6.       />
  7.      
  8.       <image
  9.          source="tadesign/images/monster.jpg"
  10.          description="Description text goes here about monster resolution"
  11.          id="web"
  12.       />
  13.      
  14.       <image
  15.          source="tadesign/images/rantingbill.jpg"
  16.          description="Description text goes here about rantingbill"
  17.          id="web"
  18.       />
  19.      
  20.       <image
  21.          source="tadesign/images/voltecsite.jpg"
  22.          description="Description text goes here about voltec design"
  23.          id="web"
  24.       />
  25. </root>
  26.  


must I use this "appendTo" now that I'm dealing with attributes of my xml tags?
Use your words like arrows to shoot toward your goal.
  • mindfullsilence
  • Professor
  • Professor
  • User avatar
  • Joined: Aug 04, 2008
  • Posts: 846
  • Status: Offline

Post December 11th, 2009, 8:06 pm

web dev is telling me that:


Quote:
var source = $(this).attr('source').text is not a function



what does this mean? Of course it's not a function, it's a variable...
Use your words like arrows to shoot toward your goal.
  • mindfullsilence
  • Professor
  • Professor
  • User avatar
  • Joined: Aug 04, 2008
  • Posts: 846
  • Status: Offline

Post December 12th, 2009, 3:27 pm

can you use the attributeHas selector on "this"...
like so:

JAVASCRIPT Code: [ Select ]
var source = $(this[id='web']).attr('source');
 
  1. var source = $(this[id='web']).attr('source');
  2.  


I only want to get the "source" if the "id" attribute is "web"
It's not working so far, returns the string "undefined" instead of the "source" text.
Use your words like arrows to shoot toward your goal.

Post Information

  • Total Posts in this topic: 5 posts
  • Users browsing this forum: Kurthead+1 and 138 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
cron
 

© 2011 Unmelted, LLC. Ozzu® is a registered trademark of Unmelted, LLC.