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


/ Published in: JavaScript
Save to your folder(s)

Get value from 5 Star Rating


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.