var notifBar = document.getElementById('NOTIFBAR'); notifBar.children[1].children[2].addEventListener('click', function(e){ e.preventDefault(); remClass(notifBar, 'active'); }, false); /* [1] On récupère les 2 , 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]"); // 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'); }, false); } /* [1] VERIFICATION DES CHAMPS DE LA CREATION ======================================================*/ var inCk = new inputChecker(); var inDate = document.getElementById('inDate'); var inHeure = document.getElementById('inHeure'); var sbCreer = document.getElementById('sbCreer'); // format de date simplifié var dateFormat = new formatChecker(null, 'Ji/Mi/iiii', { 'J': '[0-3]', 'M': '[0-1]' } ); // format de temps simplifié var timeFormat = new formatChecker(null, 'Hi:Mi', { 'H': '[0-2]', 'M': '[0-6]' } ); inCk.append( inDate, dateFormat, '01/01/2015' ); inCk.append( inHeure, timeFormat, '23:59' ); 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 } }, false); 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 } }, false); inDuree.addEventListener('keyup', function(e){ if( !isNaN(parseInt(inDuree.value)) ){ inDuree.value = parseInt( inDuree.value ); // on caste en addClass(inDuree, 'validated'); // on active la classe si correct }else // si incorrect remClass(inDuree, 'validated'); // on désactive la classe }, false); ////////////////////////////// // VERIFICATION DU SUBMIT() // ////////////////////////////// sbCreer.addEventListener('click', function(e){ e.preventDefault(); // on annule le submit() var formElements = sbCreer.parentNode.children; var checker = true; // pour chaque du formulaire (fils direct uniquement) for( var i = 0 ; i < formElements.length ; i++ ){ if( formElements[i] instanceof HTMLInputElement && formElements[i].type == 'text' ){ // si le champ est requis (required) if( formElements[i].required ) checker = checker && formElements[i].className.indexOf('validated') > -1; // TRUE => validé (niveau interface) // si le champ n'est pas requis et pas vide, on le vide else if( formElements[i].value != '' && formElements[i].className.indexOf('validated') < 0 ) // si incorrect et pas vide formElements[i].value = ''; // on vide }} var inputCheckerValid = inCk.check(inDate) && inCk.check(inHeure); var selectNoDefault = newRDVPatient.value != '*' && newRDVMedecin.value != '*'; if( inputCheckerValid && checker && selectNoDefault ){ // si tout es ok uniquement, on submit() var request = { id_patient: newRDVPatient.value, id_medecin: newRDVMedecin.value, date: inDate.value, heure: inHeure.value, duree: inDuree.value }; API.send('RDV:add', request, function(e){ notif(e.status, e.title, e.message); if( e.status == 'success' ) // on vide le formulaire si on a 'success' sbCreer.parentNode.reset(); }, false); }else{ // sinon on affiche l'erreur notif('error', 'Oups!', 'Certains champs sont requis ou incorrects.'); } }, false); /* [2] Verification des champs de la consultation ======================================================*/ var inCk2 = new inputChecker(); var csMonth = document.getElementById('csMonth'); var csPatient = document.getElementById('csPatient'); var csMedecin = document.getElementById('csMedecin'); // format de mois simplifié var monthFormat = new formatChecker(null, 'Mi/iiii', { 'M': '[0-1]' } ); inCk2.append( csMonth, monthFormat, csMonth.placeholder ); csMonth.addEventListener('keyup', function(e){ if( inCk2.check(csMonth) ) addClass(csMonth, 'validated'); // on active la classe si correct else{ // si incorrect remClass(csMonth, 'validated'); // on désactive la classe inCk2.correct(csMonth, false); // on corrige partiellement if( inCk2.check(csMonth) ) addClass(csMonth, 'validated'); // mise à jour de la classe après correction } }, false); /* [3] Affinage du calendrier ======================================================*/ var dayCells = document.querySelectorAll('#calendar rect[class^="day_"]'); // pour chaque jour, on créé l'évènement for( var i = 0 ; i < dayCells.length ; i++ ){ dayCells[i].addEventListener('click', function(e){ console.log( e.target ); }, false); }