close ad
Databridge V2 with MySQLi support IS Now Available!
open ad
View Menu

Technical Support Forums

Free, outstanding support from WebAssist and your colleagues

rating

Rating System for Dreamweaver?

Thread began 11/24/2009 1:46 pm by ijk76319396 | Last modified 2/16/2011 1:30 pm by biz295654 | 10496 views | 17 replies |

ijk76319396

Rating System for Dreamweaver?

Are there any systems that can help build a rating system, for example a user is looking at a particular page and they have the ability to rate it. I want to record that rating and have some way of displaying the average rating that all users have submitted for the specific page...Where do I begin with this one?

Sign in to reply to this post

clickhappy392103

I found a thread on this subject in another site that may help you with this.
view_topic.php?cat=1&otid=14165&forum_name=General&title=Rating%20Sytem%20Help

I have not really looked into it just yet, just bookmarked it for later when/and if I get some time.

hmm, I think the above is a bad link...
here's the direct link
css-star-rating-part-deux/

Sign in to reply to this post

Ray BorduinWebAssist

Here is a simple star rating javascript we use for our support incident ratings:

<script>
freeze = 0;
hasRated = false;
function point_it(event,freezeit){
pos_x = event.offsetX?(event.offsetX):event.pageX-document.getElementById("rating_image").offsetLeft;
pos_x = Math.round(pos_x/14)*14;
document.getElementById('rating_gradient').style.width = pos_x+"px";
if (freezeit) {
hasRated = true;
freeze = pos_x;
document.getElementById('hiddenRating').value = pos_x/28;
document.getElementById('RatingText').innerHTML = 'Current rating: <str' +'ong>'+(pos_x / 28)+'<\/strong>\/ 5';
}
}
function returntofreeze(){
document.getElementById('rating_gradient').style.width = freeze+"px";

}
</script>
How would you rate this?
<br />
<div id="rating_image" style="position:absolute"><img src="http://www.webassist.com/images/star_cutout.gif" width="140" height="28" alt="rating" onmousemove="point_it(event)" onclick="point_it(event,true)" onmouseout="returntofreeze()"/></div>
<div id="rating_gradient" style="width:0px;overflow:hidden;display:block;"><img src="http://www.webassist.com/images/star_gradient.jpg" width="140" height="28" /></div>
<input name="hiddenRating" type="hidden" id="hiddenRating" value="0" />
<div id="RatingText">Current rating: <strong>0</strong>/5</div>



You can probably just cut and paste it onto a form on your page and use the hidden form element to insert into a database or whatever else.

Sign in to reply to this post

ijk76319396

I've been trying to work in the star rating system you provided but it doesn't seem to work. I am putting the top half in the head section and the bottom half where I want it to appear but I only get a flat image that doesn't do anything. Here is the example

300.php

Sign in to reply to this post

Ray BorduinWebAssist

This is my fault for not putting it in a code window... the forum added random spaces in the javascript.

replace: .style.w idth

with: .style.width

and it should start working. I also updated my post to use a code window, so copy and paste again and it should fix it as well.

Sign in to reply to this post

ijk76319396

I used the sample from the link that was posted and it is working good but I need to have it do two things. One I want the stars to stay lit after I roll off of them and two how can i get the value into a database once I click submit?

300.php

I have figured out the stay lit part, still need to know how to get the value into a database...

Sign in to reply to this post

Ray BorduinWebAssist

The star rating is automatically inserted into a hidden form element named "hiddenRating". You can use that form element to update the database just like you would any other form element, by using an insert or update server behavior and specifying the hidden form element for the value.

You would put it in a form and either associate a button with it or add a formname.submit() javascript call to the onclick so that the form is automatically submitted and can be inserted.

Sign in to reply to this post

ijk76319396

Could you elaborate on the option of having what star I click be assigned to a hidden field with the form I am using at 300.php after it is recorded into the hidden field then the submit button will enter it into the database. I just need to know how to get the value of stars they click into the hidden field. Thanks.

Sign in to reply to this post

Ray BorduinWebAssist

Well you aren't even using the star rating script I suggested. You seem to have a some other star rating. You will need to add some script to update the hidden form. You would add a hidden form element to the form with the star rating system. Give it a value of 0 and an id of "hiddenFieldID".

Then use javascript to update it... something like:

<li><a href="javascript:document.getElementById('hiddenFieldID').value=1;" title="1 star out of 5" class="one-star">1</a></li>
<li><a href="javascript:document.getElementById('hiddenFieldID').value=2;" title="2 stars out of 5" class="two-stars">2</a></li>
<li><a href="javascript:document.getElementById('hiddenFieldID').value=3;" title="3 stars out of 5" class="three-stars">3</a></li>
<li><a href="javascript:document.getElementById('hiddenFieldID').value=4;" title="4 stars out of 5" class="four-stars">4</a></li>
<li><a href="javascript:document.getElementById('hiddenFieldID').value=5;" title="5 stars out of 5" class="five-stars">5</a></li>
Sign in to reply to this post

ijk76319396

I wrote the code just like in the example but it takes me to a different URL when I click on the stars and it shows the value. Please see the example, just click on any of the stars and you will see what I mean. The code looks like

<ul class="star-rating">
<li class="current-rating" style="width:50%;">Currently 2.5/5 Stars.</li>
<li><a href="javascript:document.getElementById('hiddenFieldID').value=1;" title="1 star out of 5" class="one-star">1</a></li>
<li><a href="javascript:document.getElementById('hiddenFieldID').value=2;" title="2 stars out of 5" class="two-stars">2</a></li>
<li><a href="javascript:document.getElementById('hiddenFieldID').value=3;" title="3 stars out of 5" class="three-stars">3</a></li>
<li><a href="javascript:document.getElementById('hiddenFieldID').value=4;" title="4 stars out of 5" class="four-stars">4</a></li>
<li><a href="javascript:document.getElementById('hiddenFieldID').value=5;" title="5 stars out of 5" class="five-stars">5</a></li>
</ul>
<input name="hiddenFieldID" type="hidden" id="hiddenFieldID" value="0" />

Sign in to reply to this post
loading

Build websites with a little help from your friends

Your friends over here at WebAssist! These Dreamweaver extensions will assist you in building unlimited, custom websites.

Build websites from already-built web applications

These out-of-the-box solutions provide you proven, tested applications that can be up and running now.  Build a store, a gallery, or a web-based email solution.

Want your website pre-built and hosted?

Close Windowclose

Rate your experience or provide feedback on this page

Account or customer service questions?
Please user our contact form.

Need technical support?
Please visit support to ask a question

Content

rating

Layout

rating

Ease of use

rating

security code refresh image

We do not respond to comments submitted from this page directly, but we do read and analyze any feedback and will use it to help make your experience better in the future.

Close Windowclose

We were unable to retrieve the attached file

Close Windowclose

Attach and remove files

add attachmentAdd attachment
Close Windowclose

Enter the URL you would like to link to in your post

Close Windowclose

This is how you use right click RTF editing

Enable right click RTF editing option allows you to add html markup into your tutorial such as images, bulleted lists, files and more...

-- click to close --

Uploading file...