Javascript pour formulaire

Résolu
momohuri Messages postés 235 Date d'inscription   Statut Membre Dernière intervention   -  
momohuri Messages postés 235 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour,
J'ai fait un formulaire et j'aimerais rendre des champ obligatoire, mais sans message d'alerte qui s'ouvre dans une nouvelle boite de dialogue,j'aimerais juste dfaire une phrase a cote du champ text ou radio ou checkbox avec un petit message. Et je n'y arrive pas...

merci

10 réponses

Réponse 1 / 10
jjsteing Messages postés 1670 Date d'inscription   Statut Contributeur Dernière intervention   181
 
Bonjour,

il faut utiliser la fonction innerHTML (en js) qui te permet d ajouter du code alors que la page est déjà chargée

ex:
document.getElementById('MonHtml').innerHTML += '<br>Ici mon code \n';

sinon, y a l ajax (plus compliqué...)


peros, j utilise aussi une autre fonction que tu peux t inspirer, elle me sert à vérifier, lors de la creation d un compte utilisateur, que le mot de passe entré est le meme que celui de la confirmation : cet exemple active ou desactive le bouton submit celon la verif du mot de passe.. à toi d adapter à tes besoins ;)

php:
$Html.='<td width=250>Mot de passe : </td><td width=300><input MAXLENGTH=20 size=30 id="password1" name="password1" type="text" onkeyup="VerifPassword()"></td><tr>';

$Html.='<td>Confirmer : </td><td><input size=30 id="password2" MAXLENGTH=20 name="password2" type="text" onkeyup="VerifPassword()"></td><tr>';


js :
function VerifPassword(){
if (document.getElementById('password1').value != document.getElementById('password2').value){
document.getElementById('BtnValid').disabled=true;
}else{
document.getElementById('BtnValid').disabled=false;
}
}
0
Réponse 2 / 10
momohuri Messages postés 235 Date d'inscription   Statut Membre Dernière intervention   8
 
dsl double poste, connection de merde...
0
Réponse 3 / 10
momohuri Messages postés 235 Date d'inscription   Statut Membre Dernière intervention   8
 
je me suis bien inspire de ton code mais en le simplifiant^^


le script:

<script>
function Verification(){
if (document.getElementById('nom').value=""){
document.getElementById('error').display=block;
}else{
document.getElementById('BtnValid').disabled=false;
}
}
</script>


la partie du formulaire:

<td>Civilité</td><td>
<select name="civilite">
<option value="Mr">Mr</option>
<option value="Melle">Melle</option>
<option value="Mme">Mme</option>
<div id="erreurecivilite" id="error" style="display:none">Le champ n'est pas remplie</div>

et l'activation de la fonction:

<td><input type="button" name="valider" onClick="verification;" /></td>


mais ca ne marche pas.... tu vois pourquoi?
(quand je clique sur le button rien ne ce passe)
0
Réponse 4 / 10
jjsteing Messages postés 1670 Date d'inscription   Statut Contributeur Dernière intervention   181
 
re :)

1)
if (document.getElementById('nom').value="")
il est ou id="Nom" dan ston html ??

2)
document.getElementById('error').display=block;
=>
document.getElementById('error').style="display:block";

3)
si document.getElementById('BtnValid').disabled=false;
=>
<input type="button" id="BtnValid" name="valider" onClick="verification;" />

4)
dans ton <div> tu as 2 id !!

==>

<script>
function Verification(){
if (document.getElementById('nom').value=""){
document.getElementById('error').style="display:block";
}else{
document.getElementById('BtnValid').disabled=false;
}
}
</script>


la partie du formulaire:

<td>Civilité</td><td>
<input type="text" name="nom">
<select name="civilite">
<option value="Mr">Mr</option>
<option value="Melle">Melle</option>
<option value="Mme">Mme</option>
</select>
<div class:"erreurecivilite" id="error" style="display:none">Le champ n'est pas remplie</div>

et l'activation de la fonction:

