Envoyer un formulaire automatiquement

Résolu/Fermé
Hugo.B - Modifié par Hugo.B le 4/06/2012 à 00:00
 Hugo.B - 4 juin 2012 à 16:31
Bonjour,

Je souhaiterai envoyer un formulaire automatiquement lorsque par exemple 12 caractères sont rentrés dans l'input. Je pense que c'est faisable en JS cependant je ne pratique aucunement ce langage...


En fait ça serait pour un système d'invitation, j'ai crée en ligne un site qui permet de générer des invit pdf en ligne qui contiennent un code barre et j'ai besoin de contrôler les entrées lors des soirées... J'aurais un lecteur de code barre qui fonctionne comme un clavier et qui remplira le formulaire. Cependant je n'ai pas envie de cliquer sur entrée à chaque fois...


D'ailleurs est-ce aussi possible que le curseur de la souris soit mis directement dans l'input ?!

A voir également:

3 réponses

Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
4 juin 2012 à 13:51
excuses je n'avait pas eu le temps de tester avant envoi, il ya vait des erreurs de frappe:

voila un code qui fonctionne chez moi:
<!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> 
 <meta http-equiv="Content-type" content="text/html;charset=ISO-8859-1" /> 
 <title></title> 
 <script language="javascript" type="text/javascript" >
 function fonctionAjax_verif_code(){ //erreur là
	//on ne va faire cette action qui si effectivement 12 caracteres sont saisis dans l'input
	
	var code_barre=document.getElementById('code_barre').value;//lecture du code barre dans l'input
	if(code_barre.length >= 12){
		var xhr_object = null;
		if(window.XMLHttpRequest){ // Firefox
			xhr_object = new XMLHttpRequest();
		}else if(window.ActiveXObject){ // Internet Explorer
			xhr_object = new ActiveXObject('Microsoft.XMLHTTP');
		}
		var method = 'POST';
		var filename = 'scriptPHP_verif_code_barre.php';
		xhr_object.open(method, filename, true);
		xhr_object.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
		xhr_object.onreadystatechange = function(){
			///// partie qui traite la réponse du script php et son afficage dans la page
			if(xhr_object.readyState == 4)			{
				if (xhr_object.status == 200) { //erreur là
				var reponse_scriptPHP = xhr_object.responseText;
				document.getElementById('reponse').innerHTML = reponse_scriptPHP; 
				}
			}
			/////
		}
		
		var data="code="+code_barre; //envoi du code barre au script php
		xhr_object.send(data);
	}else{
		return false;
	}
 
 } 
 </script> 
</head> 


et le scriptphp

<?php
	//recup du code envoyé par Ajax:
	$code_barre=$_POST['code'];
	
	//puis tu fais tes verifs
	
	// et envoi de la réponse qui sera affiché dans le div id="reponse":
	//exemple
	if($code_barre=='123456789123'){
	//si ok
		echo '<font color="green">code autorisé</font>';
	}else{
	//si pas ok
		echo '<font color="red">code incorrect !</font>';
	}
	
?>
2
Pas besoin de t'excuser, ton script est génial, pile ce que je voulais...

Merci beaucoup :D
0
Melooo Messages postés 1405 Date d'inscription vendredi 28 novembre 2008 Statut Membre Dernière intervention 18 mars 2013 84
Modifié par Melooo le 4/06/2012 à 08:46
Salut,
ca ressemblerait à ca ?
<!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> 
 <meta http-equiv="Content-type" content="text/html;charset=ISO-8859-1" /> 
 <title></title> 
 <script language="javascript" type="text/javascript" src="jquery.js"></script> 
</head> 
  
<body> 


<style type="text/css"> 

.suffisant { 
  color: #00ff00; 
} 

.insuffisant { 
  color: #ff0000; 
} 
  
</style> 

<script type="text/javascript"> 
  //Attendre que le document soit chargé 
  $(document).ready(function(){ 
    
    //La fonction s'active sur l'évènement keydown dans la zone de texte 
    $("#zone").keydown(function(limit) { 

      //Définir la limite à atteindre 
      var limit = "12"; 

      //Récupérer le nombre de caractères dans la zone de texte 
      var currlength = $(this).val().length; 

      //Afficher un texte de légende en fonction du nombre de caractères 
      if(currlength >= limit){ 
        $("#legende").removeClass("insuffisant").addClass("suffisant").html("Vous avez saisi " + currlength + " caractères sur " + limit + ", c'est suffisant, mais si vous êtes inspiré, vous pouvez continuer."); 
      } 
      else{ 
        $("#legende").removeClass("suffisant").addClass("insuffisant").html("Vous avez saisi " + currlength + " caractères sur " + limit + ", c'est encore trop peu."); 
      } 

    }); 
  });  
</script> 

<form> 
  <input id="zone"> 
</form> 

<div id="legende" class="insuffisant"></div> 


</body> 
</html> 
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
4 juin 2012 à 09:23
je te propose une autre solution en Ajax, une fonctionalité de javascript qui permet de dialoguer avec un script php sans recharger la page
(envoi du code barre et affichage dans un div de la réponse positive ou negative)

<!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> 
 <meta http-equiv="Content-type" content="text/html;charset=ISO-8859-1" /> 
 <title></title> 
 <script language="javascript" type="text/javascript" >
 fonctionAjax_verif_code(){
	//on ne va faire cette action qui si effectivement 12 caracteres sont saisis dans l'input
	
	var code_barre=document.getElementById('code_barre').value;//lecture du code barre dans l'input
	if(code_barre.length >= 12){
		var xhr_object = null;
		if(window.XMLHttpRequest){ // Firefox
			xhr_object = new XMLHttpRequest();
		}else if(window.ActiveXObject){ // Internet Explorer
			xhr_object = new ActiveXObject('Microsoft.XMLHTTP');
		}
		var method = 'POST';
		var filename = 'scriptPHP_verif_code_barre.php';
		xhr_object.open(method, filename, true);
		xhr_object.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
		xhr_object.onreadystatechange = function(){
			///// partie qui traite la réponse du script php et son afficage dans la page
			if(xhr_object.readyState == 4)			{
				if (http_request.status == 200) { 
				var reponse_scriptPHP = xhr_object.responseText;
				document.getElementById('reponse').innerHTML = reponse_scriptPHP; 
				}
			}
			/////
		}
		
		var data="code="+code_barre; //envoi du code barre au script php
		xhr_object.send(data);
	}else{
		return false;
	}
 
 } 
 </script> 
</head> 
  
<body> 
<form name="form1" method="post" action=""> 
  <input type="text" name="code_barre" id="code_barre" value="" onkeyup="fonctionAjax_verif_code();"> 
</form>
<div id="reponse"><!-- ici sera ffichée la réponse au controle du code barre par le script php --></div> 
</body>
</html>

et le scriptPHP_verif_code_barre.php

<?php
	//recup du code envoyé par Ajax:
	$code_barre=$_POST['code'];
	
	//puis tu fais tes verifs
	
	// et envoi de la réponse qui sera affiché dans le div id="reponse":
	//exemple
	//si ok
	echo '<font color="green">code autorisé</font>';
	
	//si pas ok
	echo '<font color="gred">code incorrect !</font>';
	
?>
0
Merci pour ce code, cependant j'ai un problème : ca ne marche pas, dans firefox ça me dit "missing ; before statement et après plein de fonctionAjax_verif_code() is not defined

Je suppose que ça n'est qu'une erreur de frappe mais où dois je mettre le ; ?!
0