IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

HTML Discussion :

[XHTML] Problème avec les champs obligatoires d'un formulaire


Sujet :

HTML

  1. #1
    Futur Membre du Club
    Profil pro
    Inscrit en
    Août 2006
    Messages
    18
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Août 2006
    Messages : 18
    Points : 5
    Points
    5
    Par défaut [XHTML] Problème avec les champs obligatoires d'un formulaire
    Bonjour, après plusieurs jour de mise en ligne de mon site, j'ai élaboré un formulaire mais j'ai un problème avec les champs obligatoires.

    pouvez-vous m'aider ?

    voici le code html de ma page :

    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
    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
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
      <script>function checkrequired(which){
    var pass=true
    if (document.images){
    for (i=0;i<which.length;i++){
    var tempobj=which.elements[i]
    if (tempobj.name.substring(0,8)=="required"){
    if (((tempobj.type=="text"||tempobj.type=="textarea")&&tempobj.value=='')||(tempobj.type.toString().charAt(0)=="s"&&tempobj.selectedIndex==-1)){
    pass=false
    break
    }
    }
    }
    }
    if (!pass){
    alert("Certains champs de ce formulaire sont obligatoires, merci de bien vouloir les renseigner")
    return false
    }
    else
    return true
    }
      </script>
      <meta
     content="text/html; charset=ISO-8859-1"
     http-equiv="content-type">
      <title>commentaire</title>
    </head>
    <body
     style="background-image: url(../photos/write035.gif);">
    <form
     action="http://perso0.free.fr/cgi-bin/form2mail.pl"
     onsubmit="return checkrequired(this)" method="post">
      <div style="text-align: center;"><br>
      <big style="color: rgb(255, 0, 0);"><big
     style="font-family: Footlight MT Light;"><span
     style="font-weight: bold;">POSTER
    UN COMMENTAIRE</span></big></big><br>
      <br>
      <div
     style="text-align: left; font-style: italic;">
      <div style="text-align: center;"><img
     style="width: 25px; height: 23px;" alt="attention !"
     src="../photos/constructions-panneaux15.gif">&nbsp;&nbsp;&nbsp;
    Cet
    espace est uniquement
    r&eacute;serv&eacute; aux commentaires consernant les montages
    photos,
    pour faire un commentaire sur l'ensemble du site, <a
     href="http://livredor.hiwit.org/index.php?idsite=12256&amp;zone=e">signez
    le livre d'or</a>.<br>
      </div>
      <small><br>
      <span style="color: rgb(255, 0, 0);">*
      <span style="font-family: Harrington;">Champs
    obligatoires</span><br
     style="font-family: Harrington;">
      <br style="font-family: Harrington;">
      </span></small>
      <div
     style="text-align: center; color: rgb(51, 0, 153); font-family: Harrington;"><small>Veillez
    &agrave; ce que vos messages soit lisibles,
    compr&eacute;hensibles et sans fautes d'ortographes volontaires
    (type
    texto). Merci.</small></div>
      </div>
      <br>
      </div>
      <fieldset> <legend
     style="color: rgb(255, 204, 0); font-weight: bold; font-family: Kristen ITC;">&nbsp;Vos
    coordonn&eacute;es&nbsp;</legend>
    <!-- Titre du fieldset --><span
     style="color: rgb(255, 0, 0);"><br>
    * </span><small
     style="color: rgb(0, 0, 0);"><span
     style="font-family: Lucida Sans;">Votre nom :</span></small>
      <input
     style="font-family: Courier; color: rgb(102, 51, 255);"
     name="nom"><br>
      <br>
      <span style="color: rgb(255, 0, 0);">*
      </span><small
     style="font-family: Lucida Sans;">Votre adresse
    E-mail : </small><input
     style="color: rgb(102, 51, 255); font-family: Courier;"
     name="e-mail"><br>
      <br>
      <small><label
     style="font-family: Lucida Sans;">Site Web perso :<br>
      <textarea style="color: rgb(102, 51, 255);"
     cols="50" rows="1" name="url perso"></textarea></label></small></fieldset>
      <p> </p>
      <fieldset><legend><span
     style="font-family: Kristen ITC; color: rgb(255, 204, 0); font-weight: bold;">&nbsp;Votre
    commentaire</span> &nbsp;</legend>
    <!-- Titre du fieldset -->
      <p></p>
      <small><label
     style="font-family: Lucida Sans;">Titre
    du commentaire :<br>
      <input
     style="font-family: Courier; color: rgb(102, 51, 255);"
     maxlength="100" size="50" name="titre">
      </label></small><br>
      <label> </label><br>
      <span style="color: rgb(255, 0, 0);">*
      </span><small><span
     style="font-family: Lucida Sans;">Commentaire :</span></small>
      <br>
      <textarea
     style="font-family: Courier; color: rgb(102, 51, 255);"
     name="commentaire" cols="50" rows="10"
     commentaire=""></textarea></fieldset>
      <br>
      <div style="text-align: center;"><input
    name="submit" value=" &nbsp; &nbsp; Envoyer &nbsp; &nbsp; " type="submit">&nbsp;&nbsp;&nbsp;<input
     value="Recommencer" name="reset" type="reset">
      </div>
      <p
     style="text-align: center; font-family: Perpetua; color: rgb(204, 153, 51);"><big><span
     style="font-weight: bold; text-decoration: underline;">Note
    :</span> Votre commentaire va
    &ecirc;tre envoy&eacute; &agrave;
    l'administrateur du site. Il sera mis en ligne dans les prochains
    jours.</big></p>
      <p
     style="text-align: center; font-family: Perpetua; color: rgb(204, 153, 51);"><big>Toutefois,
    si l'administrateur exige qu'il ne doit pas
    &ecirc;tre difus&eacute;, vous&nbsp;serez
    inform&eacute;s par
    mail des diverses raisons de son refus.</big></p>
      <div style="text-align: center;"><big
     style="font-family: Gourmand;"><a
     href="liste_commentairespage%20type.html">Lire les
    Commentaires</a></big></div>
    </form>
    </body>
    </html>

    lorsque j'ai fait un test je me suis apperçue que meme les champs obligatoires vides, le message été envoyé.

    merci pour votre aide.

    élodie

  2. #2
    Membre expert
    Avatar de trotters213
    Profil pro
    Inscrit en
    Janvier 2005
    Messages
    2 571
    Détails du profil
    Informations personnelles :
    Âge : 38
    Localisation : France, Gard (Languedoc Roussillon)

    Informations forums :
    Inscription : Janvier 2005
    Messages : 2 571
    Points : 3 145
    Points
    3 145
    Par défaut

    ton code est bourré de fautes ça vient peut-être de là
    Déjà ton javascript déclare le ainsi :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    <script language="javascript" type="text/javascript">
    Ensuite
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    <textarea
    style="font-family: Courier; color: rgb(102, 51, 255);"
     name="commentaire" cols="50" rows="10"
     commentaire="">
    commentaire n'est pas un attribut de textarea.
    Après je te passe toutes les balises non fermées style <br>.Je n'y connais pas grand chose en javascript mais tu ne mets jamais de ";" en fin de ligne de commande, c'est pas bon je crois.
    Essaie plutôt ainsi :
    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
    17
    18
    19
    20
    21
    22
    23
    24
    function checkrequired(which){
    	var pass=true;
    	if (document.images)
    	{
    		for (i=0;i<which.length;i++)
    		{
    			var tempobj=which.elements[i]
    			if (tempobj.name.substring(0,8)=="required")
    			{
    				if (((tempobj.type=="text"||tempobj.type=="textarea")&&tempobj.value=='')||(tempobj.type.toString().charAt(0)=="s"&&tempobj.selectedIndex==-1))
    				{
    					pass=false;
    					break;
    				}
    			}
    		}
    	}
    	if (!pass)
    	{
    		alert("Certains champs de ce formulaire sont obligatoires, merci de bien vouloir les renseigner");
    		return false;
    	}
    	else return true;
    }
    Dis nous ce qui en ressort après

  3. #3
    Futur Membre du Club
    Profil pro
    Inscrit en
    Août 2006
    Messages
    18
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Août 2006
    Messages : 18
    Points : 5
    Points
    5
    Par défaut
    merci pour les infos, je vais faire ce que tu m'a indiqué. moi aussi j'y connait rien en se language a par quelques petit trucs mais vraiment minimes.
    je le met en ligne et je te tien au courrant. merci élodie

  4. #4
    Futur Membre du Club
    Profil pro
    Inscrit en
    Août 2006
    Messages
    18
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Août 2006
    Messages : 18
    Points : 5
    Points
    5
    Par défaut
    vola, jai modifié les codes et mis en ligne mais rien n'a changé, le message est quand même envoyé. il doit encore y avoir une erreur, je vais essayer de la trouver.

  5. #5
    Membre expert
    Avatar de trotters213
    Profil pro
    Inscrit en
    Janvier 2005
    Messages
    2 571
    Détails du profil
    Informations personnelles :
    Âge : 38
    Localisation : France, Gard (Languedoc Roussillon)

    Informations forums :
    Inscription : Janvier 2005
    Messages : 2 571
    Points : 3 145
    Points
    3 145
    Par défaut
    bon voilà ton code remis de manière lisible (j'avais jamais vu un code aussi b...lique ):
    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
    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
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
         "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
      	<script language="javascript" type="text/javascript">
    	function checkrequired(which){
    		var pass=true;
    		if (document.images)
    		{
    			for (i=0;i<which.length;i++)
    			{
    				var tempobj=which.elements[i]
    				if (tempobj.name.substring(0,8)=="required")
    				{
    					if (((tempobj.type=="text"||tempobj.type=="textarea")&&tempobj.value=='')||(tempobj.type.toString().charAt(0)=="s"&&tempobj.selectedIndex==-1))
    					{
    						pass=false;
    						break;
    					}
    				}
    			}
    		}
    		if (!pass)
    		{
    			alert("Certains champs de ce formulaire sont obligatoires, merci de bien vouloir les renseigner");
    			return false;
    		}
    		else return true;
    	}
      	</script>
      	<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">
      	<title>commentaire</title>
    </head>
    
    <body style="background-image: url(../photos/write035.gif);">
    <form action="http://perso0.free.fr/cgi-bin/form2mail.pl" onsubmit="return checkrequired(this)" method="post">
    	<div style="text-align: center;">
    		<br>
    		<big style="color: rgb(255, 0, 0);">
    			<big style="font-family: Footlight MT Light;">
    				<span style="font-weight: bold;">POSTERUN COMMENTAIRE</span>
    			</big>
    		</big>
    		<br><br>
    		<div style="text-align: left; font-style: italic;">
    				<div style="text-align: center;">
    					<img style="width: 25px; height: 23px;" alt="attention !" src="../photos/constructions-panneaux15.gif">
    					&nbsp;&nbsp;&nbsp;
    					Cet espace est uniquement r&eacute;serv&eacute; aux commentaires consernant les montages photos, pour faire un commentaire sur l'ensemble du site, 
    					<a href="http://livredor.hiwit.org/index.php?idsite=12256&amp;zone=e">signez le livre d'or</a>.
    					<br>
    				</div>
    				<small>
    					<br>
    					<span style="color: rgb(255, 0, 0);">*
    						<span style="font-family: Harrington;">Champs obligatoires</span>
    						<br style="font-family: Harrington;">
    						<br style="font-family: Harrington;">
    					</span>
    				</small>
    			<div style="text-align: center; color: rgb(51, 0, 153); font-family: Harrington;">
    				<small>Veillez &agrave; ce que vos messages soit lisibles, compr&eacute;hensibles et sans fautes d'ortographes volontaires (type texto). Merci.</small>
    			</div>
    		</div>
     		<br>
    	</div>
    	<fieldset> 
    		<legend style="color: rgb(255, 204, 0); font-weight: bold; font-family: Kristen ITC;">&nbsp;Vos coordonn&eacute;es&nbsp;</legend>
    		<!-- Titre du fieldset -->
    		<span style="color: rgb(255, 0, 0);">
    			<br>* 
    		</span>
    		<small style="color: rgb(0, 0, 0);">
    			<span style="font-family: Lucida Sans;">Votre nom :</span>
    		</small>
    		<input style="font-family: Courier; color: rgb(102, 51, 255);" name="nom">
    		<br><br>
    		<span style="color: rgb(255, 0, 0);">*</span>
    		<small style="font-family: Lucida Sans;">Votre adresse -mail : </small>
    		<input style="color: rgb(102, 51, 255); font-family: Courier;" name="e-mail">
    		<br>
    		<br>
    		<small>
    			<label style="font-family: Lucida Sans;">
    				Site Web perso :<br>
    				<textarea style="color: rgb(102, 51, 255);" cols="50" rows="1" name="url perso"></textarea>
    			</label>
    		</small>
    	</fieldset>
    
    	<p></p>
    	
    	<fieldset>
    		<legend>
    			<span style="font-family: Kristen ITC; color: rgb(255, 204, 0); font-weight: bold;">&nbsp;Votre commentaire</span> 
    			&nbsp;
    		</legend>
    		<!-- Titre du fieldset -->
    		<p></p>
    		<small>
    			<label style="font-family: Lucida Sans;">
    				Titre du commentaire :<br>
    				<input style="font-family: Courier; color: rgb(102, 51, 255);" maxlength="100" size="50" name="titre">
    			</label>
    		</small>
    		<br>
    		<label></label>
    		<br>
    		<span style="color: rgb(255, 0, 0);">*</span>
    		<small>
    			<span style="font-family: Lucida Sans;">Commentaire :</span>
    		</small>
    		<br>
    		<textarea style="font-family: Courier; color: rgb(102, 51, 255);" name="commentaire" cols="50" rows="10"></textarea>
    	</fieldset>
    	<br>
    	<div style="text-align: center;">
    		<input name="submit" value=" &nbsp; &nbsp; Envoyer &nbsp; &nbsp; " type="submit">
    		&nbsp;&nbsp;&nbsp;
    		<input value="Recommencer" name="reset" type="reset">
    	</div>
    	<p style="text-align: center; font-family: Perpetua; color: rgb(204, 153, 51);">
    		<big>
    			<span style="font-weight: bold; text-decoration: underline;">Note:</span> 
    			Votre commentaire va &ecirc;tre envoy&eacute; &agrave; l'administrateur du site. Il sera mis en ligne dans les prochains jours.
    		</big>
    	</p>
    	<p style="text-align: center; font-family: Perpetua; color: rgb(204, 153, 51);">
    		<big>
    			Toutefois, si l'administrateur exige qu'il ne doit pas &ecirc;tre difus&eacute;, vous&nbsp;serez inform&eacute;s par mail des diverses raisons de son refus.
    		</big>
    	</p>
    	<div style="text-align: center;">
    		<big style="font-family: Gourmand;">
    			<a href="liste_commentairespage%20type.html">Lire les Commentaires</a>
    		</big>
    	</div>
    </form>
    </body>
    </html>
    En gros ce qu'il faut changer :
    séparer le fond de la forme (je crois que tu devrais regarder sur internet les cours de CSS et regarder comment on utilise des div) : en gros, tu ne plus avoir la moindre balise style dans ton code car c'est complètement illisible.

    t'as des balises qui ne servent à rien du style <p></p>

    t'as des balises qui ne sont pas fermées (br et input tout particulièrement)

    tu donne une style de police à des balises <br /> où est l'intérêt ?

    Pour avoir un code propre tu devrais mettre ce que je t'ai mis en gras en entête (<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">).
    et passer ta page au valideur XHTML du W3C et corriger toutes les erreurs (il y a du taf )

    C'est un conseil que je te donnes car si un jour tu dois modifier ta page pour une raison ou une autre tu vas t'arracher les cheveux.
    Dis nous ce qu'il en est une fois tout ces problèmes réglés.

  6. #6
    Futur Membre du Club
    Profil pro
    Inscrit en
    Août 2006
    Messages
    18
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Août 2006
    Messages : 18
    Points : 5
    Points
    5
    Par défaut
    Je vais essayer de faire les modifications que tu m'as communiqués mais il faut que je te dise que j'ai rien tapé du tout dans le code. d'ailleur j'y comprends rien du tout. j'utilise le logiciel NVu donc je méaitrise pas ce language.
    je vais tout de même essyer et je vous tient au courrant.
    a bientôt élodie

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. [InterBase] Problème avec les champs incrémentables
    Par ProgD dans le forum InterBase
    Réponses: 4
    Dernier message: 08/11/2007, 16h51
  2. [Cognos 6][Impromptu] Problème avec les champs groupés
    Par nicoduhavre dans le forum Cognos
    Réponses: 4
    Dernier message: 23/03/2007, 15h27
  3. Problème avec les champ obligatoire et liste déroulante
    Par snakejl dans le forum Général JavaScript
    Réponses: 4
    Dernier message: 24/05/2006, 18h21
  4. [XHTML] problème avec les float:left
    Par glloq8 dans le forum Balisage (X)HTML et validation W3C
    Réponses: 2
    Dernier message: 04/11/2005, 17h15
  5. Problème avec les champs de type table
    Par devdev dans le forum MS SQL Server
    Réponses: 5
    Dernier message: 16/12/2004, 16h05

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo