11524 sujets

JavaScript, DOM et API Web HTML5

Pages :
(reprise du message précédent)

Bonjour Heyon,

Merci pour ton aide très appréciée.

J'avais vu cet article hier, je vais le relire attentivement.

J'ai ajouté ton code comme ceci :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<title>Test</title> 
<style type="text/css"> 
td { 
    border: 1px solid blue; 
} 
</style> 
<script type="text/javascript"> 
 
// fonction addEvent (http://www.scottandrew.com/weblog/jsjunk) 
//fonction générique pour IE et pour FF
function addEvent(oElem, sEvType, fn, bCapture) 
{ 
   return oElem.addEventListener? 
      oElem.addEventListener(sEvType, fn, bCapture): 
      oElem.attachEvent? 
         oElem.attachEvent('on' + sEvType, fn): 
         oElem['on' + sEvType] = fn; 
} 
 
// fonction test 
var oTest = 
{ 
    // Initialisation des évènements sur les TD 
    _Init: function() 
    { 
        // Récupération de tous les TD de la table 
        var lTDs = document.getElementById('maTable').getElementsByTagName('td'); 
        if(!lTDs) return; 
        for(var iI = 0; iI < lTDs.length; ++iI){    // Pour chaque TD... 
            var eTD = lTDs[iI]; 
            // addEventListener 
            addEvent(eTD, 'click', oTest._ClickGauche, false); 
            addEvent(eTD, 'contextmenu', oTest._ClickDroit, false); 
        } 
    }, 
     
    // Affichage Clic Gauche 
    _ClickGauche: function(event) 
    { 
        var oElem = event.target || window.event.srcElement; 
        alert("Clic Gauche sur " + oElem.id); 
    }, 
     
    // Affichage Clic Droit 
    _ClickDroit: function(event) 
    { 
        var oElem = event.target || window.event.srcElement; 
        alert("Clic Droit sur " + oElem.id); 
        if (event.preventDefault) {  
          event.preventDefault();  
        }  
        event.returnValue = false; 
    } 
}; 
 
if(document.getElementById && document.getElementsByTagName) addEvent(window, 'load', oTest._Init, false); 
 
</script> 
</head> 
<body> 
<table id="maTable"> 
    <tr> 
        <td id="td1_1">Bla Bla 1_1</td> 
        <td id="td1_2">Bla Bla 1_2</td> 
        <td id="td1_3">Bla Bla 1_3</td> 
    </tr> 
    <tr> 
        <td id="td2_1">Bla Bla 2_1</td> 
        <td id="td2_2">Bla Bla 2_2</td> 
        <td id="td2_3">Bla Bla 2_3</td> 
    </tr> 
</table> 
</body> 
</html>


ça ne fonctionne pas, j'ai pourtant mis l'ID de mon tableau Smiley confus

Qu'en penses-tu ?

Encore merci pour tout.

