JavaScript ASP.NET Rater control (Rating control): Sneak Peek

Rater Control, Rating Control, or 5-Star Rating Control, call it what you like.

I have created a new JavaScript ASP.NET Rater control (Rating Control). The entire functionality is driven by JavaScript, but I have also created an custom .NET control to facilitate easy use in an ASP.NET web appication. I intend on writing a much more detailed article, soon I hope. For now you can see my demo page for a better look.

Technologies:
JavaScript
C#
ASP.NET

Here is a sneak peak at the Rater control in action: (Hint: use your mouse.)

Demo: http://blogs.crsw.com/mark/samples/CastleRaterDemo/

Download the demo (and control).
Download the control only.

Note: For anyone who would like to link to my Rater control, please link to this post and not my demo page. Thanks. Also, I will make the C# source code for the .NET control available soon.

posted on Sunday, January 30, 2005 5:15 PM

Feedback

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 2/8/2005 8:17 AM primortal

Great control mark, hope you keep working on it.

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 3/1/2005 2:10 PM john kemp

It's a great looking control and I look forward to messing around with it. However, how would one "unrate" an item?
Anyway, great control.

John

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 3/2/2005 6:49 PM Mark Wagner

Hi John,

I have seen a few rater controls that allow you to "un-rate", or specify zero stars. To me, a rater control should rate from 1 to something. A value of zero would represent that no rating had been performed yet, and any rated value (from a user) should be a value greater than zero (1 to something). The default value for an unrated control would is zero. This is my opinion.

With that said, if I get enough feedback for this as a requirement, I would be more than happy to add support for it.

Thanks for your feedback. I will note it as one request. Thanks agian.

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 3/2/2005 6:51 PM Mark Wagner

Just a quick note. I have noticed that it does not appear to be caching the images correctly - for some time now, but I have not had time to look into it. However, I will look into it soon.

Mark

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 3/3/2005 6:44 AM primortal

a 'un-rate' feature would be nice. You do get people who might want to retract the rating they gave something. Maybe make the 'un-rate' a settable feature for the developer.

Looking forward for any updates you provide Mark.

Thanks

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 3/3/2005 9:33 AM John Kemp

Mark,

I've run into this at Amazon (and I know it's a different context but I think it's still applicable). I've rated a product and then thought better of it because the rating changes my "recommended" titles. Granted, people might not use this control for ratings as search criteria. Then again, they might. I may be one of the few who actually wants to retract my rating decision and change to an abstention. Being able to clear the rating could be useful. Just a thought.

Thanks for the response.
John

P.S. Do you find the CAPTCHA control effectively reduces comment spam? Thanks again.

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 3/3/2005 10:07 AM Mark Wagner

John,

Thanks for the good feedback. It sound like I should implement an unrate feature/option - and I will plan to now.

As for the CAPTCHA - I have not had one comment spam since I have implemented it. Well worth it.

Thanks again,
Mark

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 3/3/2005 11:03 PM Corby

John,

Great little control but I'm having problems with the imageoverURL failing to display when i hover over the control. The imageoffURL and imageonURL are fine. And yes, the image is mapped properly to the control.

thanks,

Corb

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 3/5/2005 3:20 PM Mark Wagner

Hi Corb,

I'm not sure why that would be happening. However, I would like to resolve that problem if I can get an example of how it is not working.

Send me your email using the Contact link at the top of my blog and I will let you know how to send me your sample showing me your problem.

Thanks,
Mark

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 3/8/2005 2:22 PM Marco Rasp

John,
Thanks for this great control. It works fine within a page. But I have problems to use it in an user control. A javascript error (Image[] is Null ...) was generated and no hover image is displayed. Perhaps it's the same problem corby mentioned.

Thanks again

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 3/23/2005 10:48 PM Corb

Hey Mark,
Wondering if you ever checked out that hover over issue John and I were experiencing.

thanks,
corb

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 4/19/2005 5:43 AM primortal

I am also seeing the same problem with getting the javascript error (Image[] is Null...). What is strange that its working perfectly on one page (the control is in a datagrid) and when I copy the same control to a new page (the control is in a datalist) the problem shows up. Hope this helps.

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 4/28/2005 2:05 AM syborg77

Great work !!!
Any plans on releasing the source soon? I too am experiencing similar problems that primortal mentioned with list controls.

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 5/6/2005 12:56 PM primortal

please, oh please update this wonderful control Mark....

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 7/12/2005 9:07 AM a

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 7/24/2005 6:28 PM Rebekah

Hi Mark,

It would be great if you can give us your source code. I will try to ammend it according to my need as I am getting the same problem as primortal.

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 7/24/2005 6:43 PM Rebekah

Hi Mark,

document.getElementById(imgID) is returning null when I add this control to datagrid.

Any workaround to get rid of this.

Thanks,
Rebekah

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 7/26/2005 1:23 PM wolf

Hi Mark,

Don't give them the source codes. It just takes a little bit effort to develop the control. Publishing the codes makes IT knowledge worthless.

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 7/26/2005 1:36 PM wolf

By the way, this control does not work if it is placed in another control. I guess the error exists in the server side codes. Mark should use control's ID instead of ClientID to define the image's ID. It should be a great control if Mark can have this little problem fixed.

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 8/9/2005 5:07 PM Alan

Mark, this is great. It passes the Safari litmus test too! SlickRater, a similar control that some mentioned earlier, doesn't work at all on Safari-- they only support IE and Firefox on Windows... no idea why-- it's not too hard to code javascript that works on all modern browsers.

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 8/18/2005 9:51 PM Josh

Any idea how to add an onmouseover to the buttons so I can use some DHTML to show text associated with each star, such as "Love It, Hate It, etc"

-Josh

jlippiner@yahoo.com

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 9/26/2005 10:09 PM Ryan Dolby

in reference to this..
Hi Mark,

document.getElementById(imgID) is returning null when I add this control to datagrid.

Any workaround to get rid of this.
------------------
in the CastleRater.InitializeRater = function(rater) function you can set the rater.Images[i] using
rater.Images[i] = rater.Container.childNodes[i-1];

now... i had to put the function at the bottom of my page so the control would use the altered function instead of the one rendered by the asp.net control...

yes. this is a hack

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 12/6/2005 8:29 AM Waheed Ashraf

I tried to use this control in my aspx page, it works fine as long as i dont use the AutoPostback option. Gives me an error :" '__EVENTTARGET' is null or is not an object" I am using vb in backend. Any idea why this is happening ?

Thanks

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 1/2/2006 8:41 PM Toby

Yeah I am using master pages and I get the document.getElementById(imgID) is returning null
Not sure I understand Ryan's comment though.
were you recommending moving the entire
CastleRater.InitializeRater = function(rater)
method directly to the page and changing
rater.Images[i] = img;
with
rater.Images[i] = rater.Container.childNodes[i-1];

?
no dice Any other suggestions?

# Please Fix Issue with user controls 2/19/2006 12:11 PM Pierre

The issue come from containers that are INamingContainers because they modify the name of their child controls so they are always unique.

Mark, if you could fix the code in the Render method of your control and change that line:
image1.ID = this.ClientID + "_img" + num1;
by
image1.ID = this.ID + "_img" + num1;
Then your control would work in User controls and Grids....

Thanks!

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 3/3/2006 1:33 PM Rob

Mark:

It's been a little while, so I figured I would ask. Can we get the source for this control yet?

I'd love to have it, since I plan on using the control in a project.

Thanks,
-- Rob --

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 4/5/2006 1:39 PM ClickSauce

Very Nice control. Thanks for the demo.

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 4/19/2006 4:04 AM Handofmercy

Hi Mark,

Love the control mate! It would be great to get hold of the source. Please could you make the source available, I'm sure loads of people would appreciate it.

Thanks
Handofmercy

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 5/31/2006 6:02 AM SANDEEP

THE QUESTION ARE VERY VERY GOOD , I WANT STILL MORE QUESTION WILL YOU PLEASE PREPARE THE QUESTION AND SEND TO MY MAIL.

THANK YOU
SANDEEP KUMAR

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 7/2/2006 2:30 PM Wendy

I'm new to asp.net how do I use this? I can't see anything in the demo..

Dim Rater As New Castle.Web.Controls.Rater ???

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 7/31/2006 6:08 PM Abhijit

The demo outputs javascript tags that build the control but not when I use the DLL.

Somethings not right!

The JS error is because the ID of the parent control is added twice to the ID of the image control.

# CSK 2.0 Rating Control - Please Read This 8/16/2006 4:02 PM Spook's Blog

File this one under "oops". The rating control (the cool little stars on our product page)

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 9/14/2006 3:15 PM David Nicolosi

Hey, very nice control and one I plan on using it my new upcoming site! Thanks for this!

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 9/14/2006 3:39 PM David Nicolosi

Hey... I'm also getting the JS error when adding the rater to a user control. Does anyone have the fix to get around this issue? Thanks!

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 10/25/2006 10:39 PM a

I am also seeing the same problem with getting the javascript error (Image[] is Null...).

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 11/22/2006 11:17 PM Minh Vu Huynh

It will be better if you have a button to reset the rating!
Anyway, It's a good control.

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 2/28/2007 11:51 AM Access denied

This tool occasionally throws out some "Access denied" error, which makes me doubt the behind intention the developer.

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 3/11/2007 11:03 PM Sivaprakash

Is it possible to change the back ground color of the controls

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 4/17/2007 1:18 AM oih

Rubbish!!! Doesn't work!

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 5/3/2007 8:45 AM James

I have been looking for a control like this. I don't want an ajax one just. But I can't get it to work with master pages. Is it possible you could release the source code so I could make the changes I need?

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 6/19/2007 8:55 PM Indrani

This is a very good control, but can we get the C# code for the web controls?

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 6/26/2007 10:16 PM Murali

I am also seeing the same problem with getting the javascript error (Image[] is Null...). What is strange that its working perfectly on one page (the control is in a usercontrol) and when I copy the same control to a new page (the control is in a usercontrol) the problem shows up. Hope this helps.

my id :murali.v@emmosys.com

# re: JavaScript ASP.NET Rater control (Rating control): Sneak Peek 8/29/2007 3:54 AM Hardik

Do you also have star rating which displays half star rating ?

# Caching images | keyongtech 1/21/2009 11:14 PM Pingback/TrackBack

Caching images | keyongtech

# ASP.NET Rater Control 4/23/2009 7:25 AM Pingback/TrackBack

ASP.NET Rater Control

Post Feedback

Title:

Name:

Url:

Comments:

Enter the code you see:

Remember Me?

Mark Wagner's .NET C# Cogitation

News

Article Categories

Archives

Post Categories

.: Architecture Links :.

.: Developer Links :.

.Text and RSS Links

Blog Roll - Top Guns

Developer: .NET Security

Developer: C# Team

Developer: Flash

Developer: JavaScript

Developer: Pocket PC

Personal: Aviation

Personal: Favorites

Feedback

Post Feedback