jQuery, get datas in AJAX (done) then, display them as star (error)

Posted by Tristan on Stack Overflow See other posts from Stack Overflow or by Tristan
Published on 2010-04-29T12:36:08Z Indexed on 2010/04/29 12:57 UTC
Read the original article Hit count: 360

Filed under:
|

Hello,

In my website, there are 2 steps :

  • I get values from another domain with AJAX, it's numbers 100% working
  • Then, i want to display those numbers in stars with this plugin (http://stackoverflow.com/questions/1987524/turn-a-number-into-star-rating-display-using-jquery-and-css)

The error : the stars plugin does not work for the value i recieve from my ajax request, but it's working for my values for my domain which are not JS manipulated

you can see a demo here http://www.esl.eu/fr/test/test_atome/?killcache=true

PS: the data in ajax are provided in JSON-P so i wrote a parser which look like this:

jQuery.ajax({
   type: "get",
   dataType: "jsonp",
   url: "http://www.foo.com/",
   data: {demandeur: "monkey" },
   cache: true,  
   success: function(data, textStatus, XMLHttpRequest){

  var obj = null, length = data.length;
  for (var i = 0; i < length; i++) {

  widget = "<p>AVERAGES<p>";

  widget += "<p><span class='stars'>";
  widget += data[i].services;
  widget += "</span></p>";

  widget += "<p><span class='stars'>";
  widget += data[i].qualite;
  widget += "</span></p>";

  jQuery('#gotserv').html(widget);
  }    
 }  
});

});

Then i have the star plugin after this function :

$.fn.stars = function() {

$(this).each(function() { // Get the value var val = parseFloat($(this).html()); // Make sure that the value is in 0 - 5 range val = val > 5 ? 5 : (val < 0 ? 0 : val); // Calculate physical size var size = 16 * val; // Create stars holder var stars = $(''); // Adjust yellow stars' width stars.find('span').width(size); // Replace the numerical value with stars $(this).replaceWith(stars); });

I hope you understand, i don't know if i'm clear Thank you

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about jquery-live