Discussion :

[lysandro]

Merci lysandro de ton soutient pour mon code ...

Euh merci, mais c'est plutôt toi que je soutiens que ton code il est qd mm plein de ... fonctionnalités

Comme l'ont souligné, au moins, Auteur, Bovino et SpaceFrog, le html généré est incorrect. Ce serait bien de le corriger.

Reset or not reset ?

Sur un formulaire on peut avoir :
- un bouton submit : input type="submit"
- un bouton reset : input type="reset"

Comme l'on expliqué Bovino et Spacefrog, le bouton reset se contente de remettre les contrôles du formulaire à leur état initial.
Cet état initial est l'état connu au chargement de la page. Par exemple :

Avec une page initiale à :

Code html :

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

1
2
3
4
5
6
7
8
9
10
11
    ...
    <form>
        ...
        <select>
            <option value="1" selected>un</option>
            <option value="2">deux</option>
        </select>
        ...
        <input type="reset" value="reset" />
    </form>
    ...

Si l'utilisateur sélectionne 'deux', "2" sera la valeur du select.
Si maintenant il appuie sur le bouton reset, le ""navigateur"" va remettre la valeur du select à "1" qui est la valeur de l'option 'selected'.

Ce type de bouton ne fonctionnera pas dans ton formulaire, parce que : (si je reprends le même exemple)

Si l'utilisateur sélectionne 'deux', "2" sera la valeur du select.
MAIS tu soumets ton formulaire, c'est à dire que tu regénère ta page en PHP et elle revient modifiée :

Code html :

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

1
2
3
4
5
6
7
8
9
10
11
    ...
    <form>
        ...
        <select>
            <option value="1">un</option>
            <option value="2" selected>deux</option>
        </select>
        ...
        <input type="reset" value="reset" />
    </form>
    ...

Si maintenant il appuie sur le bouton reset, le ""navigateur"" va remettre la valeur du select à "2" qui est MAINTENANT la valeur de l'option 'selected' donc ça ne fait pas ce que tu attends.

A moins de changer la logique de ton code, ce qui consisterait à déporter les traitements que tu fais en PHP vers du Javascript dans la page, comme le proposent Bovino, SpaceFrog et SylvainPV, cela ne fonctionnera jamais.


Tes questions

pourquoi lorsque je mets les deux boutons dans le même form, mon site ne réagis plus du tout pareil et sachant que le bouton reset ne marche pas

Si tu mets une deuxième bouton submit dans ton formulaire, que se passe-t-il lors de l'appui sur ce bouton ?

La même chose qu'avec l'autre bouton submit déjà présent dans le formulaire :
- tu soumets ta page. Avec les contrôles et leurs valeurs.

Donc, au niveau de PHP, si tu veux faire la différence entre les deux états, il faut tester ce que tu récupères comme contrôles et leurs valeurs (je parle des boutons submit).
En fonction du bouton submit utilisé, tu devrais savoir si c'est une "sauvegarde" ou une "réinitialisation".
Tant que tu ne testes pas quel bouton a été utilisé, tu ne le sais pas.

Voilà pourquoi ça ne fonctionne pas.

Pour que ça fonctionne

En HTML4 et HTML5, un seul des deux boutons sera soumis (sous réserve qu'il ait un attribut 'name' valide, qu'il ne soit pas 'disabled', etc.) : celui utilisé.

Tu pourrais donc mettre

Code html :

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

1
2
3
4
5
6
7
    ...
    <form>
        ...
        <input name="submit" type="submit" value="submit" />
        <input name="reset"  type="submit" value="reset" />
    </form>
    ...

