begin process at 2008 08 20 17:51:10
1 228 990 membres
350 nouveaux aujourd'hui
14 259 membres club

Vous ne trouvez pas de réponse à votre problème ? Alors posez la question dans le forum.
Souvenez-vous qu'il n'y a jamais de question bête, mais rester dans l'ignorance parce que l'on n'ose pas poser une question, ça c'est une erreur !

CHARGER UNE PAGE PHP OU HTML DANS UN DIV


Information sur la source

Catégorie :Frames Classé sous : div, ajax, xmlhttprequest, onreadystatechange Niveau : Débutant Date de création : 05/05/2006 Date de mise à jour : 05/05/2006 15:55:27 Vu : 32 745

Note :
9 / 10 - par 11 personnes
9,00 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10

Commentaire sur cette source (91)
Ajouter un commentaire et/ou une note

Description

permet de charger une page html dans un div
permet de ne pas utliser les frames

Source

  • <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  • <head>
  • <title>ricardo-test</title>
  • <script type="text/javascript">
  • function envoieRequete(url,id)
  • {
  • var xhr_object = null;
  • var position = id;
  • if(window.XMLHttpRequest) xhr_object = new XMLHttpRequest();
  • else
  • if (window.ActiveXObject) xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
  • // On ouvre la requete vers la page désirée
  • xhr_object.open("GET", url, true);
  • xhr_object.onreadystatechange = function(){
  • if ( xhr_object.readyState == 4 )
  • {
  • // j'affiche dans la DIV spécifiées le contenu retourné par le fichier
  • document.getElementById(position).innerHTML = xhr_object.responseText;
  • }
  • }
  • // dans le cas du get
  • xhr_object.send(null);
  • }
  • </script>
  • <style type="text/css">
  • body
  • {
  • font-family:Verdana, Arial, Helvetica, sans-serif;
  • font-size: 0.8em;
  • margin:0;
  • padding: 0;
  • }
  • #header
  • {
  • height: 75px;
  • background-color: #99CCCC;
  • }
  • #conteneur
  • {
  • position: absolute;
  • width: 100%;
  • height:100%;
  • background-color:#D3D3D3;
  • }
  • #centre
  • {
  • background-color:#9999CC;
  • margin-left: 150px;
  • }
  • #gauche
  • {
  • position: absolute;
  • height: 750px;
  • background-color: #00CED1;
  • width: 150px;
  • }
  • </style>
  • </head>
  • <body>
  • <div id="conteneur">
  • <div id="header">
  • </div>
  • <div id="gauche">
  • <a href="#" onclick="envoieRequete('bande.html','header');" >test</a>
  • <a href="#" onclick="envoieRequete('menu.html','centre');" >test2</a>
  • </div>
  • <div id="centre">
  • </div>
  • </div>
  • </body>
  • </html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<head>
<title>ricardo-test</title>

<script type="text/javascript">
function envoieRequete(url,id)
{
	var xhr_object = null;
	var position = id;
	   if(window.XMLHttpRequest)  xhr_object = new XMLHttpRequest();
	  else
	    if (window.ActiveXObject)  xhr_object = new ActiveXObject("Microsoft.XMLHTTP"); 

	// On ouvre la requete vers la page désirée
	xhr_object.open("GET", url, true);
	xhr_object.onreadystatechange = function(){
	if ( xhr_object.readyState == 4 )
	{
		// j'affiche dans la DIV spécifiées le contenu retourné par le fichier
		document.getElementById(position).innerHTML = xhr_object.responseText;
	}
	}
	// dans le cas du get
	xhr_object.send(null);

}
</script>

<style type="text/css">
body 
{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 0.8em;
margin:0;
padding: 0;
}

#header 
{
height: 75px;
background-color: #99CCCC;
}

#conteneur 
{
position: absolute;
width: 100%;
height:100%;
background-color:#D3D3D3;
}

#centre 
{
background-color:#9999CC;
margin-left: 150px;
}

#gauche
{
position: absolute;
height: 750px;
background-color:  #00CED1;
width: 150px;
}

</style>
</head>

<body>

<div id="conteneur">
	  <div id="header">
	  </div>
	  <div id="gauche">
	  <a href="#" onclick="envoieRequete('bande.html','header');" >test</a>
	  <a href="#" onclick="envoieRequete('menu.html','centre');" >test2</a>
	  </div>
	  <div id="centre">
	  </div>
