Probléme de validation avec la touche enter

Résolu
EnguerrandP Messages postés 295 Date d'inscription vendredi 26 avril 2013 Statut Membre Dernière intervention 15 juillet 2015 - 28 mars 2014 à 12:57
EnguerrandP Messages postés 295 Date d'inscription vendredi 26 avril 2013 Statut Membre Dernière intervention 15 juillet 2015 - 30 mars 2014 à 13:19
Bonjour,

Je voudrait que lorsque l'appui sur la touche Enter la valeur de mon input soit valider est que la fonction MAJ() soit exécuter.

Voila mon code :
<!-- FONCTIONNEMENT SOUHAITER :
1- Lors de l'init de la page avoir Nweek = au numéro de la semaine en cour.
2- Lors de l'init MDay et Fday prendront la valeur de la date du Lundi et du Vendredi de la semaine NWeek.
3- Si on change la valeur de NWeek et quelle est comprise entre 1 et 52 
   On recalcule MDay et FDay pour qu'il corresponde au date du Lundi et du vendredi de la semaine sélectionner.
4- Si on appuis sur le bouton RFilterWeek, NWeek prend la valeur de la semaine actuel et
   on recalcule MDay et FDay pour qu'il corresponde au date du Lundi et du vendredi de la semaine actuel.
5- Si on appuis sur la touche enter on doit valier la nouvel valeur de NWeek, qui va alors recalculer la date de MDay et FDay
   -->


<html>
<head>
 <meta http-equiv="content-type" content="text/php; charset=ISO-8859-1" />

 <script type="text/javascript" src="Week_Number_JS.js" ></script>

</head>

<body onload="MAJ()";> 
<form onsubmit="NWeek()">
  <p>
    <input type="submit" id="buton" value="MAJ" onClick="MAJ();"></input>
	Date Monday: <input type="date" id="MDay" name="MDay" size="9"></input>
	Date Friday: <input type="date" id="FDay" name="FDay"  size="9"></input>
		<input type="text"  id="NWeek" name="NWeek" value = <?php echo date('W');?> size="2"></input>
	<input type="hidden"  id="Week" name="Week" value = <?php echo date('W');?> size="2"></input>
	</p>
 </form>	

	<input type="button" id="RFilterDate" name="RFilterDate" value="RESET" onClick="RESET();"></input>
 
</body>
</html>


function getDateRangeOfWeek(weekNo)
{
    var d1 = new Date();
    numOfdaysPastSinceLastMonday = eval(d1.getDay()- 1);
    d1.setDate(d1.getDate() - numOfdaysPastSinceLastMonday);
    var weekNoToday = d1.getWeek();
    var weeksInTheFuture = eval( weekNo - weekNoToday );
    d1.setDate(d1.getDate() + eval( 7 * weeksInTheFuture ));
    var rangeIsFrom = d1.getDate()+ "/" + (d1.getMonth()+1) + "/" + d1.getFullYear(); 
    d1.setDate(d1.getDate() + 4);
    var rangeIsTo = d1.getDate()+ "/" + (d1.getMonth()+1) + "/" + d1.getFullYear();
 document.getElementById("MDay").value =rangeIsFrom;
 document.getElementById("FDay").value =rangeIsTo;
 };
 
 /**
 * Returns the week number for this date.  dowOffset is the day of week the week
 * "starts" on for your locale - it can be from 0 to 6. If dowOffset is 1 (Monday),
 * the week returned is the ISO 8601 week number.
 * @param int dowOffset
 * @return int
 */
Date.prototype.getWeek = function (dowOffset) 
{
 /*getWeek() was developed by Nick Baicoianu at MeanFreePath: http://www.meanfreepath.com */

    dowOffset = typeof(dowOffset) == 'int' ? dowOffset : 0; //default dowOffset to zero
    var newYear = new Date(this.getFullYear(),0,1);
    var day = newYear.getDay() - dowOffset; //the day of week the year begins on
    day = (day >= 0 ? day : day + 7);
    var daynum = Math.floor((this.getTime() - newYear.getTime() - 
    (this.getTimezoneOffset()-newYear.getTimezoneOffset())*60000)/86400000) + 1;
    var weeknum;
    //if the year starts before the middle of a week
    if(day < 4) 
 {
        weeknum = Math.floor((daynum+day-1)/7) + 1;
        if(weeknum > 52) 
  {
            nYear = new Date(this.getFullYear() + 1,0,1);
            nday = nYear.getDay() - dowOffset;
            nday = nday >= 0 ? nday : nday + 7;
            /*if the next year starts before the middle of
              the week, it is week #1 of that year*/
            weeknum = nday < 4 ? 1 : 53;
        }
    }
    else 
 {
        weeknum = Math.floor((daynum+day-1)/7);
    }
    return weeknum;
};