Et tester dans ton PHP un truc du genre (mais je n'y connais rien)

Code php :

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

1
2
3
4
5
 
    $RESET = ( $_POST['RESET'] == 'reset' );
    ...
    if ( $RESET )
       ...

On devrait même pourvoir leur donner le même 'name' :

Code html :

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

1
2
3
4
5
6
7
    ...
    <form>
        ...
        <input name="action" type="submit" value="submit" />
        <input name="action" type="submit" value="reset" />
    </form>
    ...

Et tester

Code php :

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

1
2
3
4
    $RESET = ( $_POST['ACTION'] == 'reset' );
    ...
    if ( $RESET )
       ...

les pros sauront te conseiller.

Alors qu'avec mon deuxième formulaire il fonctionne ?

Dans ta solution actuelle, comme tu as créé un deuxième formulaire, qui lui ne contient AUCUN contrôle, quand on appuie sur le bouton submit, ton formulaire est soumis sans données, ton code PHP réinitialise ta page.

Voilà pourquoi ça fonctionne.

Quelle solution adopter ?

Bin ça dépend essentiellement de toi : si tu es aussi l'aise en Javascript qu'en PHP, que tu as le temps pour une refonte assez importante, ...

Quelques reflexions :

- comme tu fais de la validation incrémentale :

+ l'utilisateur, au travers du bouton "back" de son navigateur, peut revenir facilement à l'état précédent de sa saisie, impossible en AJAX
+ il est assez facile de migrer vers du code sans Javascript du tout, le javascript dans un navigateur étant un trou de sécurité en lui même
= je ne sais pas si elle est nécessaire n'ayant pas analysé ton code en profondeur
- ça augmente le traffic réseau en nombre et en volume par rapport à une solution AJAX
- ça augmente la charge du serveur par rapport à une solution AJAX

- une solution AJAX :

+ meilleurs temps de réponse ("expérience utilisateur" comme on dit)
+ meilleure maintenabilité du coté PHP : plus de pages mais plus petites et plus simples
- basée sur de l'évènementiel asynchrone, pas la technique de programmation la plus simple à maitriser
- grosse refonte de code

[cahuet-200]

D'accord merci a toi lysandro,

J'ai bien compris tes explications, malheureusement je ne connais pas du tout le js ou ajax ..
Au niveau de mon code html j'ai retrouver du code qui était dans un include que j'avais totalement oublier, mais l'on ma dis de supprimer le balise font, table et center.

J'ai donc essayer de le faire mais ma page par la suite ne ressemble plus a rien et je ne sais pas par quoi les remplacer ..

En essayant le code :

Code :

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

1
2
3
	echo "	<br/><input id='Submit' type='Submit' name='valid' value='Sauvegarder' style='widht=100px'>";			
		echo " <input type='Submit' name='reset' value='Reset' style='widht=100px'>";	
		echo "	<br/></form>";

ou celui ci :

Code :

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

1
2
3
		echo "	<br/><input id='Submit' type='Submit' name='valid' value='Sauvegarder' style='widht=100px'>";			
		echo " <input type='reset' name='reset' value='Reset' style='widht=100px'>";	
		echo "	<br/></form>";

Aucun ne fonctionne pour mon cas.. donc je pense que je vais abandonné mon idée ..

[lysandro]

Au niveau de mon code html j'ai retrouver du code qui était dans un include que j'avais totalement oublier, mais l'on ma dis de supprimer le balise font, table et center.

J'ai donc essayer de le faire mais ma page par la suite ne ressemble plus a rien et je ne sais pas par quoi les remplacer ..

Je pense qu'il/ils veule/nt te faire passer par des feuilles de styles pour la présentation, donc remplacer font, table, center par des CSS. Mais il/ils va/vont te guider ou au moins t'orienter vers des tutoriaux.

En essayant le code :
...
Aucun ne fonctionne pour mon cas..

Le premier code ne fonctionnera que si tu le testes dans ton code PHP ... L'idée est la suivante : si tu reçois une page vide (cas du deuxième formulaire de ta page, celui avec un seul bouton submit), dans le PHP tous les champs sont vides, et tu réinitialise ta page.

Donc, si tu mets ton deuxième bouton submit dans le premier formulaire (le premier code de ton post précédent), il faut récupérer l'information pour savoir si c'est une sauvegarde ou une réinitialisation avec un truc comme $_POST['RESET'], tester si c'est bien la valeur que tu as mise : 'Reset'.

Puis, à partir de là, partout où dans ton PHP tu renseignes ta page en fonction des valeurs utilisateurs (les $POST[...]) si tu as reset, tu fais comme si ses valeurs étaient absentes ou vide. Je te donnerais bien un exemple avec ton code, mais ne connaissant pas PHP, je risque d'écrire des bétises.

Le deuxième code ne fonctionnera jamais, relire les post précédents.

[cahuet-200]

D'accord très bien merci beaucoup en tout cas pour votre aide =)
Je vais essayer d'avoir un peux plus de renseignements pour faire la feuille de css ou autre.

Merci encore a toi lysandro =)

[Auteur]

une remarque sur le code posté par lysandro qui a écrit :

Code :

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

<option value="1" selected>un</option>

les normes W3C demandent à ce que chaque attribut soit suivi d'une valeur. Donc il faut écrire :

Code :

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

<option value="1" selected="selected">un</option>

ça fait doublon mais c'est cette écriture qu'il faut privilégier.

[Bovino]

C'est vrai uniquement pour le xhtml qui impose de respecter la syntaxe XML et donc tout attribut doit avoir une valeur. En revanche, HTML est assez permissif pour la syntaxe et les attributs type booléen peuvent être écrits sans valeur. Quant à HTML5, il accepte aussi bien la syntaxe xhtml que HTML, donc les deux sont valides.

A noter aussi que même en xhtml, c'est la présence de l'attribut qui est importante et non sa valeur, donc

Code html :

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

<option value="1" selected="toto">un</option>

revient exactement au même que

Code html :

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

<option value="1" selected="selected">un</option>

Au passage, il est aussi possible en HTML de ne pas fermer certaines balises, donc

Code html :

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

<option value="1" selected="toto">un

est tout aussi correct ainsi que

Code html :

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

<input>

[SylvainPV]

Oui les boolean attributes sont les seuls attributs qui peuvent ne pas prendre de valeur. L'extrait de la spec correspondant : https://html.spec.whatwg.org/#boolean-attributes

Par contre le coup de ne pas fermer la balise <option> ce n'est pas correct, ça ne fait pas partie de la spec. C'est peut-être toléré par la plupart des navigateurs qui ferment les balises automatiquement lors de la phase de parsing du DOM, mais la nuance entre "correct" et "toléré" est importante En revanche, HTML5 décrit plusieurs éléments comme n'ayant pas besoin de fermeture de balise: <input>, <img>, <br>...

[Bovino]

ça ne fait pas partie de la spec.

Au temps pour moi alors, j'ai peut-être mal compris le sens de

An option element's end tag may be omitted if the option element is immediately followed by another option element, or if it is immediately followed by an optgroup element, or if there is no more content in the parent element.

Source

[SylvainPV]

Tiens donc, on dirait que je ne suis plus à la page. Mea culpa. Du coup je suis assez perplexe, comment distinguer <option>contenu</option> de <option></option>contenu ?

edit : http://www.w3.org/TR/html5/syntax.ht...x-tag-omission
Encore plus perplexe... on peut omettre certaines balises ouvrantes aussi ! En fait, ils semblent qu'ils ont intégré dans la spécification toute la partie tolérance d'erreur des algos de parsing HTML. Dire qu'il n'y a pas si longtemps, je passais tous mes sites sur http://validator.w3.org/