Logo GNT
Actualités Tests & Guides Bons Plans
Twitter iPhone pliant OnePlus 11 PS5 Disney+ Orange Livebox Windows 11
Entraide Développement Développement Langage JavaScript Conserver des données dans un formulaire même après rechargemement de la page

Conserver des données dans un formulaire même après rechargemement de la page

7 réponses
Avatar
MARTIN Samuel
Bonjour à tous,

Voici mon script :
-----------------------------------------------------------------------------------------
function champs(champs){

if (champs.value == "" )
{
return 1;
}
else
{
return 0;
}

}



function verif() {
var message = "Merci de vérifier les champs suivants:";

if ((champs (document.formulaire.nom) == 0) && (champs
(document.formulaire.prenom)== 0) && (champs
(document.formulaire.sujet)== 0))
{
return true;
}
else
{
if (champs (document.formulaire.nom)==1){
message +="\n - Nom";
}
if (champs (document.formulaire.prenom)==1){
message +="\n - Prénom";
}
if (champs (document.formulaire.sujet) ==1){
message +="\n - Sujet";
}
alert(message);
return false;


}



}


--------------------------------------------------------------------------
Voila pour l'instant rien de bien compliqué, juste un début de test sur
des champs textes. Seulement lorsque le formulaire n'est pas
correctement rempli ( fonction verif s'exécute avec l'action OnSubmit)
nous avons l'affichage d'une fenêtre de type alert qui apparaît
seulement il y a rechargement de la page Web et donc perte de donnée
dans les champs, j'ai bien essayer de conserver les données de chaque
champs du formulaire et de les réatribuer après, mais cela m'est
impossible, y a t'il une solution pour pallier à ce problème? (en
Javascript), mise à part l'utilisation de PHP que je connais déjà mais
qui pour des raisons de consignes est interdit (IUT).


Je vous remercie d'avance pour vos réponses.


Autre question : Je procède ainsi , c'est à dire en 2 temps. Une page
en XHTML 1.0 avec javacript pour tester les champs puis ensuite l'envoi
de se formulaire se fait sur un fichier en PHP qui revérifie les
données et envoie finalement le mail. Pourquoi en 2 temps ? c'est année
le PHP n'est pas évalué, c'est pr cela que je sépare bien mon document
XHTML et javascript qui permettra d'être évaluer. En procédant ainsi,
suis je sur la bonne voie ? Je n'ai que peu d'expérience dans le
domaine,mais je suis prêt à revoir la totalité de mon script pour que
cela "colle au norme" et ainsi être valide au W3C.


Merci encore.


MARTIN Samuel (martin.sam@gmail.com)
Signaler un problème avec ce contenu

7 réponses

Supprimer
Cette action est irreversible, confirmez la suppression du commentaire ?
Signaler le commentaire

Veuillez sélectionner un problème

Nudité
Violence
Harcèlement
Fraude
Vente illégale
Discours haineux
Terrorisme
Autre
Avatar
BMR
Bonjour à tous,

Voici mon script :
-----------------------------------------------------------------------------------------

function champs(champs){

if (champs.value == "" )
{
return 1;
}
else
{
return 0;
}

}



function verif() {
var message = "Merci de vérifier les champs suivants:";

if ((champs (document.formulaire.nom) == 0) && (champs
(document.formulaire.prenom)== 0) && (champs
(document.formulaire.sujet)== 0))
{
return true;
}
else
{
if (champs (document.formulaire.nom)==1){
message +="n - Nom";
}
if (champs (document.formulaire.prenom)==1){
message +="n - Prénom";
}
if (champs (document.formulaire.sujet) ==1){
message +="n - Sujet";
}
alert(message);
return false;


}



}


--------------------------------------------------------------------------
Voila pour l'instant rien de bien compliqué, juste un début de test sur
des champs textes. Seulement lorsque le formulaire n'est pas
correctement rempli ( fonction verif s'exécute avec l'action OnSubmit)
nous avons l'affichage d'une fenêtre de type alert qui apparaît
seulement il y a rechargement de la page Web et donc perte de donnée
dans les champs, j'ai bien essayer de conserver les données de chaque
champs du formulaire et de les réatribuer après, mais cela m'est
impossible, y a t'il une solution pour pallier à ce problème? (en
Javascript), mise à part l'utilisation de PHP que je connais déjà mais
qui pour des raisons de consignes est interdit (IUT).


