Advanced Search

Get value from Radio inputs in JavaScript (5 Star Rating)

/ Published in: JavaScript
Save to your folder(s)
Get value from 5 Star Rating

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. //HTML:
  2. <form class="rating" method="post">
  3.             <input type="radio" id="star5" name="rating" value="5" onclick="postToController();" /><label for="star5" title="Super !!">5 stars</label>    
  4.             <input type="radio" id="star4" name="rating" value="4" onclick="postToController();" /><label for="star4" title="Geil">4 stars</label>
  5.             <input type="radio" id="star3" name="rating" value="3" onclick="postToController();" /><label for="star3" title="Gut">3 stars</label>
  6.             <input type="radio" id="star2" name="rating" value="2" onclick="postToController();" /><label for="star2" title="So gut wie">2 stars</label>
  7.             <input type="radio" id="star1" name="rating" value="1" onclick="postToController();" /><label for="star1" title="Schlecht">1 star</label>
  8. </form>
  9.  
  10.  
  11. //Javascript:
  12. function postToController() {
  13.         for (i = 0; i < document.getElementsByName('rating').length; i++) {
  14.                 if(document.getElementsByName('rating')[i].checked == true) {
  15.                     var ratingValue = document.getElementsByName('rating')[i].value;
  16.                     break;
  17.                 }
  18.         }
  19.         alert(ratingValue);
  20. }

URL: http://leaverou.me/2011/08/accessible-star-rating-widget-with-pure-css/

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.