Correction et optimisation avancée du <inputChecker>
This commit is contained in:
xdrm-brackets
parent
8afd55351a
commit
2ebf66e0b7
|
|
@ -63,7 +63,7 @@ if(!Authentification::checkUser(0)){
|
|||
</select><span>Selection du médecin pour la consultation.</span><span class='associated'>Médecin traitant du patient.</span>
|
||||
</div>
|
||||
|
||||
<br><span>Date: </span>
|
||||
<br><span>Date:   </span>
|
||||
<input type='text' id='inDate' placeholder='dd/mm/yyyy'>
|
||||
|
||||
<br><span>Heure: </span>
|
||||
|
|
|
|||
|
|
@ -16,8 +16,10 @@ if(!Authentification::checkUser(0)){
|
|||
|
||||
<link rel='stylesheet' href='css/animations.css'/>
|
||||
<link rel='stylesheet' href='css/global.css'/>
|
||||
<link rel='stylesheet' href='css/responsive.css'/>
|
||||
|
||||
<script type='text/javascript' src='js/adjust.js'></script>
|
||||
<script type='text/javascript' src='js/input-checker.js'></script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
|
@ -47,5 +49,6 @@ if(!Authentification::checkUser(0)){
|
|||
|
||||
</div>
|
||||
|
||||
<script type='text/javascript' src='js/consultations.js'></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,152 +1,39 @@
|
|||
// /* [1] On récupère les 2 <select> de création de RDV
|
||||
// ===============================================================*/
|
||||
// var newRDVPatient = document.getElementById('newRDVPatient');
|
||||
// var newRDVMedecin = document.getElementById('newRDVMedecin');
|
||||
/* [1] On récupère les 2 <select> de création de RDV
|
||||
===============================================================*/
|
||||
var newRDVPatient = document.getElementById('newRDVPatient');
|
||||
var newRDVMedecin = document.getElementById('newRDVMedecin');
|
||||
|
||||
// /* [2] Si on a récupéré les 2 <select>, on créé l'évènement de selection dynamique
|
||||
// ===============================================================*/
|
||||
// if( newRDVPatient != null && newRDVMedecin != null ){
|
||||
/* [2] Si on a récupéré les 2 <select>, on créé l'évènement de selection dynamique
|
||||
===============================================================*/
|
||||
if( newRDVPatient != null && newRDVMedecin != null ){
|
||||
|
||||
// /* [1] On selectionne dynamiquement le médecin traitant associé
|
||||
// =======================================================================*/
|
||||
// newRDVPatient.addEventListener('change', function(e){
|
||||
// var child = document.querySelector("#newRDVPatient > option[value='"+newRDVPatient.value+"'][data-medecin]");
|
||||
/* [1] On selectionne dynamiquement le médecin traitant associé
|
||||
=======================================================================*/
|
||||
newRDVPatient.addEventListener('change', function(e){
|
||||
var child = document.querySelector("#newRDVPatient > option[value='"+newRDVPatient.value+"'][data-medecin]");
|
||||
|
||||
// // on selectionne le medecin associé
|
||||
// newRDVMedecin.value = child.dataset.medecin;
|
||||
// addClass(newRDVMedecin, 'associated');
|
||||
// }, false);
|
||||
// on selectionne le medecin associé
|
||||
newRDVMedecin.value = child.dataset.medecin;
|
||||
addClass(newRDVMedecin, 'associated');
|
||||
}, false);
|
||||
|
||||
|
||||
// // [1] On met en valeur le médecin traitant associé (class=associated)
|
||||
// // =======================================================================
|
||||
// newRDVMedecin.addEventListener('change', function(e){
|
||||
// var child = document.querySelector("#newRDVPatient > option[value='"+newRDVPatient.value+"'][data-medecin]");
|
||||
// if( newRDVMedecin.value == child.dataset.medecin ) // si c'est le medecin traitant, on met en valeur l'association
|
||||
// addClass(newRDVMedecin, 'associated');
|
||||
// else
|
||||
// remClass(newRDVMedecin, 'associated');
|
||||
// [1] On met en valeur le médecin traitant associé (class=associated)
|
||||
// =======================================================================
|
||||
newRDVMedecin.addEventListener('change', function(e){
|
||||
var child = document.querySelector("#newRDVPatient > option[value='"+newRDVPatient.value+"'][data-medecin]");
|
||||
if( newRDVMedecin.value == child.dataset.medecin ) // si c'est le medecin traitant, on met en valeur l'association
|
||||
addClass(newRDVMedecin, 'associated');
|
||||
else
|
||||
remClass(newRDVMedecin, 'associated');
|
||||
|
||||
// }, false);
|
||||
// }
|
||||
}, false);
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// /* GESTION DU NUMÉRO DE SÉCU */
|
||||
// var inSecu = document.getElementById('inSecu'); // input du numéro de sécu
|
||||
// var ftSecu = 'x xx xx xx xxx xxx xx'; // format du numéro de sécu
|
||||
|
||||
// inSecu.addEventListener('keyup', function(e){
|
||||
|
||||
// // pour chaque caractère
|
||||
// for( var i = 0 ; i < inSecu.value.length ; i++ ){
|
||||
|
||||
// // [1] si le caractère n'est pas un nombre, on le supprime
|
||||
// if( isNaN(inSecu.value[i]) )
|
||||
// inSecu.value = inSecu.value.slice(0, i).concat( inSecu.value.slice(i+1) );
|
||||
|
||||
// // [2] si c'est pas un espace mais qu'il en faut un, on met en forme
|
||||
// if( inSecu.value[i] != ' ' && ftSecu[i] == ' ' )
|
||||
// inSecu.value = inSecu.value.slice(0, i).concat(' ').concat( inSecu.value.slice(i) );
|
||||
|
||||
// // [4] Le numéro saisi est trop long, on le coupe + enlève les espaces alentours
|
||||
// inSecu.value = inSecu.value.slice(0, ftSecu.length).trim();
|
||||
// }
|
||||
|
||||
// // si input complet
|
||||
// if( inSecu.value.length == ftSecu.length )
|
||||
// addClass(inSecu, 'validated');
|
||||
// else
|
||||
// remClass(inSecu, 'validated');
|
||||
|
||||
// }, false);
|
||||
|
||||
|
||||
|
||||
|
||||
// /* GESTION DE LA DATE */
|
||||
// var inDate = document.getElementById('inDate'); // input de la date
|
||||
// var ftDate = 'dd/dd/dddd'; // format de la date
|
||||
|
||||
// inDate.addEventListener('keyup', function(e){
|
||||
|
||||
// // pour chaque caractère
|
||||
// for( var i = 0 ; i < inDate.value.length ; i++ ){
|
||||
|
||||
// // [1] si le caractère n'est pas un nombre, on le supprime
|
||||
// if( isNaN(inDate.value[i]) )
|
||||
// inDate.value = inDate.value.slice(0, i).concat( inDate.value.slice(i+1) );
|
||||
|
||||
// // [2] si c'est pas un espace mais qu'il en faut un, on met en forme
|
||||
// if( inDate.value[i] != '/' && ftDate[i] == '/' )
|
||||
// inDate.value = inDate.value.slice(0, i).concat('/').concat( inDate.value.slice(i) );
|
||||
|
||||
// // [3] Le numéro saisi est trop long, on le coupe + enlève les espaces alentours
|
||||
// inDate.value = inDate.value.slice(0, ftDate.length).trim();
|
||||
// }
|
||||
|
||||
// // [4] vérification de cohérence
|
||||
// var pJour = inDate.value.slice(0,2);
|
||||
// var pMois = inDate.value.slice(3,5);
|
||||
// var pAnnee = inDate.value.slice(6,11);
|
||||
|
||||
// // test de la validité
|
||||
// var pDate = new Date(pJour+'/'+pMois+'/'+pAnnee);
|
||||
// // if( pDate.toString() != 'Invalid Date' ){
|
||||
// // var pDateObj = {
|
||||
// // jour: (''+(pDate.getDate()-1)).length != 2 ? '0'+(pDate.getDate()-1) : ''+(pDate.getDate()-1),
|
||||
// // mois: (''+(pDate.getMonth()+1)).length != 2 ? '0'+(pDate.getMonth()+1) : ''+(pDate.getMonth()+1),
|
||||
// // annee: (''+(pDate.getFullYear())).length != 4 ? '0'+(pDate.getFullYear()) : ''+(pDate.getFullYear()),
|
||||
// // }
|
||||
// // inDate.value = pDateObj.jour +'/'+ pDateObj.mois +'/'+ pDateObj.annee;
|
||||
// // }
|
||||
|
||||
// }, false);
|
||||
|
||||
|
||||
|
||||
// /* GESTION DE L'HEURE */
|
||||
// var inHeure = document.getElementById('inHeure'); // input de la date
|
||||
// var ftHeure = 'dd:dd'; // format de la date
|
||||
|
||||
// inHeure.addEventListener('keyup', function(e){
|
||||
|
||||
// // pour chaque caractère
|
||||
// for( var i = 0 ; i < inHeure.value.length ; i++ ){
|
||||
|
||||
// // [1] si le caractère n'est pas un nombre, on le supprime
|
||||
// if( isNaN(inHeure.value[i]) )
|
||||
// inHeure.value = inHeure.value.slice(0, i).concat( inHeure.value.slice(i+1) );
|
||||
|
||||
// // [2] si c'est pas un espace mais qu'il en faut un, on met en forme
|
||||
// if( inHeure.value[i] != ':' && ftHeure[i] == ':' )
|
||||
// inHeure.value = inHeure.value.slice(0, i).concat(':').concat( inHeure.value.slice(i) );
|
||||
|
||||
// // [3] Le numéro saisi est trop long, on le coupe + enlève les espaces alentours
|
||||
// inHeure.value = inHeure.value.slice(0, ftHeure.length).trim();
|
||||
// }
|
||||
|
||||
// // [4] vérification de cohérence
|
||||
// var pHeures = inHeure.value.slice(0,2);
|
||||
// var pMinuts = inHeure.value.slice(3,5);
|
||||
|
||||
// // on borne les valeurs
|
||||
// if( pHeures.length == 2 ) pHeures = (pHeures>=24) ? '23' : pHeures;
|
||||
// if( pMinuts.length == 2 ) pMinuts = (pMinuts>=60) ? '59' : pMinuts;
|
||||
|
||||
// // on met au bon format dans tous les cas
|
||||
// if( pHeures.length == 2 && pMinuts.length == 2 ){
|
||||
// addClass(inHeure, 'validated');
|
||||
// inHeure.value = pHeures+':'+pMinuts;
|
||||
// }else
|
||||
// remClass(inHeure, 'validated');
|
||||
|
||||
// }, false);
|
||||
|
||||
|
||||
|
||||
/* VERIFICATION DES CHAMPS */
|
||||
var inCk = new inputChecker();
|
||||
var inDate = document.getElementById('inDate');
|
||||
|
|
@ -155,21 +42,18 @@ var inCk = new inputChecker();
|
|||
|
||||
|
||||
// format de date simplifié
|
||||
var dateFormat = new formatChecker( null,
|
||||
'Ji/Mi/2iii',
|
||||
{ 'J': '[0-3]', 'M': '[0-1]' }
|
||||
var dateFormat = new formatChecker(null,
|
||||
'Ji/Mi/2iii', { 'J': '[0-3]', 'M': '[0-1]' }
|
||||
);
|
||||
|
||||
// format de temps simplifié
|
||||
var timeFormat = new formatChecker( null,
|
||||
'Hi:Mi',
|
||||
{ 'H': '[0-2]', 'M': '[0-6]' }
|
||||
var timeFormat = new formatChecker(null,
|
||||
'Hi:Mi', { 'H': '[0-2]', 'M': '[0-6]' }
|
||||
);
|
||||
|
||||
// format numéro SECU simplifié
|
||||
var secuFormat = new formatChecker( null,
|
||||
'S ii ii ii iii iii ii',
|
||||
{ 'S': '[0-1]' }
|
||||
var secuFormat = new formatChecker(null,
|
||||
'S ii ii ii iii iii ii', { 'S': '[0-1]' }
|
||||
);
|
||||
|
||||
|
||||
|
|
@ -184,7 +68,6 @@ inCk.append( inSecu, secuFormat, '1 23 45 67 890 123 45' );
|
|||
inDate.addEventListener('keyup', function(e){
|
||||
if( inCk.check(inDate) ) addClass(inDate, 'validated'); // on active la classe si correct
|
||||
else{ // si incorrect
|
||||
|
||||
remClass(inDate, 'validated'); // on désactive la classe
|
||||
inCk.correct(inDate, false); // on corrige partiellement
|
||||
if( inCk.check(inDate) ) addClass(inDate, 'validated'); // mise à jour de la classe après correction
|
||||
|
|
@ -195,7 +78,6 @@ inDate.addEventListener('keyup', function(e){
|
|||
inHeure.addEventListener('keyup', function(e){
|
||||
if( inCk.check(inHeure) ) addClass(inHeure, 'validated'); // on active la classe
|
||||
else{ // si incorrect
|
||||
|
||||
remClass(inHeure, 'validated'); // on désactive la classe
|
||||
inCk.correct(inHeure, false); // on corrige partiellement
|
||||
if( inCk.check(inHeure) ) addClass(inHeure, 'validated'); // mise à jour de la classe après correction
|
||||
|
|
@ -205,7 +87,6 @@ inHeure.addEventListener('keyup', function(e){
|
|||
inSecu.addEventListener('keyup', function(e){
|
||||
if( inCk.check(inSecu) ) addClass(inSecu, 'validated'); // on active la classe
|
||||
else{ // si incorrect
|
||||
|
||||
remClass(inSecu, 'validated'); // on désactive la classe
|
||||
inCk.correct(inSecu, false); // on corrige partiellement
|
||||
if( inCk.check(inSecu) ) addClass(inSecu, 'validated'); // mise à jour de la classe après correction
|
||||
|
|
|
|||
|
|
@ -246,6 +246,8 @@ inputChecker.prototype = {
|
|||
|
||||
if( !this.check(pInputElement) ){ // si la chaîne n'est pas correcte
|
||||
|
||||
var lastChar = null;
|
||||
|
||||
/* [2] Cas 1 : vérification de la chaîne complète
|
||||
====================================================*/
|
||||
for( var i = 0 ; i < RegExpByChar.length ; i++ ){ // on parcours le pattern
|
||||
|
|
@ -254,21 +256,26 @@ inputChecker.prototype = {
|
|||
if( !pToEnd && i >= this.input[index].value.length )
|
||||
break;
|
||||
|
||||
lastChar = tmpValue[i];
|
||||
|
||||
// RegExp sur le caractère en question
|
||||
var tmpRegExp = new RegExp( '^'+RegExpByChar[i]+'$' );
|
||||
|
||||
/* (1) Valeur inexistante (string.length < schéma.length)
|
||||
-----------------------------------------------------------*/
|
||||
if( tmpValue.length == 0 || tmpValue[i] == null ){
|
||||
if( tmpValue.length == 0 || tmpValue[i] == null )
|
||||
tmpValue = tmpValue.slice(0, i).concat( this.defval[index][i] ).concat( tmpValue.slice(i) );
|
||||
i++; // on incrémente car on décale la valeur
|
||||
|
||||
|
||||
/* (2) Valeur ne correspond pas au schéma du caractère
|
||||
-----------------------------------------------------------*/
|
||||
}else if( tmpValue[i].match(tmpRegExp) == null )
|
||||
tmpValue = tmpValue.slice(0, i).concat( this.defval[index][i] ).concat( tmpValue.slice(i) );
|
||||
// Remarque. Ici on ne décale pas (i++) car le décalage fait correspondre au schéma
|
||||
else if( tmpValue[i].match(tmpRegExp) == null ){
|
||||
// si le caractère suivant match, on décale d'une position
|
||||
if( tmpValue[i].match(new RegExp( '^'+RegExpByChar[i+1]+'$' )) != null )
|
||||
tmpValue = tmpValue.slice(0, i).concat( this.defval[index][i] ).concat( tmpValue.slice(i) );
|
||||
// sinon on remplace
|
||||
else
|
||||
tmpValue = tmpValue.slice(0, i).concat( this.defval[index][i] ).concat( tmpValue.slice(i+1) );
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue