Saisie d'une date correcte dans un formulaire

Version imprimable

05/08/2007, 23h02
breizhgen

Saisie d'une date correcte dans un formulaire

Bonsoir,

est-il possible d'avoir un champ texte dans un formulaire, qui serait destiné à recevoir une date avec des / qui s'ajouterait automatiquement ?

Je m'explique : lorsque la personne tapera les deux premiers chiffres du jour "/" s'affichera tout seul puis les deux chiffres du mois ect...

Si oui comment faire ?

Si non, existe t'il un script permettant de verifier si la saisie sera bien sous cette form JJ/MM/AAAA ?

Merci

Aurore
05/08/2007, 23h09
Bisûnûrs

FAQ Javascript.
05/08/2007, 23h21
breizhgen

Merci beaucoup,

mais comment intégrer tout ça dans mon formulaire ?

Désolé mais je suis un peu nulle

Aurore
05/08/2007, 23h46
ranell

bonsoir,

pour appliquer le script se trouvant dans la FAQ, je te propose de juste recuperer la valeur tapée dans le champ du formulaire . voici un simple exemple:

Code:

date_recupere=document.nom_formulaire.nom_champ.value

ainsi, tu pourra faire le test sur ta variable date_recupere .

ciao.
05/08/2007, 23h51
breizhgen

merci à tous

juste pour le code que tu as demandé, j'ai ce bout de code qui transforme une chaine tapé de longueur 8 de la forme ******** sous la forme **/**/****, a toi d'ajouter les controle necessaire pour verifier par exemple que c'est pas des lettres , ou que ca depasse la longueur 8, ou meme integrer le code de la FAQ, enfin à toi de voir.
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 <script language="JavaScript"> function verify() {var newdate=""; if (document.formulaire.tape_date.value.length==8) {for(i=0;i<8;i++) { if((i==2)||(i==4)||(i==8)) newdate+="/"; newdate+=document.formulaire.tape_date.value.charAt(i); } } document.formulaire.tape_date.value=newdate; } </script> </head> <body> <form name="formulaire" > <input type="text" name="tape_date" onchange="verify()"/> </form> </body>

06/08/2007, 09h10
breizhgen

Merci beaucoup Ranell, je vais essayer cela de ce pas.

Un grand merci

Aurore
06/08/2007, 09h15
Bisûnûrs

Sinon tu peux regarder du côté des masques de saisie, mais je trouve que ça fait beaucoup de code pour pas grand chose.

Exemple :

http://digitalbush.com/projects/masked-input-plugin
06/08/2007, 16h22
breizhgen

Bonjour,

très intéressant les masques de saisies, mais cela ne fonctionne pas, pourtant j'ai repris exactement le script de ce site.

Tant pis.

Merci quand même.

Aurore
07/08/2007, 18h18
ranell

en effet ,moi aussi je trouve les masques de saisies trés interessants, si quelqu'un pouvait nous aider pour faire fonctionner le script du site ca serai sympa , merci bcp :)

2 pièce(s) jointe(s)

bonsoir,
j'ai cherché un peu dans le code source,il fallait tt juste importer des fichiers.
pour ceux qui sont interessé par les masques de saisies, voila le code:

Code:

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
 
<body>
<script type="text/javascript" src="jquery.js"></script>
<script src="jquery.maskedinput-1.0.js" type="text/javascript"></script>
<script type="text/javascript">
$.noConflict( ) 
jQuery(function($){
   $.mask.addPlaceholder("~","[+-]");
   $("#date").mask("99/99/9999");
   $("#phone").mask("(999) 999-9999");
   $("#tin").mask("99-9999999");
   $("#ssn").mask("999-99-9999");
   $("#product").mask("a*-999-a999",{placeholder:" ",completed:function(){alert("You typed the following: "+this.val());}});
   $("#eyescript").mask("~9.99 ~9.99 999");
});
</script>
<table>
<tr><td>Date</td><td><input id="date" type="text" tabindex="1"/></td><td>99/99/9999</td></tr>
<tr><td>Phone</td><td><input id="phone" type="text" tabindex="2"/></td><td>(999) 999-9999</td></tr>
<tr><td>Tax ID</td><td><input id="tin" type="text" tabindex="3"/></td><td>99-9999999</td></tr>
<tr><td>SSN</td><td><input id="ssn" type="text" tabindex="4"/></td><td>999-99-9999</td></tr>
<tr><td>Product Key</td><td><input id="product" type="text" tabindex="5"/></td><td>a*-999-a999</td></tr>
<tr><td>Eye Script</td><td><input id="eyescript" type="text" tabindex="6"/></td><td>~9.99 ~9.99 999</td></tr>
</table>
 
</body>

et les pieces jointes sont les .js requis.
a+

09/08/2007, 09h46
breizhgen

Impeccable

Merci beaucoup Ranell

@+

Aurore
10/08/2007, 15h06
jambonstar

Bonjour à tous,

Tout cela m'interesse au plus haut point.

J'ai tenter d'integrer ça dans mon code mais malheureusement, IE me dis que "$" est indéfini ...

Pas vous ?

Merci d'avance
12/08/2007, 14h38
ranell

bonjour,
euh non j'ai aucun problème avec '§' , déjà j'ai mis le code qui fonctionne, mais IE me fesait ca juste avant que j'importe les autres *.js, enfin bon moi j'utilise IE7, je sais pas si c'est en rapport avec ce prob.
a+
31/08/2007, 09h35
afrodje

Citation:

Envoyé par jambonstar

Bonjour à tous,

Tout cela m'interesse au plus haut point.

J'ai tenter d'integrer ça dans mon code mais malheureusement, IE me dis que "$" est indéfini ...

Pas vous ?

Merci d'avance

Attention quand tu telecharge les 2 .js, fais attention à leurs formats, ils se telechargent en js.txt !!
Renomme les ;)
24/10/2007, 14h38
marinew
Bonjour,

J'essaie aussi d'utiliser le composant jQuery Masked Input, mais dans une application Java/JSF, grâce au composant <rich:jQery> de la librairie RichFaces 3.1.2.

De ce fait, il génère automatiquement le code suivant :
Code:

1 2 3 jQuery(document).ready(function() { jQuery('#dateNaissance').mask('99/99/9999'); });
En fait, je lui passe en paramètre les 2 infos suivantes : "mask('99/99/9999')" et sur "#dateNaissance" et il génère le code précédent en fonction de ces 2 paramètres.

Mais j'obtiens l'erreur suivante :

Code:

jQuery("#dateNaissance").mask is not a function

Il y a peut-être un rapport avec l'histoire du "jQuery.noConflict()", mais étant un peu perdue avec la syntaxe de définition des fonctions JavaScript, je n'arrive pas à voir ce qui ne va pas.
J'ai essayé de modifier le fichier "jquery.maskedinput-1.1.1.js" pour remplacer tous les "$" par des "jQuery", mais ce n'est pas mieux.

Une idée SVP ?
Merci d'avance.
24/10/2007, 15h31
marinew

Bon, il semblerait que le problème soit lié au mode de chargement du fichier JavaScript. Je l'ai chargé "normalement dans l'entête <head> de ma page et ça fonctionne.
Si j'utilise un composant particulier de RichFaces (<a4j:loadScript>), ça ne fonctionne pas, alors que la page résultante est identique !