beegees
Smiley hmm Ben je ne vois pas pourquoi : si je fais un copié / collé de ce code il fonctionne dans IE6+ et FF2+ (pas dans Opera ni Safari mais j'ai mis à jour mon post précédent).

Il faut donc debugger : l'extension Firebug est très bien pour ça...
Un copié/collé de ton code dans une nouvelle page HTML fonctionne parfaitement.

C'est quand je copie/Colle ce code dans mes pages que ça ne va pas (aucune erreur avec firebug.

C'est l'endroit où je le copie qui est pas correct.

J'ai essayé ici (sans succès) :

function addEvent(oElem, sEvType, fn, bCapture) 
{ 
   return oElem.addEventListener? 
      oElem.addEventListener(sEvType, fn, bCapture): 
      oElem.attachEvent? 
         oElem.attachEvent('on' + sEvType, fn): 
         oElem['on' + sEvType] = fn; 
} 
 

function Generation_Calendrier(afficher_tableau)
{
	
	// fonction test 
var oTest = 
{ 
    // Initialisation des évènements sur les TD 
    _Init: function() 
    { 
        // Récupération de tous les TD de la table 
        var lTDs = document.getElementById('Tableau_calendrier').getElementsByTagName('td'); 
        if(!lTDs) return; 
        for(var iI = 0; iI < lTDs.length; ++iI){    // Pour chaque TD... 
            var eTD = lTDs[iI]; 
            // addEventListener 
            addEvent(eTD, 'click', oTest._ClickGauche, false); 
            addEvent(eTD, 'contextmenu', oTest._ClickDroit, false); 
        } 
    }, 
     
    // Affichage Clic Gauche 
    _ClickGauche: function(event) 
    { 
        var oElem = event.target || window.event.srcElement; 
        alert("Clic Gauche sur " + oElem.id); 
    }, 
     
    // Affichage Clic Droit 
    _ClickDroit: function(event) 
    { 
        var oElem = event.target || window.event.srcElement; 
        alert("Clic Droit sur " + oElem.id); 
        if (event.preventDefault) {  
          event.preventDefault();  
        }  
        event.returnValue = false; 
    } 
}; 
 
if(document.getElementById && document.getElementsByTagName) addEvent(window, 'load', oTest._Init, false); 
	//alert(afficher_tableau);
	
	// je récupère les valeurs des listes déroulantes
	var mois = document.getElementById('listMois');
	var LeMois = mois.options[mois.selectedIndex].value;
	//alert(LeMois);
	//si on choisis "Choisissez un mois" je ne vais pas plus loin
	if(LeMois == 0) return false;
	var annee = document.getElementById('listAnnee');
	var Lannee = annee.options[annee.selectedIndex].value;
	//alert(Lannee);
	//alert(annee);
	var xhr = getXhr();
	xhr.onreadystatechange = function()
	{
		//alert(xhr.readyState);
		//alert(xhr.status);
		//fin de la 1re partie de l'excution ajax tant que etat et status ne sont pas ok
		if(xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0 ) )
			
		{
			LeRetour = xhr.responseText; 
			//alert(xhr.responseText);
			
			document.getElementById('Calendrier').innerHTML = LeRetour;
			//si la variable globale afficher_tableau est différente de rien, j'affiche le calque
			if(afficher_tableau != '') 
			{	
				//alert("ici");
				afficher_calque_confirmation();
					
			}
			
			
			
		}
	}
	
	xhr.open("POST","AJAX/Generer_Calendrier.php",true);
	xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
	xhr.send("LeMois="+LeMois+"&Lannee="+Lannee);
}


aucune erreur avec firebug, aucune alerte quand je clic gauche ou droite sur un td.

Merci encore.

beegees
hem... encore une fois : si tu effectues le addEvent avant que le tableau n'ait été créé ça ne peut pas fonctionner puisque le tableau (et donc les TD) n'existe pas encore.

Et encore une fois le retour : ma remarque sur le fait de ne pas utiliser Ajax pour créer le tableau en question me semblait pourtant sensée...
Donc, si le tableau n'est pas en AJAX, ça devrait fonctionner avec IE et Firefox ?

Je vais recommencer le tableau afin qu'il ne soit pas en AJAX alors.

Merci pour tout.

beegees
beegees a écrit :
Donc, si le tableau n'est pas en AJAX, ça devrait fonctionner avec IE et Firefox ?
Oui car dans ce cas l'élément existera au moment du addEvent.

beegees a écrit :
Merci pour tout.
You're welcome ! Smiley smile
j'ai réfléchi à ce que tu m'as dis :

ça, c'est le retour de AJAX (une partie car l'alerte ne montre pas tous) :

<html>

<head>



</head>

<body>
	<table id="Tableau_calendrier" border="1" width="80%" border="10" align="center" cellpadding="0">

		<tr>

			<th height="10" width="100" colspan="2">LUNDI</th>

			<th height="10" width="100" colspan="2">MARDI</th>

			<th height="10" width="100" colspan="2">MERCREDI</th>

			<th height="10" width="100" colspan="2">JEUDI</th>

			<th height="10" width="100" colspan="2">VENDREDI</th>

			<th height="10" width="100" colspan="2">SAMEDI</th>

			<th height="10" width="100" colspan="2">DIMANCHE</th>

		</tr>

		<tr>