<td><input type="button" id="BtnValid" name="valider" onClick="verification;" /></td>

essaye avec ca ;)
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 10
momohuri Messages postés 235 Date d'inscription   Statut Membre Dernière intervention   8
 
re re

<script>
<script>
function Verification(){
if (document.getElementById('nom').value=""){
document.getElementById('erreurnom').style="display:block";
}else{
document.getElementById('BtnValid').disabled=false;
}
}
</script>

(j'ai changer pour que ce oit vraiment le nom cette fois^^)


<td>Nom</td><td><input type="text" name="nom" /></td>
<div id="erreurenom" id="error" style="display:none">Le champ n'est pas remplie</div>
</tr><tr>


<td><input type="button" id="BtnValid" name="valider" onClick="verification();" /></td>


et la quand je vais dans la console d'erreure de firefox j'ai un: verification is not defined

merci
0
Réponse 6 / 10
jjsteing Messages postés 1670 Date d'inscription   Statut Contributeur Dernière intervention   181
 
tu as toujours 2 id dans ton div !!

id="erreurenom" et id="error"

onClick="Verification();"


gaffe au minuscule/majuscule ! ;)
0
Réponse 7 / 10
jjsteing Messages postés 1670 Date d'inscription   Statut Contributeur Dernière intervention   181
 
et il te manque un id="nom"

=>

<td>Nom</td><td><input type="text" id="nom" name="nom" /></td>
0
Réponse 8 / 10
jjsteing Messages postés 1670 Date d'inscription   Statut Contributeur Dernière intervention   181
 
mais a ta place, je ferais : 

<script>
function Verification(){
if (document.getElementById('nom').value == ""){
document.getElementById('BtnValid').disabled=true;
}else{
document.getElementById('BtnValid').disabled=false;
}
}
</script>

<td>Nom</td><td><input type="text" id="nom" name="nom" onkeyup="Verification();" /></td>
</tr><tr>


<td><input type="submit" id="BtnValid" name="valider" value="Valider" disabled="true" /></td>
0
Réponse 9 / 10
momohuri Messages postés 235 Date d'inscription   Statut Membre Dernière intervention   8
 
ra j'ai vue juste après je l'ai corrige (l'histoire d'id")

</tr><tr>
<td>Nom</td><td><input type="text" name="nom" /></td>
<div id="erreurenom" style="display:none">Le champ n'est pas remplie</div>
</tr><tr>
script inchange

<script>
<script>
function Verification(){
if (document.getElementById('nom').value=""){
document.getElementById('erreurnom').style="display:block";
}else{
document.getElementById('BtnValid').disabled=false;
}
}
</script>

et maj verifie, toujours le meme....
<td><input type="button" id="BtnValid" name="valider" onClick="Verification();" /></td>
0
Réponse 10 / 10
momohuri Messages postés 235 Date d'inscription   Statut Membre Dernière intervention   8
 
<script>

function Verification(){

if (document.getElementById('nom').value==""){

document.getElementById('erreurenom').style.display="block";
}

else{

document.getElementById('BtnValid').disabled=false;
}
}
</script>


</tr><tr>
<td>Nom</td><td><input type="text" name="nom" id="nom"/></td>
</tr><tr>
<td></td><td><div id="erreurenom" style="display:none">Le champ n'est pas remplie</div></td>
</tr><tr>


<td><input type="button" id="BtnValid" name="valider" onClick="Verification();" /></td>


ca fonctionne comme ca , merci pour ton aide
0

Discussions similaires

Civilité (Mr,Mme,Melle) n' apparait pas lors de l'exécution du formulaire
azixe -
cs_Le Pivert -

1 réponse
java script error in the main process
ceciel2307 -
Thibaut -

3 réponses
Contact LEBONCOIN
myalysee -
MPMP10 -

3 réponses
Google Chrome : "Nouvel envoi du formulaire"
beredezebe -
beredezebe -

3 réponses
probleme avec formulaire et sous formulaire independant.
samgione -
castours -

9 réponses