Bonjour je suis entrain de mettre en place un questionnaire sous Symfony et j'aimerais avec jquery/js cliquer sur mon bouton valider (qui enregistrera la réponse en bdd via ajax).

donc l'idée est de répondre a la question ensuite valider et passer a l'autre..en cachant la précédente .

j'arrive a les cacher avec un display none et afficher la première quelqu'un pourrais m'aider merci beaucoup.

ps:tout cela gérer dynamiquement


ici mon fichier Twig /html

Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
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
56
57
58
59
60
61
62
63
<div class="container-fluid " id="mon-blok {{question.id}}" style="display: none;">
 
	<div class="row ">
		<div class="col-md-3" {{question.backgroundleft|raw }}>
			<div class=" titre-processus">
				<p>Manger</p>
 
			</div>
 
			<div class="text-sous-processus">
				<p>{{question.sousProcessus}}<p>
			</div>
			<div class="img-numero"><img src="{{ asset('images/manger/PNG/' ~ question.PNG  ~ '') }}"
					style=" width: 220px;" /></div>
			<div class="text-sous-theme">
				<p>{{question.sousTheme}}</p>
			</div>
		</div>
		{#---------------------------------------------------------------------------------------#}
		{#---------------------------colonne droite----------------------------------------------#}
		{#---------------------------------------------------------------------------------------#}
		<div class="col-md-9" {{question.backgroundright|raw }}>
			<div class="titre-theme">
				<p><i>-{{question.theme}}</i></p>
			</div>
 
			<div class="question-alimentation">
				<p><i>-{{question.questions}}</i></p>
			</div>
			<form class="form-group" id="form{{question.id}}" action="{{ path('answer_save') }}" method="POST">
				<div class="reponse">
 
					<label for="{{question.niveau1}}{{question.id}}">{{question.niveau1}}<input type="radio"
							class="radio-pict" name="reponse"
							id="{{question.niveau1}}{{question.id}}" /></label><br><br>
 
					<label for="{{question.niveau2}}/{{question.id}}">{{question.niveau2}}<input type="radio"
							class="radio-pict" name="reponse"
							id="{{question.niveau2}}{{question.id}}" /></label><br><br>
 
					<label for="{{question.niveau3}}/{{question.id}}">{{question.niveau3}}<input type="radio"
							class="radio-pict" name="reponse"
							id="{{question.niveau3}}{{question.id}}" /></label><br><br>
 
					<label for="{{question.niveau4}}/{{question.id}}">{{question.niveau4}}<input type="radio"
							class="radio-pict" name="reponse"
							id="{{question.niveau4}}{{question.id}}" /></label><br><br>
 
					<label for="{{question.niveau5}}/{{question.id}}">{{question.niveau5}}<input type="radio"
							class="radio-pict" name="reponse"
							id="{{question.niveau5}}{{question.id}}" /></label><br><br>
 
					<label for="{{question.niveau6}}/{{question.id}}">{{question.niveau6}}<input type="radio"
							class="radio-pict" name="reponse"
							id="{{question.niveau6}}{{question.id}}" /></label><br><br>
 
				</div>
			</form>
			<div class="btn-valider">
				<button type="button" id="valider {{question.id}}" data-number="{{question.numquestion}}"
					data-formid="form{{question.id}}" class="valider btn-light btn-sm">Valider</button>
 
			</div>

et bien sur ma fonction js

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
var app = {
    init: function () {
 
        $($('.container-fluid')[0]).show();//affiche la premiere
 
        $('.valider').on('click', function (evt) {
            evt.preventDefault();
            var questionNumber = $(this).data('numquestion');
 
            $('#mon-blok' + questionNumber).hide();
 
        });
 
 
    }//fin init function
}//fin app
sujet resolu si jamais $(this).data('numquestion'); =>$(this).data('number');
je ne recuperais pas la valeur data exact et je r'ajoute un $('#mon-blok' + questionNumber).show(); apres l'avoir caché et un appel ajax au rechargment la question en cours se cache l'autre apparait nikel