Validation formulaire sans bouton submit

Version imprimable

Bonjour,

J'ai un formulaire à liste déroulante (pour trier une liste de livres) :

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
 
<?php 
 
 
<form action ="liste.php" method = "get">
<p>
<SELECT name="tri"class="tri_bandeau">
 
                
                
        <option value="titre"<?php if (isset($_GET['tri']) && $_GET['tri'] == "titre" ) {echo 'selected="selected"';} ?>>TITRE</option><!-- PERMET DE GARDER AFFICHAGE OPTION TRI -->
 
	<option value="date_publication<?php if (isset($_GET['tri']) && $_GET['tri'] == "date_publication" ) {echo 'selected="selected"';} ?>">DATE PUBLICATION</option>
 
	<option value="date_achat"<?php if (isset($_GET['tri']) && $_GET['tri'] == "date_achat" ) {echo 'selected="selected"';} ?>>DATE ACHAT</option>
 
	<option value="date_lecture"<?php if (isset($_GET['tri']) && $_GET['tri'] == "date_lecture" ) {echo 'selected="selected"';} ?>>DATE_LECTURE</option>
 
 
		<input type="radio" class="radio_tri_asc" name="senstri" value="ASC" id="ASC" checked="checked"  /> <label for="ASC" class="label_tri_asc">ASC</label>
		<input type="radio" class="radio_tri_desc" name="senstri" value="DESC" id="DESC" <?php if (isset($_GET['senstri']) && $_GET['senstri'] == "DESC" ) {echo 'checked="checked"';} ?> /> <label for="DESC" class="label_tri_desc">DESC</label>
		<label for="trier_par"class="trier_par">Trier les résultats par</label>
 
</SELECT>
 
	<input type="submit" value="Trier"/>
<p/>
<form/>
 
?>

Ce formulaire fonctionne : après avoir cliqué sur le bouton submit, le tri se fait bien. Mais ce que je souhaiterais obtenir avec javascript, c'est la même chose mais sans avoir à cliquer sur un bouton submit. Le fait de sélectionner une option dans le formulaire devrait pouvoir déclencher directement le tri. Ne connaissant pas javascript, pouvez-vous m'aider à obtenir l'effet souhaité ? Merci.

31/10/2010, 15h39
RomainVALERI

Essaie ceci :

Code:

<SELECT name="tri"class="tri_bandeau" onchange="this.form.submit();">
31/10/2010, 17h02
Bovino
Et au passage, tu devrais essayer d'être plus rigoureux avec la syntaxe :
- Le nom des balises en majuscule n'est pas conforme xhtml et pas cohérent avec l'ensemble de ton code.
- Il faut éviter les espaces entre un attribut, le signe = et la valeur de l'attribut.
- A l'inverse, il faut en mettre un avant tout nouvel attribut.
- Une balise fermante débute par le slash ("/"), donc <p/> et <form/>, c'est pas bon.
Enfin, je rappelle que JavaScript est du code client, donc concerne le code HTML généré, merci donc de se conformer aux règles de ce forum et de poster le code HTML et non PHP ;)
31/10/2010, 17h38
almoha
Merci à Bovino pour ses conseils de syntaxe dont je vais tacher à l'avenir de tenir compte.
Merci également à RomainVALERI car sa proposition répond à ma problématique ;) En testant, je me suis rendu compte que je souhaitais avoir le même effet lorsque je change le bouton radio sélectionné :
Code:

1 2 3 <input type="radio" name="senstri" value="ASC" id="ASC" checked="checked"/><label for="ASC">ASC</label> <input type="radio" name="senstri" value="DESC" id="DESC"/><label for="DESC">DESC</label>
J'ai essayé d'insérer ce code après les " name="senstri" " :

Code:

onchange="this.form.senstri();"

Mais cela ne fonctionne pas. Pouvez-vous m'aider à nouveau ? Merci d'avance.
31/10/2010, 17h59
Bovino

Code:

onchange="this.form.senstri();"

senstri(), c'est quoi ? :koi:

En tout cas, ce n'est pas une méthode native d'un objet de type formulaire...
31/10/2010, 18h08
almoha

senstri est l'attribut name des boutons radio. Quant au (), j'ai transposé le code :

Code:

onchange="this.form.submit();"

Mais comme je suis néophyte, je dois m'y prendre mal. Peux-tu m'apporter une aide supplémentaire ? Merci.
31/10/2010, 18h20
Bovino

Ah OK, donc senstri() est une sorte d'alias pour la méthode checkMyMindToGuessWhatToDo() ! :aie:

Plus sérieusement, submit() est une méthode propre à un objet formulaire pour forcer le submit.
Ensuite, si tu veux affecter un comportement à une action de l'utilisateur, il faut le définir au préalable dans une fonction.

Enfin, ne le prends pas mal, mais comme (malheureusement) beaucoup de débutants en JavaScript, je pense qu'il serait quand même préférable d'apprendre le langage avant de l'utiliser...
Bizarrement, ça semble évident pour la plupart des autres langages, mais pas pour JavaScript... :cry:
31/10/2010, 18h44
almoha

Au temps pour moi... Ce que tu dis est tout à fait vrai ;) Merci pour l'explicitation de la méthode submit(). Cela me permet de résoudre ma question sur les boutons radio :)
31/10/2010, 23h21
RomainVALERI

Citation:

Envoyé par Bovino

Enfin, ne le prends pas mal, mais comme (malheureusement) beaucoup de débutants en JavaScript, je pense qu'il serait quand même préférable d'apprendre le langage avant de l'utiliser...
Bizarrement, ça semble évident pour la plupart des autres langages, mais pas pour JavaScript... :cry:

Oui je n'ai jamais compris pourquoi ... :koi:
Et de plus en plus c'est aussi le cas avec PHP.

Cela dit, almoha fait heureusement partie de ceux qui :
1) parviennent à décrire leur problème (moyennement rare)
2) écoutent les conseils proposés (nettement plus rare)
3) sont courtois (assez répandu, et tant mieux :))

Citation:

Envoyé par Bovino

Ah OK, donc senstri() est une sorte d'alias pour la méthode checkMyMindToGuessWhatToDo() !

C'est pas bien ce que tu fais Bovino, maintenant faut que j'éponge le coca que j'ai mis partout avec mon nez. (aie ça pique :aie:)
01/11/2010, 10h49
Bovino

Citation:

Envoyé par RomainVALERI

C'est pas bien ce que tu fais Bovino, maintenant faut que j'éponge le coca que j'ai mis partout avec mon nez. (aie ça pique :aie:)

:mouarf:

Ca t'apprendra à boire du coca ! Avec de la bière, tu n'aurais eu que de la mousse !
Et oui, je suis parfois d'humeur taquine ;)