Index.php:
Screenshot:
<body>
<form method="post">
<tr><td><label>Star Rating</label>
<select id="selection" name="starRating" class="starRating validate[required,custom[integer],min[1]] " >
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
<img src="images/star0.jpg" alt="Star Rating" height="16" id="thumb">
</td></tr></form></body></html>
Script:
<script src="//code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript">
$(document).ready(function(){
//<!-- JavaScript Star Rating method -->
caption=['Non Starred',
'1 Star',
'2 Star',
'3 Star',
'4 Star',
'5 Star'], // Star images caption
bp='images/', //base url
imgnum=6, //Number of your images.
thumb=document.getElementById('thumb'), //image id
description=document.getElementById('caption'), //Caption id
combobox=document.getElementById('selection'); // id
var val = document.getElementById('selection').value;
thumb.src=bp+'star'+val+'.jpg';
//description.innerHTML=caption[val];
combobox.onchange=function()
{
val = document.getElementById('selection').value;
thumb.src=bp+'star'+val+'.jpg';
description.innerHTML=caption[val];
}
//<!-- JavaScript Star Rating method Ends here-->
});
</script>
IF u Want to update the starrating in Database use the above Code:
<form method="post">
<tr>
<td>
<label>Star Rating</label>
<?php
$select=mysql_query("select * from star");
$row=mysql_fetch_array($select);
?>
<select id="selection" name="starRating" class="starRating validate[required,custom[integer],min[1]] " >
<option <?php
if ($row['star_rate'] == "")
{
?>
selected="selected" <?php } ?> value="0">0</option>
<option <?php
if ($row['star_rate'] == "1")
{
?> selected="selected" <?php } ?> value="1">1</option>
<option <?php
if ($row['star_rate'] == "2")
{
?> selected="selected" <?php } ?> value="2">2</option>
<option <?php
if ($row['star_rate'] == "3")
{
?> selected="selected" <?php } ?> value="3">3</option>
<option <?php
if ($row['star_rate'] == "4")
{
?> selected="selected" <?php } ?>value="4">4</option>
<option <?php
if ($row['star_rate'] == "5")
{
?> selected="selected" <?php } ?> value="5">5</option>
</select>
<img src="images/star0.jpg" alt="Star Rating" height="16" id="thumb">
</td>
</tr>
Star Image:(star0.jpg)
Star Image:(star1.jpg)
Star Image:(star2.jpg)
Star Image:(star3.jpg)
Star Image:(star4.jpg)
Star Image:(star5.jpg)
This Stars u can stored in it one image folder.
No comments:
Post a Comment