Je vous remercie d'avance pour vos réponses.


Autre question : Je procède ainsi , c'est à dire en 2 temps. Une page
en XHTML 1.0 avec javacript pour tester les champs puis ensuite l'envoi
de se formulaire se fait sur un fichier en PHP qui revérifie les
données et envoie finalement le mail. Pourquoi en 2 temps ? c'est année
le PHP n'est pas évalué, c'est pr cela que je sépare bien mon document
XHTML et javascript qui permettra d'être évaluer. En procédant ainsi,
suis je sur la bonne voie ? Je n'ai que peu d'expérience dans le
domaine,mais je suis prêt à revoir la totalité de mon script pour que
cela "colle au norme" et ainsi être valide au W3C.


Merci encore.


MARTIN Samuel ()


Q1 : si tu fais <form ... onsubmit="return verif(this)">
tu ne dois pas recharger la page, en cas d'erreur de champ, car ta
fonction verif() retourne faux.
En plus, si tu mets this en argument, ta fonction verif devient plus
simple :

function verif(formulaire) {
if ((champs (formulaire.nom) == 0) && (champs (formulaire.prenom)== 0)
&& (champs (formulaire.sujet)== 0))
...
}

Entre (), il suffirait de faire
if (formulaire.nom != "") && (formulaire.prenom != "") &&
(formulaire.sujet != "")

Q2 : Ca fait souvent l'objet de longues discussions : faut-il contrôler
les formulaires avec Javascript ou avec PHP/ASP... ? Il n'y a pas de
normes. D'un côté, ça me paraît plus léger de contrôler via JS car il
n'y a pas d'aller-retour serveur-client. D'un autre côté, si
l'utilisateur a désactivé JS, le formulaire part sans contrôle. Il vaut
mieux savoir en recevant le formulaire s'il a été contrôlé ou pas par JS
(p.ex en modifiant un champ caché). Evidemment, ça fait double
implémentation de contrôles... mais un seul contrôle, soit JS soit PHP
(dans ton cas).

BMR

Avatar
YD
Bonjour à tous,

Voici mon script :
-----------------------------------------------------------------------------------------

function champs(champs){

if (champs.value == "" )
{
return 1;
}
else
{
return 0;
}

}


Fonction totalement inutile - voir plus bas


function verif() {
var message = "Merci de vérifier les champs suivants:";

if ((champs (document.formulaire.nom) == 0) && (champs
(document.formulaire.prenom)== 0) && (champs
(document.formulaire.sujet)== 0))
{
return true;
}
else
{
if (champs (document.formulaire.nom)==1){
message +="n - Nom";
}
if (champs (document.formulaire.prenom)==1){
message +="n - Prénom";
}
if (champs (document.formulaire.sujet) ==1){
message +="n - Sujet";
}
alert(message);
return false;
}
}


function verif(f){
var message = "Merci de vérifier les champs suivants:";
if (f.nom && f.prenom && f.sujet)
return true;
if (!f.nom)message +="n - Nom";
if (!f.prenom)message +="n - Prénom";
if (!f.sujet)message +="n - Sujet";
alert(message);
return false;
}

Pour éviter le rechargement de la page :
<form action="..." method="..." onsubmit="return verif(this)">

Rmqs : - l'utilisation de this permet de passer l'objet formulaire à la
fonction verif et d'alléger le code et le moteur JS
- if(a) : si a est une chaîne vide, la valeur 0 ou nulle, a équivaut
à false, dans les autres cas a équivaut à true. Dans le script, if (!f.nom)
l'instruction qui dépend du if est exécutée si f.nom équivaut à false (si
c'est une chaîne vide en l'occurrence).

Autre question : Je procède ainsi , c'est à dire en 2 temps. Une page
en XHTML 1.0 avec javacript pour tester les champs puis ensuite l'envoi
de se formulaire se fait sur un fichier en PHP qui revérifie les
données et envoie finalement le mail. Pourquoi en 2 temps ? c'est année
le PHP n'est pas évalué, c'est pr cela que je sépare bien mon document
XHTML et javascript qui permettra d'être évaluer. En procédant ainsi,
suis je sur la bonne voie ? Je n'ai que peu d'expérience dans le
domaine,mais je suis prêt à revoir la totalité de mon script pour que
cela "colle au norme" et ainsi être valide au W3C.


Les scripts serveurs (PHP, ASP...) ne sont pas validés par les normes W3C.
Seul le résultat peut l'être : le document renvoyé (au format HTML).
La génération des pages côté serveur c'est ta cuisine.

--
Y.D.

Avatar
Patrick Mevzek

Q2 : Ca fait souvent l'objet de longues discussions : faut-il contrôler
les formulaires avec Javascript ou avec PHP/ASP... ? Il n'y a pas de
normes.


Bien sûr que si, il y a les bonnes pratiques et la logique.
On ne peut pas faire confiance à ce qui se passe sur le client.
Jamais. Dans aucun cas.

Donc, vérification *obligatoire* du côté du serveur.

Après, on peut doubler et faire une vérification du côté client, en
javascript, notamment pour éviter un aller retour mais c'est une
vérification *en plus* de celle sur le serveur, jamais à la place.

D'un côté, ça me paraît plus léger de contrôler via JS car il
n'y a pas d'aller-retour serveur-client. D'un autre côté, si
l'utilisateur a désactivé JS, le formulaire part sans contrôle. Il vaut
mieux savoir en recevant le formulaire s'il a été contrôlé ou pas par JS
(p.ex en modifiant un champ caché).


Et bien sûr le client peut modifier ce champ caché pour faire croire que
la vérification a eu lieu alors que ce n'est pas le cas.
Donc, ce n'est pas bon.
La vérification sur le serveur doit avoir lieu *systématiquement*

Evidemment, ça fait double
implémentation de contrôles... mais un seul contrôle, soit JS soit PHP
(dans ton cas).


Non. PHP obligatoire, et JS en plus si on veut.

--
Patrick Mevzek . . . . . . Dot and Co (Paris, France)
<http://www.dotandco.net/> <http://www.dotandco.com/>
Dépêches sur le nommage <news://news.dotandco.net/dotandco.info.news>

Avatar
MARTIN Samuel
Je remercie vivement chacun d'entre vous. Je vais pouvoir me remettre au
travail et ainsi tester le résultat.

J'ai bien noter l'importance des tests sur serveurs et des tests clients.
J'ai également apprécier la qualité rédactionnelle de chacun, c'est
vraiment très clair, merci notamment aux détails apporté par Y.D, qui
permettant de comprendre le sens des fonctions utilisées.



Merci à tous..



MARTIN.Samuel
Avatar
MARTIN Samuel
J'ai repris votre script en prenant soin de vérifier le nom de chacun de
mes "input" dans le formulaire correspondant. Par contre problème ,
rien ne se passe , au du moins il se fiche que les champs soit vides.
J'ai repris mon script qui est évidemment assez grand (par rapport au
votre Y.D) en rajoutant seulement return au niveau de l'action OnSubmit,
désormais je n'ai plus d'actualisation intempestive qui me fait perdre
les données saisies au niveau du formulaire. J'aimerais cependant
comprendre prquoi votre script ne fonctionne pas et ce même avec mes
efforts de parenthèsage.

Merci d'avance

MARTIN Samuel




Bonjour à tous,

Voici mon script :
-----------------------------------------------------------------------------------------

function champs(champs){
if (champs.value == "" )
{
return 1;
}
else
{
return 0;
}
}



Fonction totalement inutile - voir plus bas


function verif() {
var message = "Merci de vérifier les champs suivants:";
if ((champs (document.formulaire.nom) == 0) && (champs
(document.formulaire.prenom)== 0) && (champs
(document.formulaire.sujet)== 0))
{
return true;
}
else
{
if (champs (document.formulaire.nom)==1){
message +="n - Nom";
}
if (champs (document.formulaire.prenom)==1){
message +="n - Prénom";
}
if (champs (document.formulaire.sujet) ==1){
message +="n - Sujet";
}
alert(message);
return false;
}
}



function verif(f){
var message = "Merci de vérifier les champs suivants:";
if (f.nom && f.prenom && f.sujet)
return true;
if (!f.nom)message +="n - Nom";
if (!f.prenom)message +="n - Prénom";
if (!f.sujet)message +="n - Sujet";
alert(message);
return false;
}

Pour éviter le rechargement de la page : <form action="..." method="..."
onsubmit="return verif(this)">