</div>
</body>
</html>
05 mai 2006 10:06:14 :
simplification du code
05 mai 2006 10:12:53 :
idem
05 mai 2006 11:52:59 :
erreur repérée par PetoleTeam . erreur corrigée ...
05 mai 2006 15:55:27 :
erreur de css
  • signaler à un administrateur
    Commentaire de toutphp le 05/05/2006 11:05:43

    Juste pour être sur d'avoir tout compris : je fais

    envoieRequete('resultat.php','centre');

    et le resultat de la page php ce mettra dans le div d'id "centre" ?

  • signaler à un administrateur
    Commentaire de PetoleTeam le 05/05/2006 11:12:46


    Bonjour...

    A corriger la ligne
      xhr_object = new ActiveXObject(Microsoft.XMLHTTP);
    par
      xhr_object = new ActiveXObject("Microsoft.XMLHTTP");

    Sinon intéréssant...

  • signaler à un administrateur
    Commentaire de atlante34 le 05/05/2006 11:50:34

    Pour repondre a TOUTPHP,
    si tu fais envoieRequete('resultat.php','centre');
    la page resultat.php s'affichera dans le div dont le id est 'centre'.

    C'est mon premier prog en AJAX, donc si il y a des remarques à faire ...

  • signaler à un administrateur
    Commentaire de PaDa le 05/05/2006 12:23:51

    intéressant !
    niveau compatibilité avec les browsers/systèmes connus, ca donne quoi ?

  • signaler à un administrateur
    Commentaire de coucou747 le 05/05/2006 13:06:40

    c'est sencé marcher partout, mais faut pas faire ça partout, c'est à consomer avec modération... sinon, les moteurs de recherches indexent mal...

  • signaler à un administrateur
    Commentaire de PaDa le 05/05/2006 13:47:02

    Ok ;)
    L'indexation peut ne pas être une priorité.. Tout dépend ce qu'on veut faire
    Merci en tout cas

  • signaler à un administrateur
    Commentaire de coucou747 le 05/05/2006 14:12:54

    c'est pour ça que j'ai dit que ça dépendait de ce que l'on voulait faire...

  • signaler à un administrateur
    Commentaire de atlante34 le 05/05/2006 15:53:53

    On peut encore faire mieux pour le code,
    Par exemple, si on veut que la page se charge dans le div au demarrage de la page, il suffit de mettre a la place de :
    <body>
    mettre,
    <body onload="envoieRequete('menu.html','centre');">

    Permet d'enlever le lien et de rendre la page plus dynamique ...

  • signaler à un administrateur
    Commentaire de toutphp le 05/05/2006 16:00:38

    Mais je pense que l'interet de cet exemple était de montrer qu'il n'y avait pas de rechargement de page lors du click.
    Alors qu'avec ton "onload" le contenu est directement présent sur la page au chargement.

  • signaler à un administrateur
    Commentaire de atlante34 le 05/05/2006 16:02:57

    A TOUTPHP,
    Le principe de onload est de faire par exemple un site WEB dynamique, sans utiliser les frames.
    Ici le onload charge les vontenus des div, exemples des menus en haut et a gauche, et permet ensuite de charger rien que le milieu.

  • signaler à un administrateur
    Commentaire de coucou747 le 05/05/2006 16:06:51

    "dynamique".... dynamique ça s'ignifie que le contenu peut changer en sans faire de mise à jour... là, c'est pas dynamique car t'as pas de langage serveur... js est un langage statique... disons que ça fait un effet sympa, mais c'est pas du dynamique...

  • signaler à un administrateur
    Commentaire de GRAZNOK le 06/05/2006 14:25:10

    Tu te contredis coucou747 : dynamique signifie que la page est générée par un serveur, ce qui est contraire à : "le contenu peut changer en sans faire de mise à jour".

    Le principe d'AJAX c'est que le contenu d'une page extérieure peut être fusionnée à la page consultée sans que le navigateur recharge la page consultée. Je ne sais pas si "dynamique" est le mot approprié ; sinon "dynamique côté client".

    Pour y ajouter le "dynamique côté serveur", il faudrait que la page extérieure soit du PHP, ASP ou autre. Ainsi on aurait les deux côtés du dynamique : "client" grâce à AJAX et "serveur" grâce à PHP.

  • signaler à un administrateur
    Commentaire de atlante34 le 06/05/2006 15:16:15

    merci Graznok

    GTR en force ...

  • signaler à un administrateur
    Commentaire de coucou747 le 06/05/2006 15:28:11

    GRAZNOK, je ne me contredis pas vraiment... le contenu change par exemple : la valeur d'un compteur de visite, le serveur ajoute 1 à chaque visite, et pourtant, il n'y a pas de mise à jour... c'est une partie dynamique...

    dynamique coté client, ça n'a selon moi pas de sens, disons que cette source permet aux gens d'ajouter une fonctionalitée comme l'abscence de rechargement...

    tu devrais quand même insérer un parseur pour enlever les balises head, et n'insérer que le contenu entre <body> et </body> comme ça, tu pourrais charger tout style de site (mais le Css pourrait géner...)

    ou sinon, tu peux ajouter un effet genre : la nouvelle page est affichée à coté avec une opacitée à 0.5, puis elle vient dessus, puis l'opacité des deux pages s'inverse... puis la page précédente prend comme opacité 0 et la nouvelle 1... bref, on peut faire des effets assez réussi...

    je noterais bien 8, mais j'attend... tu ne gères pas les erreurs éventuelles, comme l'abscence de xmlhttprequest sur le navigateur, j'attend la prochaine mise à jour avant de noter...

  • signaler à un administrateur
    Commentaire de badoux le 06/05/2006 19:13:17

    Bonjour,

    Perso en PHP, je ferai un simple include dans un div, serte moin dynamique du fais que cela se passe côté serveur et non client !

    exemple simple en php :
    <div id="center"><?php include($_GET['pageID']); ?></div>

    L'exemple ci-dessus ce n'est même pas du php et encors moin de l'AJAX ! Mais du simple XMLHttpRequest qui existe depuis longtemps !

    enfin tout ca pour dire que ca ne devrai pas être placé sur ce forum ;-)

    A++

  • signaler à un administrateur
    Commentaire de GRAZNOK le 06/05/2006 19:18:28

    Qu'est-ce que c'est l'AJAX pour toi, précisement ?

    D'autre part, on est bien sur le forum javascriptfr.com, et il y a du javascript, non ?

  • signaler à un administrateur
    Commentaire de PaDa le 06/05/2006 20:28:03

    Sans vouloir couper l'herbe sous le pied de Badoux, AJAX c'est juste des vieilles technologies qui sont remises au gout du jour a grand coup de couvertures dans les magazines. On le met un peu à n'importe quelle sauce peut être, mais en l'occurence cette source (Javascript/XMLHttpRequest...) c'est typiquement de l'AJAX quand même.. Ou alors on m'aurait menti ?

  • signaler à un administrateur
    Commentaire de GRAZNOK le 06/05/2006 22:40:29

    AJAX = Asynchronous Javascript And Xml.
    Donc c'est tout simplement l'utilisation de Javascript dans le but de transmettre de l'information sous forme XML, de manière asynchrone (c'est-à-dire grâce l'utilisation d'une méthode quelconque - ici un objet XMLHttpRequest - qui effectue cette opération n'importe quand dans le code).

    Je remercie au passage l'auteur, Atlante34, pour en avoir fourni un exemple concret.

    En ce qui concerne le standard W3C, il faut savoir que XMLHttpRequest n'en fait pas partie. D'après des recherches perso, le W3C aurait développé un moyen similaire...

  • signaler à un administrateur
    Commentaire de badoux le 07/05/2006 00:25:25

    bonsoir à tous,

    Oui sur le coup de l'emplacement du message c'est vrai que je n'ai pas assuré, je suis vraiment con... je suis tellement sur des forum php que je me persuade d'y etre même si j'y suis pas ! Veuillez m'excusez !:-o

    Au sujet de l'AJAX, ce n'est qu'un terme marketing pour relancer ces vieilles functions javascript que l'on avait oublié !

    Voila à bientôt et désolé pour le dérangement !;-)
    bonne nuit

  • signaler à un administrateur
    Commentaire de williamprotti le 07/05/2006 14:41:28

    Merci beaucoup pour cette ressource!!!
    Je voudrai juste savoir si elle est fiable, si elle est bien protégée etc...!!
    Car je commence a l'utiliser partout sur mon site!!

    Merci !

  • signaler à un administrateur
    Commentaire de apxa le 07/05/2006 15:47:01

    Iop all,
    j'ai pas l'impression qu'au niveau compatibilite ce soit top (FF retourne xhr_object.open operation non permise).

    Have Fun ;)

  • signaler à un administrateur
    Commentaire de Arto_8000 le 07/05/2006 20:28:44

    APXA -> Plusieurs naviagteurs retournent cette erreur, car par question de sécurité tu ne peux faire une requête sur un autre site.

    Ex: Si ton script XMLHttpRequest est sur un server "X" il peut faire des requêtes sur le site X, mais pas sur le "Y" ou "Z".

    Quand je dévellope des scripts JS/PHP du genre Chat, c'est assez pratique, mais point de vue compatibilité c'est pas super et même difficile, car certains navigateurs supportent mal cette fonction.

  • signaler à un administrateur
    Commentaire de apxa le 07/05/2006 21:02:12

    iop arto
    merci pour cette précision.

    Have Fun ;)

  • signaler à un administrateur
    Commentaire de williamprotti le 08/05/2006 12:01:14

    Bon moi je vais faire un truc sur mon site, je vais obliger a utiliser FireFox! Et ils devraient ce mettre au clair entre eux.... Parce que programmer 10 fois différament pour chaque navigateur c'est chiant!

  • signaler à un administrateur
    Commentaire de GRAZNOK le 08/05/2006 12:05:24

    Il y a juste l'initialisation de l'objet qui est différente pour chaque navigateur. On trouve des exemples tout fais sur Google.

    Après pour appeler les méthodes c'est pareil (l'objet c'est le même).

  • signaler à un administrateur
    Commentaire de lordbdp le 08/05/2006 12:37:10

    J'ai cru comprendre qu'il fallait installer AJAX sur le serveur pour faire tourner ses fonctionnalités. C'est faux ?

  • signaler à un administrateur
    Commentaire de badoux le 08/05/2006 12:39:13

    bonjour,

    Il est vrai que le métier de devellopeur et rude, prog>debog>prog>debog... voila une journée d'un programmeur.
    C'est particulièrement IE6 qui pose problème !
    Mais patience Internet Explorer accéptera mieu le code dans un avenir très proche :-)!

    On espère que d'ici quelques années tout les naviguateur ce seront mis au W3C :-)


    en attendant ce jour, voila un exemple qui roule à merveille ! :-)

    function httpRequest(div,file){
    var xhr_object = null;
    if(window.XMLHttpRequest) // Firefox
       xhr_object = new XMLHttpRequest();
    else if(window.ActiveXObject) // Internet Explorer
       xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
    else { // XMLHttpRequest non supporté par le navigateur
       alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
       return;
    }

    var div = div;
    var file = file;

    xhr_object.open("POST", file, true);

    xhr_object.onreadystatechange = function() {
       if(xhr_object.readyState == 4){
       //alert(file);
    document.getElementById(div).innerHTML = xhr_object.responseText;
       }
    }  
    xhr_object.send(null);
    }

    a plus !

  • signaler à un administrateur
    Commentaire de badoux le 08/05/2006 12:45:26

    c'est pas tout a fais ca !

    Tu peux installer des frameworks (lib) AJAX, pour te faciliter la tâche!

    A++

  • signaler à un administrateur
    Commentaire de jmecodol le 08/05/2006 19:46:24

    je trouve ca bluffant, couplé a un proxy maison, c'est 100 fois plus agréable que des liens basiques, chapeau !!!
    c'est super éfficace mais le top, ca serai de rajuter un éffet de transition (du style powerpoint, j'ai vu sa un jour sur un site web,mais j'ai oublié l'URL) .
    ca change la vie aux utilisateur basiques (chef de service informatique,non initiés a la programmation et habitués a la patience) .
    grand luxe !

  • signaler à un administrateur
    Commentaire de szwr le 09/05/2006 08:57:53

    En ce qui concerne la sécurité du contenu affiché, tout doit se faire du côté serveur (PHP, ASP, CGI).
    XMLHttpRequest permet cependant la construction de pages complexes et modulaires en ménageant la bande passante.

  • signaler à un administrateur
    Commentaire de kankrelune le 16/05/2006 01:49:57

    Salut... si je peut ajouter mon grain de sel... .. .

    Concernant l'instanciation de l'objet moi je fais comme suit...

    var xhr_object = false;

    if (window.XMLHttpRequest)
    {
        xhr_object = new XMLHttpRequest();
    }
    else if (window.ActiveXObject)
    {
        var ieversions = ['Msxml2.XMLHTTP.5.0', 'Msxml2.XMLHTTP.4.0', 'Msxml2.XMLHTTP.3.0', 'Msxml2.XMLHTTP', 'Microsoft.XMLHTTP'];

        for(var i=0; !xhr_object && i<ieversions.length; i++)
        {
    try
    {
        xhr_object = new ActiveXObject(ieversions[i]);
    }
    catch(e)
    {
        xhr_object = false;
    }
        }
    }


    Concernant la requete il peut être interressant de gérer les erreurs retournées... dans ce cas...


    if (document.getElementById(position) && xhr_object)
    {
       if (xhr_object.readyState == 4)
       {
          if (xhr_object.status == 200 || xhr_object.status == 304)
    document.getElementById(position).innerHTML = xhr_object.responseText;   
          else
            document.getElementById(position).innerHTML = 'Error ' + xhr_object.status + ' : ' + xhr_object.statusText;
       }
       else document.getElementById(position).innerHTML = 'Chargement en cours... veuillez patienter... .. .';

    }

    Reste un problème... principalement avec firefox... si une requete est envoyée alors que la précédente n'a pas fini d'être traitée (ex : rafraichissement d'un chat) et bien cela crée un belle erreur js... il faut alors réussir à controller l'état d'avancement de la requete en cours et si elle traine utiliser la fonction xhr_object.abord()... et là je sèche un peu... .. .

    @ tchaOo°

  • signaler à un administrateur
    Commentaire de josh666 le 29/05/2006 20:19:18

    Bonjour à tous, je tien a dire que cette focntione est très utilise pour les modules d'admistration de site... sa rend la gestion plsu fluide et ressemble plsu a une vrai application.

    Ensuite Pour : kankrelune :

    j'ai peut-etre une idée pour toi, est-ce que tu as esasyer d'ajouter dans ta focniton qui s'occupe de gérer le XMLHttpRequest d'initailiser une varialbe globale (ex: var enTraitement = true) et  lors de l'appel de la focntione a nouveau tu vérifi si cette variable est egal a true si oui tu arrete l'éxécutin de la fonction... bine sur il faut que lors que tu effectue la vérification de (xhr_object.readyState == 4) tu affecte false a ta variable..

    Si une idée comme sa, parce que j'ai jamais eu le problème donc tu parle sur mes applications..

    Sur ce ++

  • signaler à un administrateur
    Commentaire de kankrelune le 29/05/2006 20:44:29

    Salut josh666... actuellement j'utilise un timeout comme ça ça déclenche la methode abord si ça traine trop... .. .

    @ tchaOo°

  • signaler à un administrateur
    Commentaire de hvb le 01/06/2006 14:13:23

    ça n'apporte rien de plus que le tutos de toutjavascript, qui est mis en avant sur codes-sources (ici et sur phphcs) depuis plusieurs mois déja...

    Et pour le problème de compatibilité avec IE, dans IE7 l'objet xmlhttprequest sera integré en NATIF.

    Et pour finir, "les navigateurs qui bloquent l'accés a des sites externe" c'est un parametre dans les options... dans IE c'est "accés aux sources de données sur plusieurs domaines" je crois... je n'ai jamais tenté de l'activer, mais vu que lors d'une execution locale ça marche... on peut en deduire que...


    =)

  • signaler à un administrateur
    Commentaire de williamprotti le 02/06/2006 23:05:17

    Bonjour! On fait comment pour utiliser le même script, mais pour la méthode POST d'un formulaire?? Merci!

  • signaler à un administrateur
    Commentaire de kankrelune le 02/06/2006 23:52:17

    On lit les commentaires... c'est marqué... .. !

    xhr_object.open("POST", file, true);

    xhr_object.onreadystatechange = ... .. .

    xhr_object.send("mavar1=pwet&mavar2=plop&mavar3=blurp..."); (pense à échapper les caractères spéciaux)

    @ tchaOo°

  • signaler à un administrateur
    Commentaire de williamprotti le 03/06/2006 12:48:29

    Merci Kankrelune!, mais quand tu dis "(pense à échapper les caractères spéciaux)" tu veus dire les accents? Parce que les accents "éàè" etc.. aparaissent sous forme "?"

  • signaler à un administrateur
    Commentaire de kankrelune le 03/06/2006 15:44:05

    Tous les caractères spéciaux... .. .

    @ tchaOo°

  • signaler à un administrateur
    Commentaire de Kikoleskargo le 20/06/2006 16:21:18

    et ya moyen de unload ces pages en div ? :D

  • signaler à un administrateur
    Commentaire de coucou747 le 20/06/2006 16:27:05

    "<div id="center"><?php include($_GET['pageID']); ?></div>"

    jolie faille...
    sur http://coucou747.hopto.org catégorie php, il y a un lien vers une page qui explique différentes failles...

  • signaler à un administrateur
    Commentaire de LordBob le 12/07/2006 11:47:39

    salut,
    j'utilise la meme chose dans mon site internet. sauf que en utilisant cette solution, il est impossible de faire un "retour arriere" d'aller à la "page précédente" en cliquant dans le bouton du navigateur.
    je voulais savoir si quelqu'un avait une solution?
    merci par avance.

  • signaler à un administrateur
    Commentaire de kankrelune le 12/07/2006 13:13:42

    tout simplement garder dans une variable la dernière page que tu as chargé... .. .


    @ tchaOo°

  • signaler à un administrateur
    Commentaire de LordBob le 12/07/2006 14:35:54

    oui et si on veut revenir deux page en arriere?
    sinon jpense utilisé un framework ou sinon je viens de tomber sur RSH (Really Simple Historic)

  • signaler à un administrateur
    Commentaire de gdu3744 le 13/07/2006 04:20:23

    Super , exactement ce que je cherchais. Merci pour ce script.
    J'avais trouvé un peu la meme chose mais pour rapatrier du XML mais pas une page html complete.
    Cool ! ca fait 2h que je cherche...(vous avez dit productivité...;o))

  • signaler à un administrateur
    Commentaire de kankrelune le 13/07/2006 05:01:06

    Tu peux faire les deux avec les XMLHttpRequest... la différence se situe au niveau de l'attribut de réponse... .. .

    monObject.responseText => le format texte, html...

    monObject.responseXML => le format xml...

    @ tchaOo°

  • signaler à un administrateur
    Commentaire de ns_deux le 25/07/2006 20:50:34

    Bonjour à vous,
    j'ai un probleme sur cette page php. Il m'est impossible d'afficher mon resultat il s'efface aussitot. QQun saurait pourquoi?
    page principale.php
    <script type="text/javascript">
    function recharge(url,id)
    {
         var xhr_object = null;
         var position = id;
          if(window.XMLHttpRequest) xhr_object = new XMLHttpRequest();
          else
          if (window.ActiveXObject) xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
      
         // On ouvre la requete vers la page désirée
         xhr_object.open("GET", url, true);
         xhr_object.onreadystatechange = function(){
         if (document.getElementById(position) && xhr_object)
    {
       if (xhr_object.readyState == 4)
       {
          if (xhr_object.status == 200 || xhr_object.status == 304)
    document.getElementById(position).innerHTML = xhr_object.responseText;  
          else
            document.getElementById(position).innerHTML = 'Error ' + xhr_object.status + ' : ' + xhr_object.statusText;
       }
       else document.getElementById(position).innerHTML = 'Chargement en cours... veuillez patienter... .. .';

    }
         }
         // dans le cas du get
         xhr_object.send(null);
      
    }
    </script>



    <tr>
          <td><div align="left"></div>
            <div align="left"><strong>O.A.M : </strong>
            <div id="divoam" onclick="javascript:recharge('requete_oam.php','divoam');">
          
    <select name='oam' id='oam' style='width:240' >
    <?php
    echo "<option value=''></option>";
    require("connect_atelier.php");
    $req = 'SELECT DISTINCT oam FROM oam ';
    $res = mysql_query($req,$connect) or die ('Erreur : '.mysql_error() );
    while($row = mysql_fetch_assoc($res)){
    echo "<option value='".$row['oam']."'>".$row['oam']."</option>";
    }
    echo "</select>";

    ?>      </div>
            </div></td>
          <td>

    -------------------------------------------------------------

    et ma requete_oam.php

    <?php

        echo "<select name='oam' id='oam' style='width:240'>";
            echo "<option value=''></option>";
            require("connect_atelier.php");
    $req = 'SELECT DISTINCT oam FROM oam ';  
    $res = mysql_query($req,$connect) or die ('Erreur : '.mysql_error() );
    while($row = mysql_fetch_assoc($res)){
            echo "<option value='".$row['oam']."'>".$row['oam']."</option>";
    }
    echo "</select>";  



    ?>
    ---------------------------------------------------------
    Tout marche bien a part le fait que mon resultat s'efface aussi sec. i je maintien le click de souris j'ai mais valeur mais des que je relache ca s'efface bizarre. Je comprends rien
    Merci si vous pouvez m'aider

  • signaler à un administrateur
    Commentaire de gdu3744 le 06/08/2006 15:01:16

    A tout hasard , c'est peut etre lié à ton entête HTML (la premiere ligne du fichier).

  • signaler à un administrateur
    Commentaire de ns_deux le 06/08/2006 18:01:55

    Là, tu as le code brut sans les entetes et ca marche pas alors je pense pas que ca vienne des entetes.
    Qq'un arrive à faire fonctionner un menu deroulant dynamique comme le miens? si oui comment a-t-il fait?
    Merci d'avance.

  • signaler à un administrateur
    Commentaire de kbalevil le 07/08/2006 12:56:15

    Salut à tous,

    J'ai un petit soucis, j'essai de charger des contrôles (Type Dojo) avec cette méthode, mais il semble que l'utilisation de template ne soit pas possible ! Vous confirmez ?

    Merci

  • signaler à un administrateur
    Commentaire de kbalevil le 07/08/2006 13:52:21

    Bon, j'ai une piste, voilà le cas complet :

    J'ai créé un widget utilisant 4 fichiers (PHP, TPL, CSS, JS), le style de template utilisé est Smarty. Tout fonctionne très correctement si j'appelle le fichier PHP référence directement. Si par contre je met une balise qui doit être remplacée par cette feuille en utilisant cette fonction, j'ai une erreur. J'ai donc essayé de charger une feuille contenant uniquement des éléments HMTL, et là ça semble fonctionner correctement, il m'apparaît donc clairement que le système de template n'est pas compatible avec cette fonction. Si quelqu'un connait un moyen de contourner ce problème en gardant ma structure actuelle, je suis preneur.

    Merci

  • signaler à un administrateur
    Commentaire de kankrelune le 07/08/2006 15:09:33

    Je vois pas pourquoi ce système ne serait pas compatible avec l'utilisation des templates... la gestion des templates se fait coté serveur... la requete Ajax se fait coté client... rien à voir... si le fichier php cible fonctionne correctement l'erreur provient surement de la requete ajax et de son traitement... .. .

    @ tchaOo°

  • signaler à un administrateur
    Commentaire de kbalevil le 07/08/2006 15:46:40

    Ben oui, mais malheureusement ça ne fonctionne pas.
    Voici le détail :
    Je charge 'Index.php', il contient la balise à remplacer, les références au template, ainsi que la création de l'objet.
    De là, je lance la fonction javascript de remplacement.
    J'appelle la page PHP du contrôle, il là il plante sur l'enrichissement de l'objet.

    J'ai regardé dans mes déclarations, je vois rien.
    le chemin doit il faire référence au fichier de base ('Index.php') ou au fichier PHP du controle ?

    Merci

  • signaler à un administrateur
    Commentaire de kankrelune le 07/08/2006 17:19:15

    [quote]Je charge 'Index.php', il contient la balise à remplacer, les références au template, ainsi que la création de l'objet.
    De là, je lance la fonction javascript de remplacement.
    J'appelle la page PHP du contrôle, il là il plante sur l'enrichissement de l'objet.[/quote]

    J'ais du mal à comprendre la fdaçon dont tu procede... qu'est ce que tu appel références au template dans ton index.php... .. ?

    [quote]le chemin doit il faire référence au fichier de base ('Index.php') ou au fichier PHP du controle ?[/quote]

    De quel chemin tu parle ? celui de ta requete ajax... .. ?

    @ tchaOo°

  • signaler à un administrateur
    Commentaire de kbalevil le 07/08/2006 18:05:28

    Mon architecture est comme suit :
    pour chaque controle, j'ai un repertoire dans lequel j'ai 1 PHP, 1 CSS, 1 JS, 1 TPL
    Pour la page principale, j'ai 1 PHP, 1 JS

    Donc, j'ai un fichier index.php qui est la page principale, sur cette page je place des balises qui sont des références à mes controles (elles doivent être remplacées par mes controles), à la fin de cette page, je lance la fonction Javascript de remplacement de ces balises.
    Dans cette fonction, je fais appel au fichier PHP du contrôle concerné, ce fichier va implémenter le template et finalement l'envoyer à la fonction javascript en retour par le XMLHTTPRequest.
    Bon donc, j'ai réussi à afficher mon contrôle (déplacement du référencement de l'objet template dans le fichier PHP du contrôle), mais l'initialisation des variables contenues dans le fichier javascript du controle ne sont pas appellées, je m'explique, lorsque le contrôle est affiché, je le place à un endroit donné, et bien malgré l'appel à la fonction javascript à la fin du template, la fonction n'est pas exécutée, d'où mon soucis, le CSS référencé dans le fichier index.php est bien pris en compte, mais pas le fichier JS spécifique au contrôle, et si je déplace le référencement de ce fichier JS dans le fichier PHP du controle, pareil.
    Donc je pense qu'il peut y avoir un soucis de chemin, mais je n'ai pas d'erreur de chargement.

  • signaler à un administrateur
    Commentaire de gdu3744 le 07/08/2006 18:40:03

    j'ai eu egalement un probleme de chemin dans un autre cas de figure (transfert d'info entre un iframe et un div) ou le texte et les images du iframe (bien affichés) etait mal transferés (pas d'images)et j'ai fini par comprendre (avant de devenir fou...) qu'il fallait un "./" au lieu d'un "../" pour les references d'images. Du coup je ne voyais plus les images dans mon Iframe (mais pas d'importance) et les voyait dans mon div (ce que je voulais).
    peut etre que ca peut te mettre sur la piste.

    Bonjour de Montreal !

  • signaler à un administrateur
    Commentaire de kankrelune le 07/08/2006 19:39:18

    Ah ok... j'avais pas compris... arrete moi si je me trompe mais tom problème n'est pas au niveau des templates mais au niveau du code javascript contenu dans la réponse de tes XMLHTTPRequest... c'est normal... le code javascript contenu dans les XMLHTTPRequest n'est pas interprété... en fait le code javascript est chargé en même temps que la page et ne l'est plus (hormis si tu utilise eval)... .. .

    deux alternatives s'offrent à toi dans ce cas... charger toute tes fonctions javascript en même temps que la page ou alors lancer deux requetes ajax... l'une retournant le code html pour la mise à jour de ta page l'autre retournant du code javascript à passer dans un eval()... une troisième option est possible bien que plus crade c'est de mettre une balise script avec un id dans ton index et de changer dynamiquement le fichier cible en fonction de la page chargée via Ajax... .. .

    @ tchaOo°

  • signaler à un administrateur
    Commentaire de kankrelune le 07/08/2006 19:41:25

    [quote]en fait le code javascript est chargé en même temps que la page et ne l'est plus (hormis si tu utilise eval)[/quote]

    Oups c'est pas très clair... .. .

    en fait le code javascript est chargé en même temps que la page et est interprété (déclaration des fonction, etc) ensuite il ne l'est plus... hormis si tu utilise eval... .. .

    @ tchaOo°

  • signaler à un administrateur
    Commentaire de kbalevil le 08/08/2006 09:43:21

    Merci de cette précision.

    J'ai contourné le problème d'une façon sensiblement différente, lorsque la page est affichée, j'ai fais appel à un constructeur dans le fichier JS du contrôle (que j'appelle dans le index.php), mais là, je me doute que si j'ai plusieurs controles avec plusieurs constructeurs donc, je vais avoir un soucis, donc y a t il moyen d'appeler un constructeur en particulier (sans avoir recours au if, parceque je compte avoir pas mal de controles), et sans passer de paramètre genre : constructeur('nom du contrôle') + un test dans chaque constructeur ?

    Merci en tout cas pour ton aide KANKRELUNE

    gdu3744 : j'ai eu aussi du mal avec les chemins relatifs au déébut, une vraie galère, maintenant ça va. Merci de ton aide.

  • signaler à un administrateur
    Commentaire de nmdeal2 le 22/08/2006 23:17:30

    Très utile pour les affiliations.

    Merci

  • signaler à un administrateur
    Commentaire de kankrelune le 23/08/2006 15:53:32

    @ kbalevil... bah non y a pas de solution miracle c'est une des limite d'ajax... la plus contraignante à mon gout... .. .

    2 solution... gérer en fonction du module comme tu l'a dit avec des if, un switch ou un constructeur prenant le nom du module en paramètre... ou alors faire renvoyer par le serveur un tableau javascript contenant une entrée avec le contenu html et une entrée avec le code javascript à executer... l'un dans l'autre c'est un peu du bricolage... .. .

    @ tchaOo°

  • signaler à un administrateur
    Commentaire de speedylol le 13/11/2006 15:12:33

    bonjour cela fonction aussi avec une pagination en fesant l'appel de la fonction merci de votre réponse.


    comme cela svp???

    exemple:  

    <a href="#" onclick="envoieRequete('list_ann.php?id_cat=$id_cat&page=$precedent','centre');">
    précédent</a>

  • signaler à un administrateur
    Commentaire de speedylol le 19/11/2006 10:27:21

    bonjour cela fonction super bien ce script une seule question dans un <form action='truc.php'     >
    comment faire pour utiliser cette même fonction merci de vos réponse???

  • signaler à un administrateur
    Commentaire de GRAZNOK le 19/11/2006 15:14:59

    Avec un formulaire tu peux ne mettre aucune action et mettre onsubmit="envoieRequete(...)". Comme ça c'est ce qu'il y a dans onSubmit qui va s'exécuter et non plus ce qu'il y a dans action.

  • signaler à un administrateur
    Commentaire de gdu3744 le 19/11/2006 18:16:38

    quelle est la plus value de cette methode plutot qu'a utiliser des frames ?

  • signaler à un administrateur
    Commentaire de GRAZNOK le 19/11/2006 19:37:22

    Je sais pas...

  • signaler à un administrateur
    Commentaire de speedylol le 19/11/2006 20:31:14

    plus rapide sans clignotement, GRONOK tu place sa a la fin dans le submit du formailre je suppose.

    merci  

  • signaler à un administrateur
    Commentaire de speedylol le 19/11/2006 20:38:46

    tu note quoi stp???

  • signaler à un administrateur
    Commentaire de GRAZNOK le 19/11/2006 21:17:25

    <form action="javascript:void(0)" onsubmit="javascript:alert(this.fichier.value)">
    <input name="fichier" type="text" value="truc.php"></input>
    <input type="submit"></input>
    </form>

    Dans le onSubmit tu mets ce que tu veux (après "javascript:")

  • signaler à un administrateur
    Commentaire de speedylol le 20/11/2006 09:00:04

    Merci de ta réponse
    ce que je veux comment cela ?? car je suis pas très  spécialiste du javascript ??? d'aillieur je devrais m'interesser plus a cela ???

  • signaler à un administrateur
    Commentaire de toutphp le 20/11/2006 09:18:18

    Voilà un exemple d'utilisation :

    <code>
    --------- Mon fichier index.php -------------

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <head>
    <title>cyril-test</title>

    <script type="text/javascript">
    function envoieRequete(url,id)
    {
         var xhr_object = null;
         var position = id;
          if(window.XMLHttpRequest) xhr_object = new XMLHttpRequest();
          else
          if (window.ActiveXObject) xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
      
         // On ouvre la requete vers la page désirée
         xhr_object.open("GET", url, true);
         xhr_object.onreadystatechange = function(){
         if ( xhr_object.readyState == 4 )
         {
             // j'affiche dans la DIV spécifiées le contenu retourné par le fichier
             document.getElementById(position).innerHTML = xhr_object.responseText;
         }
         }
         // dans le cas du get
         xhr_object.send(null);
      
    }
    </script>
    </head>

    <body>
      <div id="cibleDeLaFonction">&nbsp;</div>
      <input type="button" onclick = "javascript: envoieRequete('generation.php', 'cibleDeLaFonction')" />
    </body>
    </html>

    ------------- Fin fichier index.php -----------
    </code>
    <code>
    ------------- Début fichier generation.php -----------

    echo 'Réussite de la génération du fichier generation.php';

    ------------- Fin fichier generation.php -----------
    </code>

    En fait tout ce qui sera généré dans le fichier generation.php sera mis à la place du contenu du div 'cibleDeLaFonction'

  • signaler à un administrateur
    Commentaire de coucou747 le 20/11/2006 09:32:15

    je persiste, c'est pas dynamique... c'est statique, même si ça fait joli...

  • signaler à un administrateur
    Commentaire de kankrelune le 20/11/2006 12:21:50

    Quel est l'interet de ton commentaire coucou... .. ?

    Pour le reste si la génération en tache de fond de la réponse est dynamique on peut considérer que le contenu est dynamique... tout dépend de quel dynamise tu parle... celui de la réponse ou celui de la page visualisée... .. .

    Pour le reste c'est un détail dont on se fout un peu... non... ton commentaire n'a pas vraiment lieu d'être... .. .

    @ tchaOo°

  • signaler à un administrateur
    Commentaire de coucou747 le 20/11/2006 12:56:02

    c'était un débat qu'on avait eu plus haut : "Permet d'enlever le lien et de rendre la page plus dynamique ..."

  • signaler à un administrateur
    Commentaire de kankrelune le 20/11/2006 13:36:52

    Oui je sais... mais quel interet de revenir dessus... .. .

    Mais bon puisque c'est fait (;o))... je pense que tout dépend de la définition du mot dynamique... dynamique ne veux pas forcement dire généré dynamiquement... ainsi on peut dire que javascript par le biais de la gestion des evenement peux rendre plus dynamique une page bien que cette dernière soit statique... .. . ;o)

    @ tchaOo°

  • signaler à un administrateur
    Commentaire de GRAZNOK le 20/11/2006 13:39:05