Formulaire - Notation par étoiles

Bonjour à tous,

Pour commencer, petite précision : je suis débutante en PHP et JS, j'essaie d'apprendre.

J'ai un système de formulaire pour poster un commentaire. Je récupère les données en PHP pour les insérer dans ma BDD.
J'aimerais y insérer un système de notation par étoiles, j'ai trouvé un exemple sympa ici : https://codepen.io/depy/pen/vEWWdw, que j'ai ajouté à mon formulaire et il fonctionne bien.
En revanche je n'arrive pas à récupérer la notation. Est-ce possible en PHP ou faut-il utiliser AJAX ?

Merci de votre aide !

Voici mon formulaire : (je peux vous copier/coller le reste du code si besoin :) )

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
 
<form action="index.php?url=addNewComment" method="post">
 
 
                        <div class="input-field col s12 m6 l3">
                            <select name="id_story" id="id_story">
                                <option value="1">Enigme 1</option>
                                <option value="2">Enigme 2</option>
                                <option value="3">Enigme 3</option>
                            </select>
                            <label for="id_story">Sélectionner l'énigme</label>
                        </div>
 
 
                        <div class="input-field col s12 m6 l7">
                            <input type="text" name="comment_title" id="comment_title">
                            <label for="comment_title">Titre du commentaire</label>
                        </div>
 
 
                        <div class='rating-widget col s12 m6 l2'>
                            <div class='rating-stars'>
                                <label for="stars">Evaluer cette énigme</label>
                                <ul id='stars'>
                                    <li class='star' title='Poor' data-value='1'>
                                        <i class='fa fa-star fa-fw'></i>
                                    </li>
                                    <li class='star' title='Fair' data-value='2'>
                                        <i class='fa fa-star fa-fw'></i>
                                    </li>
                                    <li class='star' title='Good' data-value='3'>
                                        <i class='fa fa-star fa-fw'></i>
                                    </li>
                                    <li class='star' title='Excellent' data-value='4'>
                                        <i class='fa fa-star fa-fw'></i>
                                    </li>
                                    <li class='star' title='WOW!!!' data-value='5'>
                                        <i class='fa fa-star fa-fw'></i>
                                    </li>
                                </ul>
                            </div>
                        </div>
 
 
                        <div class="input-field col s12 m8 l12">
                            <textarea name="comment" id="comment" class="materialize-textarea"></textarea>
                            <label for="comment">Rédiger le commentaire</label>
                        </div>
 
 
                        <div class="col s12 m6 l12 center">
                            <button type="submit" name="submit" class="btn waves-effect waves-light cyan darken-2">Poster mon commentaire</button>
                        </div>
 
                    </form>

Bonjour,

1- code HTML :

Code:

<input type="hidden" id="idNote" name="note" value="" />

2- code JS :
Code:

1 2 3 4 /* 2. Action to perform on click */ $('#stars li').on('click', function(){ //... $('#idNote').val(onStar); // met la note dans l input
Ainsi, tu récupères la note en PHP avec :

Code:

$note = $_POST['note'];

Merci infiniment, c'est exactement ce que j'essayais de faire !