Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    May 2007
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question help with a star rating script?

    hello all...
    I'm trying to get this star rating script to work. I've been battling with it for a while and can use some help...anyone up for the challenge? I have two rating bars and I can't figure out why it won't keep it's value after you click and roll off. Here's my whole page (note I haven't finished setting up the functions to work for the 2nd rating bar). Thanks!

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
     <HEAD>
      <TITLE> New Document </TITLE>
      <META NAME="Generator" CONTENT="EditPlus">
      <META NAME="Author" CONTENT="">
      <META NAME="Keywords" CONTENT="">
      <META NAME="Description" CONTENT="">
     <style type="text/css">
    #rate ul{
    margin:0;
    padding:0;
    height:20px;
    }
    #rate ul li {
    display:inline;
    height:20px;
    width:20px;
     }
    </style>
      <script language='javascript'>
     rate_f = "";  
     rate_b = "";  
     rate_o = "";  
     rate_a = "";  
     rate_ar = ""; 
    
    // on form submit we check form and build the variables to send to our php script
    function rate_rest(){
      //nothing yet
    }
    
    // when user clicks a star we set the star variable
    function rateclick(x){
      document.getElementById(x).src='images/star_hover.gif';
      x2 = x.substring(1);
      x3 = x.substring(0);
      rate_f = x2;
      rateover(x2, x3);
    }
    // onmouseover event .. kill all stars if rated and update the source on the rest of the stars
    function rateover(x,which){
      killem(which);
      switch(which){
    	case 'f':
    	  switch(x){
    		case 5:
    		  document.getElementById('f5').src='images/star_hover.gif';
    		case 4:
    		  document.getElementById('f4').src='images/star_hover.gif';
    		case 3:
    		  document.getElementById('f3').src='images/star_hover.gif';
    		case 2:
    		  document.getElementById('f2').src='images/star_hover.gif';
    		case 1:
    		  document.getElementById('f1').src='images/star_hover.gif';
    		  break;
    	  }
    	  break;
    	  case 'b':
    		switch(x){
    		case 5:
    		  document.getElementById('b5').src='images/star_hover.gif';
    		case 4:
    		  document.getElementById('b4').src='images/star_hover.gif';
    		case 3:
    		  document.getElementById('b3').src='images/star_hover.gif';
    		case 2:
    		  document.getElementById('b2').src='images/star_hover.gif';
    		case 1:
    		  document.getElementById('b1').src='images/star_hover.gif';
    		  break;
    	  }
    	  break;
    	}
    }
    // kills all the stars sources
    function killem(which){
    	switch(which){
    		case 'f':
    	          document.getElementById('f1').src='images/star.gif';
    			  document.getElementById('f2').src='images/star.gif';
    			  document.getElementById('f3').src='images/star.gif';
    			  document.getElementById('f4').src='images/star.gif';
    			  document.getElementById('f5').src='images/star.gif';
    		  break;
    		case 'b':
    			  document.getElementById('b1').src='images/star.gif';
    			  document.getElementById('b2').src='images/star.gif';
    			  document.getElementById('b3').src='images/star.gif';
    			  document.getElementById('b4').src='images/star.gif';
    			  document.getElementById('b5').src='images/star.gif';
    		 break;
    	  }
    	return true;
    
    }
    
    // onmouseout event that similarily kills the source
    function rateoff(x, which){
    	if(rate_f != "") {
    		rateover(rate_f, 'f');
    	} else {
    		killem('f');
    	}
    }
      </script>
     </HEAD>
    
     <BODY>
     
    <div class="verbage" id="rest_actions">
    <div id="rate">
    Your Email<span style="font-size:10px;"> (Not Required)</span><br/><input type="text" id="email"/>
    <br/><br/>
    <ul>
    <li><img onmouseout="rateoff(1,'f')" onmouseover="rateover(1,'f')" onclick="rateclick('f1')" id="f1" alt="1" src="images/star.gif"/></li>
    <li><img onmouseout="rateoff(2,'f')" onmouseover="rateover(2,'f')" onclick="rateclick('f2')" id="f2" alt="2" src="images/star.gif"/></li>
    <li><img onmouseout="rateoff(3,'f')" onmouseover="rateover(3,'f')" onclick="rateclick('f3')" id="f3" alt="3" src="images/star.gif"/></li>
    <li><img onmouseout="rateoff(4,'f')" onmouseover="rateover(4,'f')" onclick="rateclick('f4')" id="f4" alt="4" src="images/star.gif"/></li>
    <li><img onmouseout="rateoff(5,'f')" onmouseover="rateover(5,'f')" onclick="rateclick('f5')" id="f5" alt="5" src="images/star.gif"/></li>
    </ul>
    <ul>
    <li><img onmouseout="rateoff(1,'b')" onmouseover="rateover(1,'b')" onclick="rateclick('b1')" id="b1" alt="1" src="images/star.gif"/></li>
    <li><img onmouseout="rateoff(2,'b')" onmouseover="rateover(2,'b')" onclick="rateclick('b2')" id="b2" alt="2" src="images/star.gif"/></li>
    <li><img onmouseout="rateoff(3,'b')" onmouseover="rateover(3,'b')" onclick="rateclick('b3')" id="b3" alt="3" src="images/star.gif"/></li>
    <li><img onmouseout="rateoff(4,'b')" onmouseover="rateover(4,'b')" onclick="rateclick('b4')" id="b4" alt="4" src="images/star.gif"/></li>
    <li><img onmouseout="rateoff(5,'b')" onmouseover="rateover(5,'b')" onclick="rateclick('b5')" id="b5" alt="5" src="images/star.gif"/></li>
    </ul>
    <br/><br/>
    Review This<br/>
    <textarea id="review" cols="30" rows="5"></textarea>
    <br/><br/>
    <input type="button" value="Submit Review" onclick="rate_rest()"/>
    </div>
    </div>			  
     </BODY>
    </HTML>

  • #2
    Senior Coder CFMaBiSmAd's Avatar
    Join Date
    Oct 2006
    Location
    Denver, Colorado USA
    Posts
    3,146
    Thanks
    2
    Thanked 333 Times in 325 Posts
    To make a rating system useful, the votes must be "globally" remembered between visits and accessible among all visitors.

    Javascript by itself cannot make the values for one visitor accessible to any other visitor. Only a server side scripting language can do this.

    You could store the votes in a cookie for any visitor, but this would just allow that visitor to change his own local vote and the cookie is only available when that visitor is on your web site. This does not allow votes for different visitors to be combined.
    If you are learning PHP, developing PHP code, or debugging PHP code, do yourself a favor and check your web server log for errors and/or turn on full PHP error reporting in php.ini or in a .htaccess file to get PHP to help you.

  • #3
    New to the CF scene
    Join Date
    May 2007
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Absolutely, I know that...I'll be using PHP and MySQL. I'm just trying to get the interface started first.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •