IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

[AJAX] Rafraîchir deux div à des intervals différents


Sujet :

JavaScript

  1. #1
    Invité
    Invité(e)
    Par défaut [AJAX] Rafraîchir deux div à des intervals différents
    Bonjour,

    J'ai beaucoup cherché sur internet, comment raffraîchir un div automatiquement en ajax, et j'ai trouvé !

    Mais mon problème est que je n'arrive pas a trouver un code où je puisse raffraîchir deux div différents (qui pointes sur deux pages différents) à des intervals différents !

    D'avance merci,

    Grégoire

  2. #2
    Membre actif
    Profil pro
    Inscrit en
    Mars 2007
    Messages
    247
    Détails du profil
    Informations personnelles :
    Localisation : France, Bouches du Rhône (Provence Alpes Côte d'Azur)

    Informations forums :
    Inscription : Mars 2007
    Messages : 247
    Points : 276
    Points
    276
    Par défaut
    slt,

    exactement de la même maniere !

    soit tu fais deux bloc ajax (un pour chaque div) soit un seul bloc avec prise de parametre lui spécifiant le div concerné par la requête (et donc la page à interroger).

    quels sont les intervalles de rechargement et le décalage entre les deux div ?
    Conception et hébergement de votre site Web : http://www.jvprod.fr !

  3. #3
    Nouveau membre du Club
    Profil pro
    Inscrit en
    Novembre 2007
    Messages
    34
    Détails du profil
    Informations personnelles :
    Âge : 37
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations forums :
    Inscription : Novembre 2007
    Messages : 34
    Points : 38
    Points
    38
    Par défaut
    Bonsoir

    C'est pas sensé jouer grâce aux id des divs ?

    Lex

  4. #4
    Invité
    Invité(e)
    Par défaut
    Citation Envoyé par jeje13009 Voir le message
    slt,

    exactement de la même maniere !

    soit tu fais deux bloc ajax (un pour chaque div) soit un seul bloc avec prise de parametre lui spécifiant le div concerné par la requête (et donc la page à interroger).

    quels sont les intervalles de rechargement et le décalage entre les deux div ?
    Bonjour,

    merci de votre réponse !
    J'ai déjà essayé avec deux fichiers javascript (deux blocs ajax) différents mais je n'y arrive pas car je déclare les deux liens dans le <head> et je fait l'appel dans le <div> mais il n'y en a jamais que 1 sur les 2 qui fonctionne ! je pense que c'est a cause qu'il ne sait pas quel lien correpond a quel div ?

    voici l'exemple:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
     
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
      <meta http-equiv="content-type" content="text/html; charset=windows-1250">
      <meta name="generator" content="PSPad editor, www.pspad.com">
      <title>Tableau affichage</title>
      <LINK rel="stylesheet" type="text/css" href="style.css">
      <script type="text/javascript" src="message.js"></script>
      <script type="text/javascript" src="tableau.js"></script>
    	</head>
      <body> 
     
      <div id="refresh_message"> </div>
      <div id="refresh_tableau"> </div>
     
     </body>
    </html>
    et voici le contenu d'un fichier script (refresh_tableau -> tableau.js):

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
     
    var oO =
    {
    	'tempoXHR': 5000,
    	'tempoRefresh': 5000,
    	'url': 'tableau.php',
     
    	connect: function(oElem, sEvType, fn, bCapture)
    	{
    		return document.addEventListener ?
    			oElem.addEventListener(sEvType, fn, bCapture):
    			oElem.attachEvent ?
    				oElem.attachEvent('on' + sEvType, fn):
    				false;
    	},
     
    	aTag: function(oEl, sTag)
    	{
    		return oEl.getElementsByTagName(sTag);
    	},
     
    	bXHRSupport: (typeof XMLHttpRequest != "undefined"),
     
    	bActiveXSupport: (window.ActiveXObject),
     
    	aMSXML: ["Microsoft.XMLHTTP",
    		"MSXML2.XMLHTTP", "MSXML2.XMLHTTP.3.0",
    		"MSXML2.XMLHTTP.4.0", "MSXML2.XMLHTTP.5.0",
    		"MSXML2.XMLHTTP.6.0", "MSXML2.XMLHTTP.7.0"],
     
    	createXHR: function()
    	{
    		if(oO.bXHRSupport)
    			return new XMLHttpRequest;
    		else if(oO.bActiveXSupport)
    		{
    			var iI;
     
    			iI = oO.aMSXML.length;
     
    			do
    			{
    				try
    				{
    					return new ActiveXObject(oO.aMSXML[--iI]);
    				}
    				catch(oError) { };
    			}
    			while(iI > 0);
     
    			throw new Error("L'objet oXHR n'a pas été créé");
    		}
    	},
     
    	getXHR: function(oReq)
    	{
    		var oXHR, oTimer;
     
    		oXHR = oO.createXHR();
    		oO.oReq = oReq;
     
    		oXHR.open(oO.oReq['method'], oO.oReq['url'], true);
     
    		oTimer = setTimeout(
    			function()
    			{
    				if(oXHR)
    					return oXHR.abort();
    			},
    			oO['tempoXHR']
    		);
     
    		oXHR.onreadystatechange = function()
    		{
    			if(oXHR.readyState === 4)
    				if(oXHR.status && /200|304/.test(oXHR.status))
    				{
    					clearTimeout(oTimer);
     
    				oO.oReq['response'] = oXHR.responseText;
     
    				if(oO.oReq['callback'])
    					(oO.oReq['callback'])();
    				}
    		}
     
    		oXHR.setRequestHeader("If-Modified-Since", "Sat, 1 Jan 2000 00:00:00 GMT");
     
    		if(oO.oReq['method'] === 'post')
    			oXHR.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
     
    		return oO.oReq['method'] === 'get' ?
    			oXHR.send(null):
    			oXHR.send(oO.oReq['param']);
    	},
     
    	control: function(oEl)
    	{
    		return setInterval(
    			function()
    			{
    				return oO.getXHR(
    					{
    						'cible': oEl,
    						'url': oO['url'],
    						'method': 'get',
    						'callback': function()
    						{
    							return oO.refresh_tableau(oO.oReq['cible'], oO.oReq['response']);
    						}
    					}
    				);
    			},
    			oO['tempoRefresh']
    		);
    	},
     
    	refresh_tableau: function(oEl, sResponse)
    	{
    		return oEl.innerHTML = sResponse;
    	},
     
    	init: function()
    	{
    		var aDivs, iDiv;
     
    		aDivs = oO.aTag(document, 'div');
    		iDiv = aDivs.length;
     
    		do if(aDivs[--iDiv].className === 'refresh_tableau')
    			oO.control(aDivs[iDiv]);
    		while(iDiv > 0);
     
    		return true;
    	}
    };
     
    oO.connect(window, 'load', oO.init, false);
    Les intervals pour le refresh_message=60 sec, et le refresh_tableau= 5 sec


    J'espère que c'est assez claire et compréhensible !

    Merci,

    Grégoire
    Dernière modification par Deepin ; 07/06/2011 à 11h07.

  5. #5
    Invité
    Invité(e)
    Par défaut Solution trouvée
    Bonjour,

    voila j'ai trouvé la solution:

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
     
    new Ajax.PeriodicalUpdater(
    	'monDiv',
    	'http://mon-domaine.com/ma/page.php',
    	{
    		insertion: Insertion.Bottom,
    		frequency: 5
    	}
    );

    Grégoire

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Réponses: 1
    Dernier message: 17/07/2011, 14h25
  2. Aligner deux div de hauteur différent en bas
    Par Colbix dans le forum Mise en page CSS
    Réponses: 4
    Dernier message: 28/05/2010, 15h28
  3. Réponses: 2
    Dernier message: 15/11/2007, 10h37
  4. [AJAX] Script AJAX pour remplir deux "div"
    Par AllCoKe dans le forum Général JavaScript
    Réponses: 11
    Dernier message: 16/02/2007, 22h53
  5. [AJAX] Mise a jour de deux div
    Par Phenomenium dans le forum Général JavaScript
    Réponses: 1
    Dernier message: 06/09/2006, 19h38

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo