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
jQuery
|jquery-live
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