Intanto devi preparare il layout (io uso questo, preso da codepen):
HTML:
<form>
<div class="star-rating">
<input id="star-5" type="radio" name="rating" value="5" />
<label for="star-5" title="5 stars">
<i class="active fa fa-star fa-lg" aria-hidden="true"></i>
</label>
<input id="star-4" type="radio" name="rating" value="4" />
<label for="star-4" title="4 stars">
<i class="active fa fa-star fa-lg" aria-hidden="true"></i>
</label>
<input id="star-3" type="radio" name="rating" value="3" />
<label for="star-3" title="3 stars">
<i class="active fa fa-star fa-lg" aria-hidden="true"></i>
</label>
<input id="star-2" type="radio" name="rating" value="2" />
<label for="star-2" title="2 stars">
<i class="active fa fa-star fa-lg" aria-hidden="true"></i>
</label>
<input id="star-1" type="radio" name="rating" value="1" />
<label for="star-1" title="1 star">
<i class="active fa fa-star fa-lg" aria-hidden="true"></i>
</label>
</div>
</form>
Poi aggiungici uno stile CSS, per renderlo bello graficamente:
HTML:
.star-rating {
direction: rtl;
display: inline-block;
}
.star-rating input[type=radio] {
display: none
}
.star-rating label {
color: #bbb;
font-size: 22px;
padding: 0;
cursor: pointer;
-webkit-transition: all .3s ease-in-out;
transition: all .3s ease-in-out
}
.star-rating label:hover,
.star-rating label:hover ~ label,
.star-rating input[type=radio]:checked ~ label {
color: #f2b600
}
Poi devi prendere il numero di stelle che ha selezionato l'utente, io lo faccio senza ricaricare la pagina, usando jQuery e Ajax, direttamente quando l'utente clicca su una stelletta (senza dover schiacciare altri bottoni):
HTML:
$(document).ready(function(){
$('input[name=rating]').change(function(){
var voto = $( 'input[name=rating]:checked' ).val();
$.ajax({
type:'POST',
url:"valutation.php",
data:{'voto':voto},
success:function(fmsg){
},
error:function(){
alert('Some problem occured, please try again.');
}
});
});
});
Poi crei un file PHP dove prendi il voto selezionato dall'utente e lo inserisci nel database (io non so come è strutturato il tuo database)
PHP:
$voto = $_POST['voto'];
$sql = mysqli_query($conn, "..query per inserire nel db il voto");
Infine devi creare un'altra pagina, dove mostri le medie delle valutazioni, ma qui dovrei sapere come è strutturato il tuo database
