Validation formulaire avec un lien

Signaler
Messages postés
15
Date d'inscription
samedi 25 février 2006
Statut
Membre
Dernière intervention
28 décembre 2008
-
Messages postés
15
Date d'inscription
samedi 25 février 2006
Statut
Membre
Dernière intervention
28 décembre 2008
-
Bonjour,
Habituellement et peut-être à tort, j'utilise la fonction : [javascript:document.form.submit() Valider] pour confirmer un formulaire en lieu et place d'un submit. Afin de contrôler certains champs, je suis amené à utiliser : onsubmit="return validate(this)" dans la balise form. le script fonctionne très bien avec un bouton submit.
Hélas, je n'ai pas trouvé sur le net de solutions permettant d'associer le controle des champs et mon lien javascript :(
Auriez-vous une petite idée ?
Merci d'avance

9 réponses

Messages postés
4933
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
11
bonjour,
>>Habituellement et peut-être à tort, j'utilise la fonction
>>: [javascript:document.form.submit() Valider]
>>pour
confirmer un formulaire en lieu et place d'un submit.

je ne sais pas si tu as tort...
mais
1° le bouton submit et le onsubmit dans le formulaire sont fait pour ça
2° tu as pensé à ceux qui ne veulent pas du javascript ?
    ton formulaire ne sera jamais envoyé.
3° en faisant comme tu fais, la fonction du onsubmit n'est pas exécutée

rien ne t'empêche de mettre le style que tu veut sur le bouton submit

si tu y tiens à tout prix, lance la fonction de contrôle
dans le href et fais-y le submit... mais bon, ce n'est pas la
manière normale de faire....

Cordialement

           [mon Site] [M'écrire] Bul          
Messages postés
15
Date d'inscription
samedi 25 février 2006
Statut
Membre
Dernière intervention
28 décembre 2008

Merci de ta réponse bul3,
Il est vrai qu'avec du css, tout est possible au niveau de la mise en forme...
En fait, je pensais une nouvelle fois peut être à tort que le fait de pratiquer ainsi et donc de manière moins conventionnelle, pourrait éviter les validations intempestives dues à des attaques robots ou autres, compte tenu que sans un clic sur le bouton adéquat, aucune validation du formulaire n'est possible ? En quelque sorte, une forme d'anti-spam naturel ?
Effectivement, je sais que certaines personnes peuvent désactiver le JavaScript via leur navigateur... Et, bien que je n'en comprenne pas complètement le sens, je pense que ces derniers suffisamment avertis sur le sujet sauront réactiver le JavaScript au moment adéquat... car par précautions, ils peuvent également désactiver leur ordinateur du réseau internet... c'est moins risqué :) !
Sinon tu as tout compris, la fonction onsubmit n'est pas exécutée en l'état... mais sur le principe de connaissance, je serai heureux de connaître la formule magique qui permettrait de valider un formulaire à l'aide d'un lien JavaScript, tout en gérant le contrôle du script...
Pourrais-tu m'éclairer à ce sujet via un exemple ?
Merci d'avance...
Messages postés
4933
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
11
>>valider un formulaire à l'aide d'un lien JavaScript, tout en gérant le contrôle du script
ben... j'ai répondu.
dans ton lien, avant d'envoyer le formulaire, appelle la fonction de contrôle.

>>pourrait éviter les validations intempestives dues à des attaques robots ou autres
bah... cliquer sur un lien ou sur un bouton... c'est pareil.
le spam n'a aucun rapport avec ceci.

>>ces derniers suffisamment avertis sur le sujet sauront réactiver le JavaScript
ce n'est pas le fait de savoir, c'est qu'ils refusent.
et pourquoi mettre du code là où ce n'est pas nécessaire ?
et tu te réserves de futures surprises en n'utilisant pas les méthodes standards...

          [mon Site] [M'écrire] Bul        
Messages postés
15
Date d'inscription
samedi 25 février 2006
Statut
Membre
Dernière intervention
28 décembre 2008

Merci bul3,

J'ai bien noté tes remarques...
Sinon : Appeler la fonction de contrôle avant d'envoyer le formulaire... c'est justement ce que je n'arrive pas à mettre en place, malgré mes recherches sur le net... j'en suis là :

1 - [# Valider]
La fonction onsubmit est bien exécutée, mais une fois tous les contrôles effectués par le script, l'action submit n'est pas appelée, donc le formulaire n'est pas transmis.

2 - [javascript:document.getElementById('formcontact').onsubmit(); Valider]
Une page blanche apparait avec le valeur false et ça s'arrête là.

Dans les deux cas, je ne sais pas ajouter la partie submit dans le lien afin d'envoyer le formulaire après le contrôle. Et, si :

3 - Valider

Le formulaire est envoyé sans contrôle... :( !
 
Aurais-tu une idée de syntaxe ?
Bonne journée...
Messages postés
4933
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
11
si tu y tiens...

function CtrEnvoi()
{   contrôles...
    et s'il n'y a pas d'erreurs : formulaire en question.submit();
}

[javascript:void(CtrEnvoi()); mon Site]] [M'écrire] Bul         
Messages postés
15
Date d'inscription
samedi 25 février 2006
Statut
Membre
Dernière intervention
28 décembre 2008

Merci encore bul3,
Mais mes connaissances et mes recherches sur le net ne me permettent pas d'appliquer seul ton idée jusqu'au bout... Si tu le veux bien, j'ai encore besoin de toi :) !
Pourrais-tu remplir les éléments manquants et corriger les énormités afin que cela fonctionne ?
D'avance merci...

<head>
<script type="text/javascript" src="js/formcontact.js"></script>
<script language="JavaScript">
function CtrEnvoi() {
      if ( (reponse == true) ) {
         document.formcontact.submit();
      }
   }
</script>
</head>

<form method="post" name="formcontact" id="formcontact" action="contact0.php">
....
[javascript:void(CtrEnvoi()); valider]
</form>
Messages postés
4933
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
11
je veux bien ce que tu veux.. mais
    if ( (reponse == true) ) {
c'est quoi reponse ?
          [mon Site] [M'écrire] Bul         
Messages postés
15
Date d'inscription
samedi 25 février 2006
Statut
Membre
Dernière intervention
28 décembre 2008

Euh... ne tiens pas compte de ma nullité, j'avais juste essayé de m'inspirer d'exemples existants...
En fait, il est nécessaire que la fonction permette au fichier js de contrôler tous les champs souhaités, puis une fois la tâche finie, de valider le formulaire via un [ valider]
Si ça peut t'aider, voici ci-dessous le fichier js, lié à la page :
@+

// form validation function //
function validate(form) {
  var objet = form.objet.value;
  var societe = form.societe.value;
  var societeRegex = /^[a-zA-Z]+(([\'\,\.\- ][a-zA-Z ])?[a-zA-Z]*)*$/;
  var contact = form.contact.value;
  var contactRegex = /^[a-zA-Z]+(([\'\,\.\- ][a-zA-Z ])?[a-zA-Z]*)*$/;
  var telephone = form.telephone.value;
  var telephoneRegex = /^0[1-689]([-. ]?[0-9]{2}){4}$/;
  var email = form.email.value;
  var emailRegex = /^[\w-\.]+@([\w-]+\.)+[\w-]{2,4}$/;
  var message = form.message.value;
  var messageRegex = new RegExp(/<\/?\w+((\s+\w+(\s*=\s*(?:".*?"|'.*?'|[^'">\s]+))?)+\s*|\s*)\/?>/gim);
  if(objet == "") {
    inlineMsg('objet','Quelle est la nature de votre message ?',0);
    return false;
  }
  if(societe == "") {
    inlineMsg('societe','Quel est le nom de votre société ?',0);
    return false;
  }
  if(!societe.match(societeRegex)) {
    inlineMsg('societe','Merci de vérifier le nom de votre société...',0);
    return false;
  }
  if(contact == "") {
    inlineMsg('contact','Qui contacter si besoin ?',0);
    return false;
  }
  if(!contact.match(contactRegex)) {
    inlineMsg('contact','Merci de vérifier vos informations...',0);
    return false;
  }
  if(telephone == "") {
    inlineMsg('telephone','Quel est votre numéro de téléphone ?',0);
    return false;
  }
   if(!telephone.match(telephoneRegex)) {
   inlineMsg('telephone','Merci de vérifier votre numéro de téléphone...',0);
   return false;
  }
  if(email == "") {
    inlineMsg('email','Quelle est votre adresse email ?',0);
    return false;
  }
  if(!email.match(emailRegex)) {
    inlineMsg('email','Merci de vérifier votre adresse email...',0);
    return false;
  }
  if(message == "") {
    inlineMsg('message','Quel est votre message ?',0);
    return false;
  }
  if(message.match(messageRegex)) {
    inlineMsg('message','Merci de vérifier votre message...',0);
    return false;
  }
  return true;
}


// START OF MESSAGE SCRIPT //


var MSGTIMER = 20;
var MSGSPEED = 20;
var MSGOFFSET = 3;
var MSGHIDE = 3;


// build out the divs, set attributes and call the fade function //
function inlineMsg(target,string,autohide) {
  var msg;
  var msgcontent;
  if(!document.getElementById('msg')) {
    msg = document.createElement('div');
    msg.id = 'msg';
    msgcontent = document.createElement('div');
    msgcontent.id = 'msgcontent';
    document.body.appendChild(msg);
    msg.appendChild(msgcontent);
    msg.style.filter = 'alpha(opacity=0)';
    msg.style.opacity = 0;
    msg.alpha = 0;
  } else {
    msg = document.getElementById('msg');
    msgcontent = document.getElementById('msgcontent');
  }
  msgcontent.innerHTML = string;
  msg.style.display = 'block';
  var msgheight = msg.offsetHeight;
  var targetdiv = document.getElementById(target);
  targetdiv.focus();
  var targetheight = targetdiv.offsetHeight;
  var targetwidth = targetdiv.offsetWidth;
  var topposition = topPosition(targetdiv) - ((msgheight - targetheight) / 2);
  var leftposition = leftPosition(targetdiv) + targetwidth + MSGOFFSET;
  msg.style.top = topposition + 'px';
  msg.style.left = leftposition + 'px';
  clearInterval(msg.timer);
  msg.timer = setInterval("fadeMsg(1)", MSGTIMER);
  if(!autohide) {
    autohide = MSGHIDE; 
  }
  window.setTimeout("hideMsg()", (autohide * 1000));
}


// hide the form alert //
function hideMsg(msg) {
  var msg = document.getElementById('msg');
  if(!msg.timer) {
    msg.timer = setInterval("fadeMsg(0)", MSGTIMER);
  }
}


// face the message box //
function fadeMsg(flag) {
  if(flag == null) {
    flag = 1;
  }
  var msg = document.getElementById('msg');
  var value;
  if(flag == 1) {
    value = msg.alpha + MSGSPEED;
  } else {
    value = msg.alpha - MSGSPEED;
  }
  msg.alpha = value;
  msg.style.opacity = (value / 100);
  msg.style.filter = 'alpha(opacity=' + value + ')';
  if(value >= 99) {
    clearInterval(msg.timer);
    msg.timer = null;
  } else if(value <= 1) {
    msg.style.display = "none";
    clearInterval(msg.timer);
  }
}


// calculate the position of the element in relation to the left of the browser //
function leftPosition(target) {
  var left = -286;
  if(target.offsetParent) {
    while(1) {
      left += target.offsetLeft;
      if(!target.offsetParent) {
        break;
      }
      target = target.offsetParent;
    }
  } else if(target.x) {
    left += target.x;
  }
  return left;
}


// calculate the position of the element in relation to the top of the browser window //
function topPosition(target) {
  var top = 0;
  if(target.offsetParent) {
    while(1) {
      top += target.offsetTop;
      if(!target.offsetParent) {
        break;
      }
      target = target.offsetParent;
    }
  } else if(target.y) {
    top += target.y;
  }
  return top;
}


// preload the arrow //
if(document.images) {
  arrow = new Image(7,80);
  arrow.src = "images/msg_arrow.gif";
Messages postés
15
Date d'inscription
samedi 25 février 2006
Statut
Membre
Dernière intervention
28 décembre 2008

Hourra ! Je viens de trouver : solution ci-dessous.
Merci bul3 pour ta rapidité et ton implication...
@bientôt

<head>
<script type="text/javascript" src="js/fichier.js"></script>
<script language="JavaScript">
function submitform()
{
if(document.form.onsubmit())
{
document.form.submit();
}
}
</script>
</head>

<form method="post" name="form" id="form" action="fichier.php" onsubmit="return validate(this)">
....
[javascript:submitform() valider]
</form>