<td colspan="2" class="td_jour"></td> 

				<td colspan="2" id="1_num_jour" style="text-align:center">1</td> 

				<td colspan="2" id="2_num_jour" style="text-align:center">2</td> 

				<td colspan="2" id="3_num_jour" style="text-align:center">3</td> 

				<td colspan="2" id="4_num_jour" style="text-align:center">4</td> 

				<td colspan="2" id="5_num_jour" style="text-align:center">5</td> 

				<td colspan="2" id="6_num_jour" style="text-align:center">6</td></tr>

	<tr><td></td><td></td><td style="text-align:center">A.M.</td><td style="text-align:center">P.M.</td><td style="text-align:center">A.M.</td><td style="text-align:center">P.M.</td><td style="text-align:center">A.M.</td><td style="text-align:center">P.M.</td><td style="text-align:center">A.M.</td><td style="text-align:center">P.M.</td><td style="text-align:center">A.M.</td><td style="text-align:center">P.M.</td><td style="text-align:center">A.M.</td><td style="text-align:center">P.M.</td></tr>

	<tr><td></td><td></td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"id="2009_12_1_AM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"id="2009_12_1_PM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"id="2009_12_2_AM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"id="2009_12_2_PM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"id="2009_12_3_AM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"id="2009_12_3_PM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"id="2009_12_4_AM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"id="2009_12_4_PM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"id="2009_12_5_AM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"id="2009_12_5_PM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"id="2009_12_6_AM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"id="2009_12_6_PM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td></tr>

				<td colspan="2" style="text-align:center">7</td>

				<td colspan="2" style="text-align:center">8</td>

				<td colspan="2" style="text-align:center">9</td>

				<td colspan="2" style="text-align:center">10</td>

				<td colspan="2" style="text-align:center">11</td>

				<td colspan="2" style="text-align:center">12</td>

				<td colspan="2" style="text-align:center">13</td></tr>

			<tr><td style="text-align:center"> A.M. </td>

					  <td style="text-align:center"> P.M. </td><td style="text-align:center"> A.M. </td>

					  <td style="text-align:center"> P.M. </td><td style="text-align:center"> A.M. </td>

					  <td style="text-align:center"> P.M. </td><td style="text-align:center"> A.M. </td>

					  <td style="text-align:center"> P.M. </td><td style="text-align:center"> A.M. </td>

					  <td style="text-align:center"> P.M. </td><td style="text-align:center"> A.M. </td>

					  <td style="text-align:center"> P.M. </td><td style="text-align:center"> A.M. </td>

					  <td style="text-align:center"> P.M. </td></tr>

				<tr><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"

					id="2009_12_7_AM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"id="2009_12_7_PM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"

					id="2009_12_8_AM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"id="2009_12_8_PM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"

					id="2009_12_9_AM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"id="2009_12_9_PM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"

					id="2009_12_10_AM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"id="2009_12_10_PM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"

					id="2009_12_11_AM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"id="2009_12_11_PM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"

					id="2009_12_12_AM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"id="2009_12_12_PM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"

					id="2009_12_13_AM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"id="2009_12_13_PM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td></tr>

				<td colspan="2" style="text-align:center">14</td>

				<td colspan="2" style="text-align:center">15</td>

				<td colspan="2" style="text-align:center">16</td>

				<td colspan="2" style="text-align:center">17</td>

				<td colspan="2" style="text-align:center">18</td>

				<td colspan="2" style="text-align:center">19</td>

				<td colspan="2" style="text-align:center">20</td></tr>

			<tr><td style="text-align:center"> A.M. </td>

					  <td style="text-align:center"> P.M. </td><td style="text-align:center"> A.M. </td>

					  <td style="text-align:center"> P.M. </td><td style="text-align:center"> A.M. </td>

					  <td style="text-align:center"> P.M. </td><td style="text-align:center"> A.M. </td>

					  <td style="text-align:center"> P.M. </td><td style="text-align:center"> A.M. </td>

					  <td style="text-align:center"> P.M. </td><td style="text-align:center"> A.M. </td>

					  <td style="text-align:center"> P.M. </td><td style="text-align:center"> A.M. </td>

					  <td style="text-align:center"> P.M. </td></tr>

				<tr><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"

					id="2009_12_14_AM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"id="2009_12_14_PM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"

					id="2009_12_15_AM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"id="2009_12_15_PM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Reservation',this.id,'user');"> &nbsp; </td><td width="100px" height="50px" style="text-align:center;background-color :#ffffff"

					id="2009_12_16_AM"onmousedown="menuContextuel(event, 'menucontextuelProposer_Re


après ce retour le tableau existe tu es d'accord ?

Je remplis la div avec le code reçu en retour :

document.getElementById('Calendrier').innerHTML = LeRetour;


Donc le tableau est bel et bien généré à ce moment là ?

J'appelle ma fonction test :

test();
dont voici le code :



function addEvent(oElem, sEvType, fn, bCapture) 
		{ 
		   return oElem.addEventListener? 
			  oElem.addEventListener(sEvType, fn, bCapture): 
			  oElem.attachEvent? 
				 oElem.attachEvent('on' + sEvType, fn): 
				 oElem['on' + sEvType] = fn; 
		} 
		
		function test()
		{
		alert("je suis dans test");
		// fonction test 
		var oTest = 
		{ 
			// Initialisation des évènements sur les TD 
			_Init: function() 
			{ 
				// Récupération de tous les TD de la table 
				var lTDs = document.getElementById('Tableau_calendrier').getElementsByTagName('td'); 
				if(!lTDs) return; 
				for(var iI = 0; iI < lTDs.length; ++iI){    // Pour chaque TD... 
					var eTD = lTDs[iI]; 
					// addEventListener 
					addEvent(eTD, 'click', oTest._ClickGauche, false); 
					addEvent(eTD, 'contextmenu', oTest._ClickDroit, false); 
				} 
			}, 
			 
			// Affichage Clic Gauche 
			_ClickGauche: function(event) 
			{ 
				var oElem = event.target || window.event.srcElement; 
				alert("Clic Gauche sur " + oElem.id); 
			}, 
			 
			// Affichage Clic Droit 
			_ClickDroit: function(event) 
			{ 
				var oElem = event.target || window.event.srcElement; 
				alert("Clic Droit sur " + oElem.id); 
				if (event.preventDefault) {  
				  event.preventDefault();  
				}  
				event.returnValue = false; 
			}
		}; 
		 
		if(document.getElementById && document.getElementsByTagName) addEvent(window, 'load', oTest._Init, false); 
		
		}



alert("je suis dans test");


M'informe que je suis bien dans la fonction, cette fonction est atteinte.

Maintenant, en sachant que le tableau existe (généré), que l'id est correcte, je me demande pourquoi les alertes ne se lancent pas Smiley ohwell

Vraiment désolé pour le dérangement.

beegees
Modifié par beegees (09 Aug 2009 - 15:15)
Le tableau existe bien mais il ne faut pas faire
addEvent(window, 'load', oTest._Init, false); 
puisque l'évènement window.onload a déjà été déclenché au chargement de la page mais il ne l'est pas par Ajax. Il faut faire directement
oTest._Init();

Modifié par Heyoan (09 Aug 2009 - 15:37)
Heyoan a écrit :
Le tableau existe bien mais il ne faut pas faire
addEvent(window, 'load', oTest._Init, false); 
puisque l'évènement window.onload a déjà été déclenché au chargement de la page mais il ne l'est pas par Ajax. Il faut faire directement
oTest._Init();


Merci pour ta réponse Heyoan,

Le clic gauche sur une cellule lance l'alerte.

Le clic droit ne fonctionne pas, je pense que c'est parce qu'il y a déjà un évènement onclick.

Le fonctionnement du addEvent fonctionne donc.

Est-ce que ce addEvent pourrait m'aider à récupérer la valeur de la variable globale ?

Merci de ne m'avoir pas abandonné sur ce poste, tu es sympa.

beegees
beegees a écrit :
Le clic droit ne fonctionne pas, je pense que c'est parce qu'il y a déjà un évènement onclick.
Comme je te le disais j'avais modifié mon post précédent.