function MAJ()
{
 var numeroSemaine = NWeek.value; <!-- Récupére la valeur de NWeek pour déterminer le début et la fin de la semaine -->
 getDateRangeOfWeek(numeroSemaine);
}

function RESET()
{
 document.getElementById("NWeek").value = document.getElementById("Week").value; <!-- Reset la valeur de NWeek -->
 var numeroSemaine = NWeek.value; <!-- Récupére la valeur de NWeek pour déterminer le début et la fin de la semaine -->
 getDateRangeOfWeek(numeroSemaine);
}


Mon problème c'est que tout de suite après avoir fais la MAJ il Reset le résultat avec la date de la semaine actuel.
Comment je peut résoudre se soucis ?

Merci

2 réponses

jordane45 Messages postés 37514 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 31 mai 2023 341
29 mars 2014 à 03:52
Bonjour,

Mon problème c'est que tout de suite après avoir fais la MAJ il Reset le résultat avec la date de la semaine actuel.

Tu veux dire que ton champ <input type="text" id="NWeek"..> contient le Numéro de la semaine actuelle ?

Le fait d'avoir mis un bouton de type submit ( et un FORM ) fait que lorsque tu cliques sur ton bouton.. ta page est rechargée..
tes champs reprennent leurs valeurs par défaut puis
le body ONLOAD se relance...

En gros.. ton code devrait plutôt ressembler à ceci :
<body onload="MAJ();"> 
  <p>
    <input type="button" value="MAJ" onclick="MAJ();"></input>
  Date Monday: <input type="date" id="MDay" name="MDay" size="9"></input>
  Date Friday: <input type="date" id="FDay" name="FDay"  size="9"></input>
  <input type="text"  id="NWeek" name="NWeek" value = <?php echo date('W');?> size="2"></input>
  <input type="hidden"  id="Week" name="Week" value = <?php echo date('W');?> size="2"></input>
</p>
  <input type="button" id="RFilterDate" name="RFilterDate" value="RESET" onclick="RESET();"></input>
 </body>


function MAJ(){
<!-- Récupére la valeur de NWeek pour déterminer le début et la fin de la semaine -->
 var numeroSemaine = document.getElementById("NWeek").value; 
 getDateRangeOfWeek(numeroSemaine);
}

0
EnguerrandP Messages postés 295 Date d'inscription vendredi 26 avril 2013 Statut Membre Dernière intervention 15 juillet 2015 1
29 mars 2014 à 17:26
Bonjour,
Merci pour ta réponse sa résout le problème de recharge de la page mais si j'appuis ur enter sa ne valide pas la saisie.

Merci
0
jordane45 Messages postés 37514 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 31 mai 2023 341
30 mars 2014 à 01:31
Merci pour ta réponse sa résout le problème de recharge de la page
Ce qui répond à la question :
Mon problème c'est que tout de suite après avoir fais la MAJ il Reset le résultat avec la date de la semaine actuel.

Je te rappel le principe de ce site ... On ne pose qu' UNE seule question par discussion.

De toutes façons :
mais si j'appuis ur enter sa ne valide pas la saisie.
Je ne vois pas, dans ce que tu nous montres, le code qui permet de gérer l'appuie sur la touche ENTER.
regardes du côté de ONKEYPRESS ( à placer sur ton Input)
onKeyPress="if (event.keyCode == 13) mafonction()" 
0
EnguerrandP Messages postés 295 Date d'inscription vendredi 26 avril 2013 Statut Membre Dernière intervention 15 juillet 2015 1
30 mars 2014 à 13:19
Merci, mais la question que je poser etait bien :

Je voudrait que lorsque l'appui sur la touche Enter la valeur de mon input soit valider est que la fonction MAJ() soit exécuter.

Je ferai plus attention a l'avenir de ne pas poser deux question dans un même post.

Encore merci et bonne fin de week-end.
0