PJ on Development

I'm currently working with some AjaxControlToolkit objects, and they are a real time savers.

However, the Rating extender control presents an odd behavior: if you put a Rating control at the bottom of a long page, when the user clicks on the rating control it jumps back to the top of the page.

This is because the way the Rating control renders itself. It renders as:

<a href="#" id="Rating1"> ... stars images ...</a>

So, when the user clicks on the control, it redirects the page back to the top of the page.

In order to prevent this behavior, I had to tweak a bit with the RatingBehavior.js and change the _onStarClick function to the following code:

_onStarClick : function(e) {
    /// <summary>
    /// Handler for a star's click event
    /// </summary>
    /// <param type="Sys.UI.DomEvent" name="e">
    /// Event info
    /// </param>
    if (!this._readOnly && 
        (this._ratingValue != this._currentRating)) {
        this.set_Rating(this._currentRating);
    }
    e.preventDefault();
    e.stopPropagation();
},

This way, when the user clicks on the starts, the page stays where it should.

PJ on Development: Blog

Fixing AjaxControlToolkit Rating odd behavior

Know your ropes!