Débuggage / Rectification fonction [Résolu]

Signaler
Messages postés
295
Date d'inscription
vendredi 26 avril 2013
Statut
Membre
Dernière intervention
15 juillet 2015
-
Messages postés
295
Date d'inscription
vendredi 26 avril 2013
Statut
Membre
Dernière intervention
15 juillet 2015
-
Bonjour,

Pouvez vous m'aider a dépanner ma fonction ?
(J'ai mi en commentaire se que je souhaitez faire a chaque étape.)
$(function() 
{
   $('#inlineDatepick').datepick
   ({onSelect:
		function(dates)
   		{
    		var dateText = $.datepick.formatDate(dates[0]);
			document.getElementById("DATE1").value = dateText;
			
        	var dateArr = dateText.split("/");
        	var IDfromDateText= dateArr[2] +  dateArr[0] + dateArr[1]; 

			if ($("#Table_Jour_"+IDfromDateText).length > 0)//Test la taille de l'objet si objet != vide alors il éxist
			{
				// Je masque tout les tableaux
				$('.C_T_Jour').hide();		
				// J'affiche le tableau du jour sélectionné
				$("#Table_Jour_"+IDfromDateText).show();
			}
			else($("#Table_Jour_"+IDfromDateText).length = 0)//Test la taille de l'objet si objet != vide alors il éxist
			{
				// Je masque tout les Tableaux
				$('.C_T_Jour').hide();
				// Je fais apparaitre le tableau original pour le cloner
				$("#Table_Jour_").show();
				// Je clone le tableau original				
          	 	$("#Table_Jour_").clone().insertAfter("#Table_Jour_");
				//Je lui donne un nouvel ID : "Table_Jour_"+IDfromDateText 
				$("#Table_Jour_").clone().attr('id', "#Table_Jour_"+IDfromDateText);
				//Je masque le tableau original
				$("#Table_Jour_").hide();
			}      
   	 	}
	});

});


Merci

7 réponses

Messages postés
32477
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
15 mai 2021
347
Bonjour,

ses deux script (Il ont théoriquement le même fonctionnement)

Oui ... mais non.

Le premier script (celui que je t'ai donné) n'utilise pas (actuellement) le clonage d'un tableau existant.
Le contenu de la fonction CreaTable .... créé un div puis y met un tableau.

L'idéal pour toi serait de remplacer mon code (la partie qui créée les tableaux) par le tien : celui qui Clone ton tableau.
Bien sur il te faut l'adapter pour qu'il prenne en paramètre la date...que tu pourras ensuite (comme je l'ai fait dans mon script) utiliser pour générer les ID de tes tableaux et ainsi pouvoir gérer leur affichage.

Donc avant de t'aider d'avantage j'attends que tu reprenne le premier script ( celui qui se trouve ICI ) et que tu y apportes les modifications (telles que décrites ci-dessus).

=> pour que tu comprennes bien :

Tu prends dans la fonction : function CreaTable(idTable)
Tu y conserves la ligne :
$("#Table_Jour_").append("<div name='MesTBL' id='myDiv" + idTable + "'></div>")

Tu y ajoutes ensuite ton code de clonage.
(et Tu fais en sorte que ton tableau cloné soit mis dans le div créé précédemment) => avec appendTo
$("#Table_Jour_").clone().appendTo("#myDiv" + idTable)


Pour info : Ce sont les DIV qui seront affichées/masquées.. (et par conséquence les tableaux qui s'y trouvent....).
Pour gérer leur affichage on utiliser leur propriété NAME.


NB: Poster du code et dire : "Merci de me dire ce qui ne va pas..."
ne donne généralement que peu de réponses !!
Pour avoir des réponses il te faut indiquer ce que TOI tu constates comme n'allant pas.....
Nous ne sommes ni professeurs ni salariés... nous répondons sur notre temps libre et souhaitons que les personnes qui posent leurs questions fassent un minimum d'efforts et de recherches de leur côté avant de nous solliciter.



Messages postés
32477
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
15 mai 2021
347
dans la fonction (que j'ai aussi placer dans la création):
Le principe d'une fonction est de pouvoir utiliser X fois les mêmes lignes de code sans avoir besoin de tout réécrire ailleurs.
Dans ton code de création il suffit juste d'appeler la fonction de la même manière que c'est déjà fait précédemment.

Par contre... ce n'est pas DANS ton tableau d'origine que tu dois ajouter les nouveaux tableaux... mais plutot dans le DIV qui le contient : "Partie_Basse_Div"

$(function() {
   $('#inlineDatepicker').datepick
   ({onSelect:
		function(dates){
    		var dateText = $.datepick.formatDate(dates[0]);
   			document.getElementById("DATE1").value =dateText;
       		var dateArr = dateText.split("/");
        	var IDfromDateText= dateArr[2] +  dateArr[0] + dateArr[1];	 
		 
			if ($("#myDivTable_Jour_"+IDfromDateText).length > 0)
			{
				// Il existe..donc j'affiche le tableau
                AffichDiv("Table_Jour_"+IDfromDateText);
			}
			else
			{
				// L'element n'existe pas.. je le crée ( clone)..                         
                      CreaTable("Table_Jour_"+IDfromDateText);                   
                  AffichDiv("Table_Jour_"+IDfromDateText);               
		}           
       	    }
   });
});

function AffichDiv(idTable){
    //On masque TOUS les tableaux
 	$('div[name="MesTBL"]').hide(); 
    // On affiche celui que l'on a selectionné
 	$('#myDiv'+ idTable).show();   
}

function CreaTable(idTable){
    //On clone le tableau d'origine
    //et je lui donne comme ID : "MonTableau_"+ IDfromDateText 
    $("#Partie_Basse_Div").append("<div name='MesTBL' id='myDiv" + idTable + "'></div>")
    $("#Table_Jour").clone().appendTo("#myDiv" + idTable)  
}




sa ne masque pas le tableau d'origine.
J'ai essayer avec :
$("#Table_Jour").hide();
et
$("#Table_Jour").show();
.... .show... ne cachera jamais un élément...c'est fait pour le montrer justement.

.. Déjà.. tu peux masquer ton tableau d'origine..dès le départ. Tu n'as surement pas besoin de l'afficher. Donc tu peux utiliser le style : "display:none".
Sinon... le code :
$("#Table_Jour").hide();
devrait fonctionner.


Voilou.

N'oublies pas de mettre le sujet en résolu si tes soucis sont traités.

Messages postés
295
Date d'inscription
vendredi 26 avril 2013
Statut
Membre
Dernière intervention
15 juillet 2015
1
Mais il faut quand même le faire apparaître lors du clonage, comment sa se passe si on utilise
 display :"none";
?
Messages postés
32477
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
15 mai 2021
347
Tu n'as qu'à faire un .show avant de cloner.
Messages postés
295
Date d'inscription
vendredi 26 avril 2013
Statut
Membre
Dernière intervention
15 juillet 2015
1
OK donc sa foctionne comme avec le hide() .
Merci
Messages postés
32477
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
15 mai 2021
347
Bonjour,

Je ne comprend pas ta question...

Tu as déjà toutes les billes pour réussir ce que tu souhaites.
Dans tes différentes questions on a déjà traité le fait d'afficher/masquer les tableaux... le clonage;.. etc...

Il faut que tu te serves de tout ce qui t'a déjà été donné pour le faire...

J'ai l'impression qu'à chaque étape de ton code tu viens poser la question sur le forum et tu attends qu'on écrive le code pour toi.... ce n'est pas le but de ce forum....

Si tu reprends le dernier code sur lequel on a travaillé... tu as juste à y mettre le clonage dans la fonction CreaTable()

Avant de poser une question, merci de lire la charte du site.
Cordialement, Jordane
Messages postés
295
Date d'inscription
vendredi 26 avril 2013
Statut
Membre
Dernière intervention
15 juillet 2015
1
Non, je n'attend pas que vous m'écriviez le code mais des explications car souvent se qui vous parer simple et claire pour moi c'est obscure.
Alors quand j'ai du code que je comprend est qui fais se que je souhaite je remplace le code obscure par celui-ci.
Mais c'est souvent au prix de nombreux bug, que souvent je ne comprend pas.

Et je cherche a comprendre c'est tout.
Merci
Messages postés
295
Date d'inscription
vendredi 26 avril 2013
Statut
Membre
Dernière intervention
15 juillet 2015
1
Bonjour,
Je reformule ma demande pour qu'elle soit plus claire:
"Pouvez vous m'indiquer mes erreur sans me donner la solution (et lequel de c'est deux code fonctionnerait le mieux.)"
Comme le ferait un enseignant disent:
"Tu a faut la se n'est pas la bonne solution"

Voila le code V1:
<body>

<div id="inlineDatepick"></div>
 <input type="date" id="DATE1" Value='date' Size="9"></input>

<br>
	
<fieldset id="Partie_Basse_Fieldset">
<legend> DAILY TIMETABLE per request</legend>

<div id="Partie_Basse_Div">
	<table id="Table_Jour_" border="2">
	<tbody>
		<tr align="center" id="Tab"> 
			<td bgcolor="#F0FFFF"></td>	
			<td bgcolor="#F0FFFF">Date</td>
			<td bgcolor="#F0FFFF">Request</td>
			<td bgcolor="#F0FFFF">Time(h)</td>
			<td bgcolor="#F0FFFF">Description</td>
			<td bgcolor="#F0FFFF">Worker</td>
		</tr>		
		<tr align="center" id="Line">
			<td>					
				<input type="button" name="NLine" id=""  size="3" value="New" 
					onclick="CloneLine(this.parentNode.parentNode);">
				</input>		
			</td>
			<td>					
				<input type="date" name="TI_Date" id="TI_Date"  size="9" value="" readonly="readonly"></input>		
			</td>
			<td>					
				<SELECT id="TS_Request_" NAME="SRequest" onChange="saveValue(this)">
					<option value="*****************" selected="selected"></option>
					<option>*****************
				</SELECT>		
			</td>
			<td>					
				<input type="text" name="time" id="TI_Time_"  size="5" value=""></input>		
			</td>			
			<td>					
				<textarea name="" id="TA_Description_" rows="2" cols="30" value=""></textarea>			
			</td>
			<td>					
				<SELECT id="TS_Worker_" NAME="SWorker" onChange="saveValue(this)">
					<option value="*****************" selected="selected"></option>
					<option>*****************
				</SELECT>		
			</td>										
		</tr>	
	</tbody>
	</table>
</div>	
<div></div>
</fieldset> 

<style>
.foo 
{
    color: blue;
}

.foo td
{
     border:1px;
}
</style>

<script type="text/javascript">
$(function() 
{
   $('#inlineDatepick').datepick
   ({onSelect:
		function(dates)
   		{
    		var dateText = $.datepick.formatDate(dates[0]);
			document.getElementById("DATE1").value = dateText;
			
        	var dateArr = dateText.split("/");
        	var IDfromDateText= dateArr[2] +  dateArr[0] + dateArr[1]; 
		 
			if ($("#myDivTable_Jour_"+IDfromDateText).length > 0) //Test la taille de l'objet si objet != vide alors il éxist
			{
				// Il existe..donc j'affiche le tableau
          	  AffichDiv("Table_Jour_"+IDfromDateText);
			}
			else($("#Table_Jour_"+IDfromDateText).length = 0) //Test la taille de l'objet si objet != vide alors il éxist
			{
				// L'element n'existe pas.. je le crée ( clone)..
				// et je lui donne comme ID : "Table_Jour_"+ IDfromDateText 
          	 	CreaTable("Table_Jour_"+IDfromDateText);                
			}      
   	 	}
	});

});

function AffichDiv(idTable)
{
    //On masque TOUS les tableaux
	$('div[name="MesTBL"]').hide(); 
    // On affiche celui que l'on a selectionné
	$('#myDiv'+ idTable).show();   
}

function CreaTable(idTable)
{
	$("#Table_Jour_").clone().insertAfter("#Table_Jour_");
    $("#Table_Jour_").append("<div name='MesTBL' id='myDiv" + idTable + "'> Tableau : " + idTable  + " </div>")
 
	var table = $('<table id="MonTableau_' + idTable + '"></table>').addClass('Table_Jour_');
	var row = $('<tr></tr>');
         
	for(i=0; i<3; i++)
	{   
		var td = $('<td></td>').text('Cellule ' + i);
		row.append(td);   
	}
	table.append(row);
	$('#myDiv'+ idTable).append(table);
	//On masque le DIV noouvellement créé
    $('#myDiv'+ idTable).hide();    
}

function CloneLine(Line)
{
	newLine = Line.cloneNode(true); 
	Line.parentNode.insertBefore(newLine,Line)
	//Line.parentNode.appendChild(newLine);
}

</script>

</body>


Voila m'ont code V2:
$(function() 
{
   $('#inlineDatepick').datepick
   ({onSelect:
		function(dates)
   		{
    		var dateText = $.datepick.formatDate(dates[0]);
			document.getElementById("DATE1").value = dateText;
			
        	var dateArr = dateText.split("/");
        	var IDfromDateText= dateArr[2] +  dateArr[0] + dateArr[1]; 

			if ($("#Table_Jour_"+IDfromDateText).length > 0)//Test la taille de l'objet si objet != vide alors il éxist
			{
				// Je masque tout les tableaux
				$('.C_T_Jour').hide();		
				// J'affiche le tableau du jour sélectionné
				$("#Table_Jour_"+IDfromDateText).show();
			}
			else($("#Table_Jour_"+IDfromDateText).length = 0)//Test la taille de l'objet si objet != vide alors il éxist
			{
				// Je masque tout les Tableaux
				$('.C_T_Jour').hide();
				// Je fais apparaitre le tableau original pour le cloner
				$("#Table_Jour_").show();
				// Je clone le tableau original				
          	 	$("#Table_Jour_").clone().insertAfter("#Table_Jour_");
				//Je lui donne un nouvel ID : "Table_Jour_"+IDfromDateText 
				$("#Table_Jour_").clone().attr('id', "#Table_Jour_"+IDfromDateText);
				//Je masque le tableau original
				$("#Table_Jour_").hide();
			}      
   	 	}
	});

});
Messages postés
295
Date d'inscription
vendredi 26 avril 2013
Statut
Membre
Dernière intervention
15 juillet 2015
1
Bonjour,
Pouvez vous m'aider a voir ou sont mes erreur dans ses deux script (Il ont théoriquement le même fonctionnement)

Script 1:
$(function() 
{
   $('#inlineDatepick').datepick
   ({onSelect:
  function(dates)
     {
      var dateText = $.datepick.formatDate(dates[0]);
   document.getElementById("DATE1").value = dateText;
   
         var dateArr = dateText.split("/");
         var IDfromDateText= dateArr[2] +  dateArr[0] + dateArr[1]; 
   
   if ($("#myDivTable_Jour_"+IDfromDateText).length > 0) //Test la taille de l'objet si objet != vide alors il éxist
   {
    // Il existe..donc j'affiche le tableau
    AffichDiv("Table_Jour_"+IDfromDateText);
    
   }
   else($("#myDivTable_Jour_"+IDfromDateText).length = 0) //Test la taille de l'objet si objet != vide alors il éxist
   {
    // L'element n'existe pas.. je le crée ( clone)..
    $("#Table_Jour_").clone().insertAfter("#Table_Jour_"); 
    // et je lui donne comme ID : "Table_Jour_"+ IDfromDateText 
             CreaTable("Table_Jour_"+IDfromDateText);                
   }      
      }
 });

});

function AffichDiv(idTable)
{
    //On masque TOUS les tableaux
 $("table[name='mesTab']").hide(); 
    // On affiche celui que l'on a selectionné
 $("#"+ idTable).show(); 
 document.getElementById("DATE2").value = idTable; 
}

function CreaTable(idTable)
{
    $("#Table_Jour_").append("<div name='MesTBL' id='myDiv" + idTable + "'> Tableau : " + idTable  + " </div>")
 var table = $('<table id="Table_Jour_' + idTable + '"></table>').addClass('Table_Jour_');
 var row = $('<tr></tr>');
         
 for(i=0; i<3; i++)
 {   
  var td = $('<td></td>').text('Cellule ' + i);
  row.append(td);   
 }
 table.append(row);
 $('#myDiv'+ idTable).append(table);
 //On masque le DIV noouvellement créé
    $('#myDiv'+ idTable).hide();    
 
}


Script 2:
<script type="text/javascript">
$(window).load(function()
{
 var dateTextInit = new Date(d,m,y);
 document.getElementById("DATE1").value = dateTextInit;
   
    var dateArr = dateTextInit.split("/");
    var IDfromDateText= dateArr[2] +  dateArr[0] + dateArr[1]; 
    
 // Je clone le tableau original    
    $("#Table_Jour_").clone().insertAfter("#Table_Jour_");
 //Je lui donne un nouvel ID : "Table_Jour_"+IDfromDateText et à ces éléments
 $("#Table_Jour_").clone().attr('id', "#Table_Jour_"+IDfromDateText);
 //Je masque le tableau original
 $("#Table_Jour_").hide();
});

$(function() 
{
   $('#inlineDatepick').datepick
   ({onSelect:
  function(dates)
     {
      var dateText = $.datepick.formatDate(dates[0]);
   document.getElementById("DATE1").value = dateText;
   
         var dateArr = dateText.split("/");
         var IDfromDateText= dateArr[2] +  dateArr[0] + dateArr[1]; 

   var Id_Tab = $("#Table_Jour_"+IDfromDateText);
   
   if ($(Id_Tab).length > 0)//Test la taille de l'objet si objet != vide alors il éxist
   {    
    //On masque TOUS les tableaux
    $('.Class_Tab_Jour').hide(); 
          // J'affiche le tableau du jour sélectionné
    $(Id_Tab).show();
    document.getElementById("DATE2").value = Id_Tab;     
   }
   else($(Id_Tab).length = 0)//Test la taille de l'objet si objet != vide alors il éxist
   {
    // Je masque tout les Tableaux
    $('.Class_Tab_Jour').hide();
    // Je fais apparaitre le tableau original pour le cloner
    $("#Table_Jour_").show();
    // Je clone le tableau original    
             $("#Table_Jour_").clone().insertAfter("#Table_Jour_");
    //Je lui donne un nouvel ID : "Table_Jour_"+IDfromDateText et à ces éléments
    var New_Id = $("#Table_Jour_"+IDfromDateText);
    $("#Table_Jour_").clone().attr('id', New_Id);
    //Je masque le tableau original
    $("#Table_Jour_").hide();
   }      
      }
 });

});

function CloneLine(Line)
{
 newLine = Line.cloneNode(true); 
 Line.parentNode.insertBefore(newLine,Line)
 //Line.parentNode.appendChild(newLine);
}

</script>


Merci et que le café soit avec vous.
Messages postés
295
Date d'inscription
vendredi 26 avril 2013
Statut
Membre
Dernière intervention
15 juillet 2015
1
Salut j'ai fais quelque motif sur le script 2 (pour corriger la Date):

Script 2 :
<script type="text/javascript">
$(window).load(function()
{
	var Date_Init =  new Date();
	var N_Day=Date_Init.getDate();
	var N_Month=Date_Init.getMonth();
	var N_Month_R=N_Month +1;
	var N_Year=Date_Init.getFullYear();
	document.getElementById("DATE1").value = N_Month_R + "/" + N_Day + "/" +  N_Year;
			
    var dateArr = Date_Init.split("/");
    var IDfromDateText= dateArr[2] +  dateArr[0] + dateArr[1];	
    
	// Je clone le tableau original				
    $("#Table_Jour_").clone().insertAfter("#Table_Jour_");
	//Je lui donne un nouvel ID : "Table_Jour_"+IDfromDateText et à ces éléments
	$("#Table_Jour_").clone().attr('id', "#Table_Jour_"+IDfromDateText);
	//Je masque le tableau original
	$("#Table_Jour_").hide();
});

$(function() 
{
   $('#inlineDatepick').datepick
   ({onSelect:
		function(dates)
   		{
    		var dateText = $.datepick.formatDate(dates[0]);						
        	var dateArr = dateText.split("/");
        	var IDfromDateText= dateArr[2] +  dateArr[0] + dateArr[1]; 
			document.getElementById("DATE1").value = dateText;        	
			var Id_Tab = $("#Table_Jour_"+IDfromDateText);
			
			if ($(Id_Tab).length > 0)//Test la taille de l'objet si objet != vide alors il éxist
			{				
				//On masque TOUS les tableaux
				$('.Class_Tab_Jour').hide(); 
   			    // J'affiche le tableau du jour sélectionné
				$(Id_Tab).show();
				document.getElementById("DATE2").value = Id_Tab; 				
			}
			else($(Id_Tab).length = 0)//Test la taille de l'objet si objet != vide alors il éxist
			{
				// Je masque tout les Tableaux
				$('.Class_Tab_Jour').hide();
				// Je fais apparaitre le tableau original pour le cloner
				$("#Table_Jour_").show();
				// Je clone le tableau original				
          	 	$("#Table_Jour_").clone().insertAfter("#Table_Jour_");
				//Je lui donne un nouvel ID : "Table_Jour_"+IDfromDateText et à ces éléments
				var New_Id = $("#Table_Jour_"+IDfromDateText);
				$("#Table_Jour_").clone().attr('id', New_Id);
				//Je masque le tableau original
				$("#Table_Jour_").hide();
			}      
   	 	}
	});

});

function CloneLine(Line)
{
	newLine = Line.cloneNode(true); 
	Line.parentNode.insertBefore(newLine,Line)
	//Line.parentNode.appendChild(newLine);
}

</script>
Messages postés
295
Date d'inscription
vendredi 26 avril 2013
Statut
Membre
Dernière intervention
15 juillet 2015
1
Bonjour,
J'ai reprit le code comme tu me la demander et changer le code de création de tableau par celui de clonage.
Maintenant sa fonction plutôt bien, mais il y a un point que je ne comprend pas:
dans la fonction (que j'ai aussi placer dans la création):
function AffichDiv(idTable)
{
    //On masque TOUS les tableaux
 	$('div[name="MesTBL"]').hide(); 
    // On affiche celui que l'on a selectionné
 	$('#myDiv'+ idTable).show();   
}


On masque bien tout les clones mais sa ne masque pas le tableau d'origine.

J'ai essayer avec :
$("#Table_Jour").hide();

et
$("#Table_Jour").show();


pour gérer sont apparition mais lorsque je met c'est ligne sa me masque tous les tableau pas seulement le tableau d'origine.

Pourquoi ?

Merci

(Ps : voila le code de la page pour se qui voudrait le tester :
<html>

<head>
	<meta http-equiv="content-type" content="text/php; charset=ISO-8859-1" />
	<link rel="stylesheet" href="CSS/CSS_Daily_Timer.css"/>
	<link rel="stylesheet" href="CSS/Calendrier_CSS.css"/>
	<link rel="stylesheet" href="CSS/Calendar_Fixe_Design/jquery.datepick.css">
	<script type="text/javascript" src="JS/JS_JQuery_2_1_0.js"></script>
	<script type="text/javascript" src="JS/JS_JQuery_Datepick_Pluging.js"></script>
	<script type="text/javascript" src="JS/JS_JQuery_Datepick.js"></script>	
	<script type="text/javascript" src="JS/JS_Calendrier.js" ></script>
</head>

<body>

<div id="inlineDatepicker"></div>
 <input type="date" id="DATE1" Value='date' Size="9"></input>
 
<fieldset id="Partie_Basse_Fieldset">
<legend> DAILY TIMETABLE per request</legend>

<div name="MesLignes" id="Partie_Basse_Div">
	<table id="Table_Jour" border="2" name="MesTBL">
	<tbody>
		<tr align="center" id="Tab"> 
			<td bgcolor="#F0FFFF"></td>	
			<td bgcolor="#F0FFFF">Date</td>
			<td bgcolor="#F0FFFF">Request</td>
			<td bgcolor="#F0FFFF">Time(h)</td>
			<td bgcolor="#F0FFFF">Description</td>
			<td bgcolor="#F0FFFF">Worker</td>
		</tr>		
		<tr align="center" id="Line">
			<td>					
				<input type="button" name="NLine" id=""  size="3" value="New" 
					onclick="CloneLine(this.parentNode.parentNode);">
				</input>		
			</td>
			<td>					
				<input type="date" name="date" id="TDate"  size="9" value="" readonly="readonly"></input>		
			</td>
			<td>					
				<SELECT id="Select_Request" NAME="SRequest" onChange="saveValue(this)">
					<option value="*****************" selected="selected"></option>
					<option>*****************
				</SELECT>		
			</td>
			<td>					
				<input type="text" name="time" id=""  size="5" value=""></input>		
			</td>			
			<td>					
				<textarea name="" id="TextArea_Description" rows="2" cols="30" value=""></textarea>			
			</td>
			<td>					
				<SELECT id="Table_Select_Worker" NAME="SWorker" onChange="saveValue(this)">
					<option value="*****************" selected="selected"></option>
					<option>*****************
				</SELECT>		
			</td>										
		</tr>	
	</tbody>
	</table>
</div>	
<div></div>
</fieldset> 

<script>

$(function() 
{
   $('#inlineDatepicker').datepick
   ({onSelect:
		function(dates)
   		{
    		var dateText = $.datepick.formatDate(dates[0]);
   			document.getElementById("DATE1").value =dateText;
       		var dateArr = dateText.split("/");
        	var IDfromDateText= dateArr[2] +  dateArr[0] + dateArr[1];	 
		 
			if ($("#myDivTable_Jour_"+IDfromDateText).length > 0)
			{
				// Il existe..donc j'affiche le tableau
                AffichDiv("Table_Jour_"+IDfromDateText);
			}
			else
			{
				// L'element n'existe pas.. je le crée ( clone)..
                CreaTable("Table_Jour_"+IDfromDateText);                
			}           
   		}
   });
});

function AffichDiv(idTable)
{
    //On masque TOUS les tableaux
 	$('div[name="MesTBL"]').hide(); 
    // On affiche celui que l'on a selectionné
 	$('#myDiv'+ idTable).show();   
}

function CreaTable(idTable)
{
	//On clone le tableau d'origine
	//et je lui donne comme ID : "MonTableau_"+ IDfromDateText 
    $("#Table_Jour").append("<div name='MesTBL' id='myDiv" + idTable + "'></div>")
	$("#Table_Jour").clone().appendTo("#myDiv" + idTable)  
    //On masque TOUS les tableaux
 	$('div[name="MesTBL"]').hide(); 
    // On affiche celui que l'on a selectionné
 	$('#myDiv'+ idTable).show(); 
}

</script>
</body>
</html>

Messages postés
295
Date d'inscription
vendredi 26 avril 2013
Statut
Membre
Dernière intervention
15 juillet 2015
1
Et pourquoi lorsque je click deux fois sur la même date sa masque le tout ?
Messages postés
295
Date d'inscription
vendredi 26 avril 2013
Statut
Membre
Dernière intervention
15 juillet 2015
1
J'ai refait des test c'est une de mes modification qui causer se défaut
Messages postés
295
Date d'inscription
vendredi 26 avril 2013
Statut
Membre
Dernière intervention
15 juillet 2015
1
Bonjour,
Merci de m'avoir aider.
Cela marche très bien maintenant.

Voila le code :
<html>

<head>
	<meta http-equiv="content-type" content="text/php; charset=ISO-8859-1" />
	<link rel="stylesheet" href="CSS/CSS_Daily_Timer.css"/>
	<link rel="stylesheet" href="CSS/Calendrier_CSS.css"/>
	<link rel="stylesheet" href="CSS/Calendar_Fixe_Design/jquery.datepick.css">
	<script type="text/javascript" src="JS/JS_JQuery_2_1_0.js"></script>
	<script type="text/javascript" src="JS/JS_JQuery_Datepick_Pluging.js"></script>
	<script type="text/javascript" src="JS/JS_JQuery_Datepick.js"></script>	
	<script type="text/javascript" src="JS/JS_Calendrier.js" ></script>
</head>

<body>

<div id="inlineDatepicker"></div>
 <input type="date" id="DATE1" Value='date' Size="9"></input>
 
<fieldset id="Partie_Basse_Fieldset">
<legend> DAILY TIMETABLE per request</legend>

<div name="MesLignes" id="Partie_Basse_Div">
	<table id="Table_Jour" border="2" name="MesTBL">
	<tbody>
		<tr align="center" id="Tab"> 
			<td bgcolor="#F0FFFF"></td>	
			<td bgcolor="#F0FFFF">Date</td>
			<td bgcolor="#F0FFFF">Request</td>
			<td bgcolor="#F0FFFF">Time(h)</td>
			<td bgcolor="#F0FFFF">Description</td>
			<td bgcolor="#F0FFFF">Worker</td>
		</tr>		
		<tr align="center" id="Line">
			<td>					
				<input type="button" name="NLine" id=""  size="3" value="New" 
					onclick="CloneLine(this.parentNode.parentNode);">
				</input>		
			</td>
			<td>					
				<input type="date" name="date" id="TDate"  size="9" value="" readonly="readonly"></input>		
			</td>
			<td>					
				<SELECT id="Select_Request" NAME="SRequest" onChange="saveValue(this)">
					<option value="*****************" selected="selected"></option>
					<option>*****************
				</SELECT>		
			</td>
			<td>					
				<input type="text" name="time" id=""  size="5" value=""></input>		
			</td>			
			<td>					
				<textarea name="" id="TextArea_Description" rows="2" cols="30" value=""></textarea>			
			</td>
			<td>					
				<SELECT id="Table_Select_Worker" NAME="SWorker" onChange="saveValue(this)">
					<option value="*****************" selected="selected"></option>
					<option>*****************
				</SELECT>		
			</td>										
		</tr>	
	</tbody>
	</table>
</div>	
<div></div>
</fieldset> 

<script>

$(window).load(function()
{
	$("#Table_Jour").hide();
});

$(function() 
{
   $('#inlineDatepicker').datepick
   ({onSelect:
		function(dates)
   		{
    		var dateText = $.datepick.formatDate(dates[0]);
   			document.getElementById("DATE1").value =dateText;
       		var dateArr = dateText.split("/");
        	var IDfromDateText= dateArr[2] +  dateArr[0] + dateArr[1];	 
		 
			if ($("#myDivTable_Jour_"+IDfromDateText).length > 0)
			{
				// Il existe..donc j'affiche le tableau
                AffichDiv("Table_Jour_"+IDfromDateText);
			}
			else
			{
				// L'element n'existe pas.. je le crée ( clone)..
                CreaTable("Table_Jour_"+IDfromDateText); 
                // ...puis j'affiche le tableau
                AffichDiv("Table_Jour_"+IDfromDateText);               
			}           
   		}
   });
});

function AffichDiv(idTable)
{
    //On masque TOUS les tableaux
 	$('div[name="MesTBL"]').hide(); 
    // On affiche celui que l'on a selectionné
 	$('#myDiv'+ idTable).show();   
}

function CreaTable(idTable)
{
	$("#Table_Jour").show();
	//On clone le tableau d'origine
	//et je lui donne comme ID : "MonTableau_"+ IDfromDateText 
    $("#Partie_Basse_Div").append("<div name='MesTBL' id='myDiv" + idTable + "'></div>")
	$("#Table_Jour").clone().appendTo("#myDiv" + idTable)  
	$("#Table_Jour").hide();
}

function CloneLine(Line)
{
	newLine = Line.cloneNode(true); 
	Line.parentNode.insertBefore(newLine,Line)
	//Line.parentNode.appendChild(newLine);
}

</script>
</body>
</html>