Un petit exemple histoire de voir jQuery Ajax (bien sûr c'est désormais inutile puisque le tableau sera généré normalement Smiley lol ) :

calendrier.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr" xml:lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Test jQuery Ajax</title>
<link rel="shortcut icon" href="favicon.ico" />
<link rel="icon" type="image/x-icon" href="favicon.ico" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript">
<!--  
	$(function() {
		$("form").submit(function(){
			$.ajax({
				url: "remplirTableau.php",
				type: "POST",
				data: $("form").serialize(),
				success: function(feedback){
					$('#calendrier').html(feedback);
					if(document.getElementById && document.getElementsByTagName) oEventSurTD._Init(); 
				}
			});
			return false;
		});
		$("#select_mois, #select_annee").change(function(){
			$("form").submit();
		});
	});

--> 
</script> 
<script type="text/javascript"> 
<!--  
// fonction addEvent (http://www.scottandrew.com/weblog/jsjunk) 
function addEvent(oElem, sEvType, fn, bCapture) 
{ 
   return oElem.addEventListener? 
      oElem.addEventListener(sEvType, fn, bCapture): 
      oElem.attachEvent? 
         oElem.attachEvent('on' + sEvType, fn): 
         oElem['on' + sEvType] = fn; 
} 
 
// fonction test 
var oEventSurTD = 
{ 
    // Initialisation des évènements sur les TD 
    _Init: function() 
    { 
        // Récupération de tous les TD de la table 
        var lTDs = document.getElementById('maTable').getElementsByTagName('td'); 
        if(!lTDs) return; 
        for(var iI = 0; iI < lTDs.length; ++iI){    // Pour chaque TD... 
            var eTD = lTDs[iI]; 
            // addEventListener 
            addEvent(eTD, 'contextmenu', oEventSurTD._ReturnFalse, false); 
            addEvent(eTD, 'mousedown', oEventSurTD._ClickDroit, false); 
        } 
    }, 
     
    // On désactive contextmenu sur les TD pour éviter les conflits avec ClickDroit 
    _ReturnFalse: function(event) 
    { 
        if (event.preventDefault) {  
          event.preventDefault();  
        }  
        event.returnValue = false; 
    }, 
     
    // Affichage Clic Droit 
    _ClickDroit: function(event) 
    { 
        var oElem = event.target || window.event.srcElement; 
        if(event.button==2) { 
            alert("Vous avez fait un clic droit sur " + oElem.id); 
        } else { 
            alert("Vous n'avez pas fait un clic droit sur " + oElem.id); 
        } 
    } 
}; 
--> 
</script> 
<style type="text/css"> 
td { 
    border: 1px solid blue;
	padding: 5px;
	cursor: pointer;
} 
</style>
</head>
<body>
<div id="global">
	<form action="calendrier.php">
		<p>
			<label for="select_mois">Choisir un mois : </label>
			<select name="select_mois" id="select_mois">
<?php
setlocale(LC_TIME, 'french', 'fr_FR');
$today = getdate();
$mois_en_cours = $today['mon'];
for($mois = 1; $mois <= 12; $mois++) {
	$selected = $mois == $mois_en_cours ? ' selected="selected"' : '';
	echo "\t\t\t\t<option".$selected.' value="'.$mois.'">'.ucwords(strftime("%B", strtotime('2009-'.$mois.'-01')))."</option>\n";
}
?>
			</select>
			<select name="select_annee" id="select_annee">
<?php
$annee_en_cours = $today['year'];
for($annee = $annee_en_cours; $annee <= $annee_en_cours + 3; $annee++) {
	echo "\t\t\t\t<option".' value="'.$annee.'">'.$annee."</option>\n";
}
?>
			</select>
			<input type="submit" />
		</p>
	</form>
	<div id="calendrier"></div>
</div>
</body>
</html>
remplirTableau.php
<table id="maTable"> 
<?php
setlocale(LC_TIME, 'french', 'fr_FR');
header('Content-type: text/html; charset=ISO-8859-1', true);
$today = getdate();
$mois = !empty($_POST['select_mois']) ? $_POST['select_mois'] : $today['mon'];
$annee = !empty($_POST['select_annee']) ? $_POST['select_annee'] : $today['year'];

echo "\t<tr>\n";
for($jour = 1; $jour <= 31; $jour++) {
	if($jour > 28 && !checkdate($mois, $jour, $annee)) { // Cette date est-elle valide ?
		break; // Si non -> on sort de la boucle
	}
	if($jour%5==1) { // Saut de ligne tous les 5 jours
		if($jour > 1) echo "\t</tr>\n";
		echo "\t<tr>\n";
	}
	$date = $annee."-".$mois."-".$jour;
	echo "\t\t<td id=\"td_".$date."\">".ucwords(strftime("%A %d %B %Y", strtotime($date)))."</td>\n";
}
echo "\t</tr>\n";
?>
</table>
Heyoan,

Avec ton aide, je pense (je n'ose pas trop m'avancer) avoir trouvé Smiley biggrin

Voici ce que j'ai fait :

Je crée une variable globale dans les règles de l'art :


var global_id_jour = null;
function test()
		{


Donc avant la fonction, en mettant le mot clé var devant le nom de la variable et null comme valeur.

Ensuite, sur le clic droit :





_ClickDroit: function(event) 
			{ 
				var oElem = event.target || window.event.srcElement; 
				global_id_jour = oElem.id; 



J'affecte à ma variable globale "global_id_jour la valeur de oEleme.id

ça a l'air de fonctionner Smiley eek

Je tiens à te remercier sincèrement pour ton aide Heyoan.

Ton dernier code, il contient quoi comme modif ?

Big thank you to you my Friend.

beegees
Heyoan a écrit :
Est-ce que tu veux dire que ce sujet est [Résolu] ? Smiley cligne


Désolé Heyon,

J'en profite pour te dire que j'ai finalement trouvé LA solution.

Je crée dynamiquement les DIV de cette façon :

switch($_POST['id_div'])
{
	case "menucontextuelProposer_Reservation":
		echo '
		<ul>
			<li><em>Demande de r&eacute;servation</em></li>
			<li><a href="javascript:;"onClick="hideMenu(); occupe(\'proposer\',\''.$_POST['id_jour'].'\',\''.$_POST['global_couleur_td'].'\'); return false;">Proposer une r&eacute;servation</a></li>
			<li><a href="javascript:;"onClick="hideMenu(); occupe(\'ESC\'); return false;">Annuler</a></li>
		</ul>';
	break;


Cela me permet de faire parvenir à la fonction "occupe" les paramètres en évitant d'utiliser les variables globale.

Merci encore pour tout.

beegees
Pages :