ajax toolkit - rating control - want to display current rating & allow people to pick that value

Question

I'm trying to use the rating control in the ajax toolkit. I'm currently setting the currentrating to whatever the average rating is for that item. However, that means no one can pick that value. For example - if the current rating is 3, then no one will be able to select 3.

I found this post on stackoverflow asking the same question: Ajax control toolkit Rating Control- Override RatingBehavior.js

But i haven't had any luck getting that to work. I'm guessing because it's an old post, about 3 years old, and things have changed with the rating control since then.

So - anyone know how i can display the current rating and still allow that value to be submitted?

Thanks

Answer 1

I hope you've found a solution to this issue, just in case you haven't here it is:

1. Add a hidden field to the page/user control where the rating control is, eg.

2. Add the following script block to the page/user control:

   var ratingID = ""; //client ID for the rating control var ratingClientID = ""; //unique ID for the rating control var hfAverageRatingID = ""; //hidden field ID

3. Add the code below to an external js file, then reference it in your ScriptManagerProxy or ToolScriptManager control:

   var rating;

   Sys.Application.add_load(function () { $(".ratingStars a").click(function () { var avgValue = $("#" + hfAverageRatingID).val(); var ratingValue = $find("RatingCtrl_RatingExtender").get_Rating(); //we only want to run custom code when the average rating == the chosen rating if (ratingValue == avgValue) { if ((ratingValue < 0) || (ratingValue > rating._maxRatingValue)) { return; } rating._update(); Sys.Extended.UI.RatingBehavior.callBaseMethod(rating, 'set_ClientState', [rating._ratingValue]); rating.raisePropertyChanged('Rating'); rating.raiseRated(rating._currentRating); rating._waitingMode(true); var args = rating._currentRating + ";" + rating._tag; var id = rating._callbackID; // unique id -- ctl00$cphMainContainer$bjxRatings1$pageRating if (rating._autoPostBack) { __doPostBack(id, args); } else { WebForm_DoCallback(id, args, rating._receiveServerData, rating, rating._onError, true) } } }); $create(Sys.Extended.UI.RatingBehavior, { "AutoPostBack": true, "CallbackID": ratingClientID, "ClientStateFieldID": "RatingCtrl_RatingExtender_ClientState", "id": "RatingCtrl_RatingExtender" }, null, null, $get(ratingID)); rating = $find("RatingCtrl_RatingExtender"); });

Something interesting to note is that the link you posted has outdated code, with the newer ajaxToolkit library you can't reference it from 'AjaxControlToolkit' in javascript. Instead you must use 'Sys.Extended.UI' in the js file.

Best of luck, Shawn