Rmqs : - l'utilisation de this permet de passer l'objet formulaire à la
fonction verif et d'alléger le code et le moteur JS
- if(a) : si a est une chaîne vide, la valeur 0 ou nulle, a équivaut
à false, dans les autres cas a équivaut à true. Dans le script, if (!f.nom)
l'instruction qui dépend du if est exécutée si f.nom équivaut à false (si
c'est une chaîne vide en l'occurrence).

Autre question : Je procède ainsi , c'est à dire en 2 temps. Une page

en XHTML 1.0 avec javacript pour tester les champs puis ensuite
l'envoi de se formulaire se fait sur un fichier en PHP qui revérifie
les données et envoie finalement le mail. Pourquoi en 2 temps ? c'est
année le PHP n'est pas évalué, c'est pr cela que je sépare bien mon
document XHTML et javascript qui permettra d'être évaluer. En
procédant ainsi, suis je sur la bonne voie ? Je n'ai que peu
d'expérience dans le domaine,mais je suis prêt à revoir la totalité de
mon script pour que cela "colle au norme" et ainsi être valide au W3C.



Les scripts serveurs (PHP, ASP...) ne sont pas validés par les normes W3C.
Seul le résultat peut l'être : le document renvoyé (au format HTML).
La génération des pages côté serveur c'est ta cuisine.




Avatar
YD
J'ai repris votre script en prenant soin de vérifier le nom de chacun de
mes "input" dans le formulaire correspondant. Par contre problème ,
rien ne se passe , au du moins il se fiche que les champs soit vides.
J'ai repris mon script qui est évidemment assez grand (par rapport au
votre Y.D) en rajoutant seulement return au niveau de l'action OnSubmit,
désormais je n'ai plus d'actualisation intempestive qui me fait perdre
les données saisies au niveau du formulaire. J'aimerais cependant
comprendre prquoi votre script ne fonctionne pas et ce même avec mes
efforts de parenthèsage.


Une erreur répétée x fois ! Désolé. Ce qui est à tester n'est pas l'élément
de formulaire qui est un objet et donc renvoie toujours true dans un test
mais sa valeur (qui, elle, est une valeur chaîne) ! Donc version corrigée et
testée cette fois (la prochaine fois je me relirai) :

function verif(f){
if (f.nom.value && f.prenom.value && f.sujet.value)
return true;
var message = "Merci de vérifier les champs suivants:";
if (!f.nom.value) message +="n - Nom";
if (!f.prenom.value) message +="n - Prénom";
if (!f.sujet.value) message +="n - Sujet";
alert(message);
return false;
}

--
Y.D.

Avatar
MARTIN Samuel

J'ai repris votre script en prenant soin de vérifier le nom de chacun
de mes "input" dans le formulaire correspondant. Par contre problème
, rien ne se passe , au du moins il se fiche que les champs soit
vides. J'ai repris mon script qui est évidemment assez grand (par
rapport au votre Y.D) en rajoutant seulement return au niveau de
l'action OnSubmit, désormais je n'ai plus d'actualisation intempestive
qui me fait perdre les données saisies au niveau du formulaire.
J'aimerais cependant comprendre prquoi votre script ne fonctionne pas
et ce même avec mes efforts de parenthèsage.



Une erreur répétée x fois ! Désolé. Ce qui est à tester n'est pas l'élément
de formulaire qui est un objet et donc renvoie toujours true dans un test
mais sa valeur (qui, elle, est une valeur chaîne) ! Donc version
corrigée et
testée cette fois (la prochaine fois je me relirai) :

function verif(f){
if (f.nom.value && f.prenom.value && f.sujet.value)
return true;
var message = "Merci de vérifier les champs suivants:";
if (!f.nom.value) message +="n - Nom";
if (!f.prenom.value) message +="n - Prénom";
if (!f.sujet.value) message +="n - Sujet";
alert(message);
return false;
}

-- Y.D.

Oui voila, dans ma version, que j'ai plus au moins complété (champs

en rouge lorque une erreur est contastée, champs mail vérifier plus
minitieusement) j'ai utilisé "this" dans l'appel à la fonction mais de
façon inconsciente j'utilisais le .value, et je me suis même pas aperçu
que vous ne l'aviez pas spécifié dans votre script.

Je vous remercie encore une fois de tous les efforts que vous m'avez porté.

Désormais j'attaque la partie PHP avec les tests mais cette fois côté
Serveur.