Bouton submit + Serveur

**LaeticiaM** · 28/03/2015, 15h16

Bonjour à tous,

j'ai un devoir à faire sur la création d'un site web, et j'ai quelques difficultés :

En fait je dois faire un champs de type input avec un texte pour une note d'appréciation de 1 à 10. et à sa droite mettre un bouton soumettre mais le problème c'est que le bouton soumettre doit s'activer après avoir marqué la note. et en cliquant la note doit être transmise à un serveur qui retiendra les 10 dernières notes. Et le bouton "Moyenne de notes" pourra faire la moyenne de ces 10 notes et l'afficher à sa droite.

Dans le script que j'ai fait j'arrive à faire afficher la note récupérée mais pas à le mettre dans le tableau "Valeurs".

Est-ce que vous pouvez m'aider par rapports à toutes ces interrogations svp?

voilà le code que j'ai :

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
<form name = "f">
  <label for="Note">Mettez une note d'appréciation du site de 1 à 10</label>
  <select name="list">
    <option value="0">0
    <option value="1">1
    <option value="2">2
    <option value="3">3
    <option value="4">4
    <option value="5">5
    <option value="6">6
    <option value="7">7
    <option value="8">8
    <option value="9">9
    <option value="10">10
  </select>
  <input type="submit" disabled = "true" id="soumettre" value="Soumettre" onClick="liste(f)"/>
  <input type="button" id="moyenne" value="Moyenne des notes" disabled="true"/>
</form>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
function liste(f){
	$('#soumettre').disabled = false;
	var valeurs = new Array(11);
	document.write(valeurs[0]=f.list.selectedIndex);
	alert("Le nombre choisi est : " + (f.list.selectedIndex));
}

**headmax** · 28/03/2015, 17h02

Salut, petite esquise il faut voir la doc jquery pour les différentes functions utilisées, pour désactivé le bouton moyenne il faut le faire via une requete ajax coté script et côté serveur générer un retour json pour les données soient exploitable côté client.

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
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
</head>
<body>
<form name = "f">
<label for="Note">Mettez une note d'appréciation du site de 1 à 10</label>
<select id="note_list" name="list">
<option value="0">0
<option value="1">1
<option value="2">2
<option value="3">3
<option value="4">4
<option value="5">5
<option value="6">6
<option value="7">7
<option value="8">8
<option value="9">9
<option value="10">10
</select>
<input type="submit" disabled = "true" id="soumettre" value="Soumettre" onClick="liste(f)"/>
<input type="button" id="moyenne" value="Moyenne des notes" disabled="true"/>
</form>
<script type="text/javascript">
 
$('#note_list').change(function() {
        $('#soumettre').removeAttr('disabled');
         console.log($(this).val())
});
</script>
</body>
</html>

**LaeticiaM** · 28/03/2015, 17h25

Merci pour ta réponse,
En fait pour l'instant c'est surtout le fait de réactiver les bouttons qui me posent problème. je n'arrive toujours pas à les mettre actifs après avoir sélectionner la note.

Je regarderai la doc jquery comme tu me l'as suggéré. merci

**headmax** · 28/03/2015, 20h06

En fait il faut supprimer l'attribut DISABLED car s'il est présent sur l'élément html il sera par defaut a true et le restera.
Donc pour y parvenir en jquery il faut passer par :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
$('#soumettre').removeAttr('disabled');

**LaeticiaM** · 28/03/2015, 21h46

merci pour ce coté là ca fonctionne, j'avais omis un léger détail dans le "input" pour le bouton soumettre.

mais là j'arrive a récupérer ma note et j'aimerai l'envoyer dans un Array de taille 10 qui se trouve dans le serveur. donc au clic du boutton soumettre je vais dans le serveur avec pour port (5050) pour pouvoir envoyer la note mais là je bloque. je ne sais pas vraiment comment m'y prendre.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
$(document).ready(function(){
   	$('#number').change(function(){
   		var val = f.list.selectedIndex
   		$('#soumettre').removeAttr('disabled');
   	});
	$("#soumission").click(function(){
		$.get("http://localhost:5050", function(data){
   			alert("Data: "+ f.list.selectedIndex);
   		});
   	});
});

Et mon code js :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
var http = require("http");
var url = require("url");
//var valeurs = new Array(10);
var server = http.createServer(function(req, res){
	var x = url.parse(req.url).query;
	console.log("la note est " + x);
});
server.listen(5050);

Bouton submit + Serveur

jQuery

Vue hybride

Discussions similaires

Partager

Partager