Rechercher : dans
Par :

[Javascript] Problème rechargement iframe

Dernière réponse le 14 déc 2007 à 11:20:44 Kitty-cat, le 13 déc 2007 à 14:09:13 
 Signaler ce message aux modérateurs

Bonjour bonjour.

Je travaille actuellement sur une GED en PHP avec l'un de mes collègues qui lui aussi est programmeur junior. (Je dirais même plus qu'on est encore étudiants, 'fin bref). Dans un souci d'optimisation, nous souhaitons minimiser le plus possible les rechargements de page. (Avouez qu'il n'est pas très sérieux de recharger la page à chaque fois que l'on clique sur un dossier de l'arborescence.)

Pour ceci, nous avons décidé d'utiliser deux iframes. Celle de gauche qui affiche le treeview, celle de droite qui est sensé afficher les fichiers contenus dans les dossiers. La méthode utilisée pour cela est d'envoyer dans l'url de la frame une variable "Path", qui sera récupérée dans l'autre frame, via un $_GET['Path'].

Nous avons décidé de coder cet envoie en javascript de la façon suivante :

echo indentation($niveau) . "<img src=\"directory.png\" onclick=\"plidepli('".str_replace($replace,"",$str)."')\"> <input type='button' class= 'repertoire' value= '". $str2 ."' <script language = 'javascript'> onclick= parent.frames['\"/contenu.php?path=.'". $tableau ."'\"'].location.reload(); </script><br />\n";

Le problème est qu'évidemment, cela ne fonctionne pas. Nous voudrions donc savoir où se situe l'erreur que nous avons commise, et si possible, que l'on nous explique comment réparer cette erreur.

D'avance je remercie tous ceux qui nous répondront.

Cordialement,

Kitty-cat

Configuration: Windows XP
Firefox 2.0.0.11

1

kij_82, le 13 déc 2007 à 14:21:11

Bonjour,

"indentation($niveau)", ca correspond à quoi ca ?
Sinon, sans prendre en compte ceci, voilà la syntaxe exacte (qui devrait fonctionner) :

echo "<img src=\"directory.png\" onclick=\"plidepli('".str_replace($replace,"",$str)."')\">  <input type='button' class= 'repertoire' value= '". $str2 ."'  onclick= \"parent.frames['\"/contenu.php?path=.'". $tableau ."'\"'].location.reload()\" ><BR>"; 


Après je ne dis pas que ce que vous souhaitez faire fonctionne, je n'ai pas très bien compris comment fonctionne votre système ^^

~ N'oubliez pas la balise "Résolu" lorsque votre problème est... résolu :) ~

Répondre à kij_82

2

Kitty-cat, le 13 déc 2007 à 14:28:32

Le indentation($niveau) sert en fait à "afficher" les blancs derrière le nom du dossier. Comme ça si c'est un sous-dossier, il se retrouve décalé grâce à cela. Sinon, j'ai testé ce que tu m'as proposé, et encore une fois, aucun résultat. Si ce n'est que j'ai un point-virgule qui se balade derrière le nom de mon dossier XD.

Mais peuit-être est-ce notre récupération de la variable qui n'est pas bonne. Je mets donc le code de celle-ci :

$path = isset($_GET['path']) ? $_GET['path'] : '';
if ($path != '')
{
listeFichier($Path);
}
else
{
echo "Rien à afficher";
}

Et evidemment, ca ne m'affiche à chaque fois que "Rien à afficher"

Répondre à Kitty-cat

3

kij_82, le 13 déc 2007 à 14:32:36

Autant pour moi le ';' vient de là (en gras):

echo "<img src=\"directory.png\" onclick=\"plidepli('".str_replace($replace,"",$str)."')\">  <input type='button' class= 'repertoire' value= '". $str2 ."'  onclick= \"parent.frames['/contenu.php?path=". $tableau ."'].location.reload()\" ><BR>"; 


Effectivement il y a un ';' qui traine au millieu et qui n'a rien à faire là. Sinon j'ai aussi supprimé des " en trop. Remplace pour voir.

~ N'oubliez pas la balise "Résolu" lorsque votre problème est... résolu :) ~

Répondre à kij_82

4

Kitty-cat, le 13 déc 2007 à 14:48:23

Effectivement, en jartant la virgule, ca le fait déjà plus. Malheureusement, dans l'autre iframe, c'est comme à l'ouest : Rien de nouveau. Et je pige pas pourquoi.

Someone has an idea?

Répondre à Kitty-cat

5

kij_82, le 13 déc 2007 à 14:56:42

Tu update le contenu comment dans l'autre Iframe ? En javascript ? Si oui peut tu me mettre le code (parce que je ne pense pas que ce que tu m'as donné là le face, si ?)

~ N'oubliez pas la balise "Résolu" lorsque votre problème est... résolu :) ~

Répondre à kij_82

6

Kitty-cat, le 13 déc 2007 à 14:59:24

<?php

function listeFichier($chemin)
{
$replace = array(":","/","\\"," ",".","(",")","_");

$tableau = glob($chemin . '/*.*');

echo "<table align ='center'>";

foreach($tableau as $str)
{
if (is_file($str))
{
$tab = explode('/',$str);
$nomFichier = '';

foreach ($tab as $tabs)
{
$nomFichier = $tabs;
}

$extension = explode('.',$str);

$extension = $extension[count($extension)-1];

$extension = strtoupper($extension);

echo "<td><tr>".$nomFichier."</tr><tr>".$extension."</tr></td>";
}
}

if(count($tableau) == 0)
{

echo "<td><tr align ='center'>Ce repertoire est vide</tr></td>";

}
}

echo "</table>";

?>

<?php

$path = isset($_GET['path']) ? $_GET['path'] : '';


if ($path != '')

{

listeFichier($Path);

}

else

{

echo "Rien à afficher";

}

?>

//code de la page servant à afficher les résultats grâce à la variable que lui balance le javascript dont nous parlions précédemment. ^^

Répondre à Kitty-cat

7

kij_82, le 13 déc 2007 à 15:08:21

Ok je vois,
Dans ton appel javascript remplace par ca :

onclick= \"parent.frames['nom_de_iframe'].location.href('contenu.php?path=". $tableau ."')\"


Ca devrait recharger la page dans l'iframe avec la variable path correctement passée.

~ N'oubliez pas la balise "Résolu" lorsque votre problème est... résolu :) ~

Répondre à kij_82

8

Kitty-cat, le 13 déc 2007 à 15:12:44

Et bah....non. Mon i-frame "Contenu" continue désespérément d'afficher : "Rien à afficher". J'te file aussi le code de l'arborescence, ou bien?

Répondre à Kitty-cat

9

kij_82, le 13 déc 2007 à 15:16:21

Une petite question, comment est nommé ton iframe dans ton code ?

C'est juste pour savoir si 'nom_de_iframe' est correctement remplacé ou non, car peut etre que rien ne s'affiche parce que la frame que tu tente de raffraichir n'est pas trouvée.

~ N'oubliez pas la balise "Résolu" lorsque votre problème est... résolu :) ~

Répondre à kij_82

10

Kitty-cat, le 13 déc 2007 à 15:18:37

<div class="Contenu">
<iframe src="Contenu.php" name="Contenu" height="800" width=700>
</iframe>
</div>

Vala pour mon i-frame ^^

Répondre à Kitty-cat

11

kij_82, le 13 déc 2007 à 15:26:09

Dans ce cas déclare la comme ceci :

<iframe src="Contenu.php" id="Contenu" name="Contenu" height="800" width=700> 


Et modifie la fonction javascript sur le onclick comme ceci :
onclick= \"document.getElementById('Contenu').location.href('contenu.php?path=". $tableau ."')\"


Je n'ai jamais manipulé d'Iframe donc je ne sais pas trop si c'est reconu comme une véritable frame, ou un simple composant d'une page... dis moi ce qui se passe suite à cette modif.

~ N'oubliez pas la balise "Résolu" lorsque votre problème est... résolu :) ~

Répondre à kij_82

12

Kitty-cat, le 13 déc 2007 à 15:32:04

Il se passe rien malheureusement.

Je veux bien utiliser autre chose qu'une iframe hein...mais dans ces cas là, ca me rechargetoute la page, et pas juste l'iframe. Et si ca peut te rassurer c'est aussi la premiere fois que je manipule une iframe ^^'

Répondre à Kitty-cat

13

kij_82, le 13 déc 2007 à 15:35:57

Pas si tu sais faire de l'ajjax justement, et là dessus je peux t'aider efficacement par contre :)

~ N'oubliez pas la balise "Résolu" lorsque votre problème est... résolu :) ~

Répondre à kij_82

14

Kitty-cat, le 13 déc 2007 à 15:38:43

Ah. Jamais fait d'ajax. Mais si tu m'en disais plus à la limite, j'peux toujours voir si c'est tentable.

Répondre à Kitty-cat

15

kij_82, le 13 déc 2007 à 15:53:08

On va essayer de faire autrement.

Pour ce qui est de la déclaration de la partie ou tu aura le contenu, déclare simplement une DIV (que tu place comme tu veux grace au style css) comme suit :

<div id="contenu" .... > TON CODE PHP CHARGE DE MONTRER LE CONTENU </div>


Ensuite voici une fonction javascript à inclure ou tu veux dans ton fichier
<script language="javascript">
function callScript ( scriptName, args ){
	
	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; 
	} 
	 
	xhr_object.open("POST", scriptName, true);
	     
	xhr_object.onreadystatechange = function() { 
	   if(xhr_object.readyState == 4) {
			//alert(xhr_object.responseText); // DEBUG MODE
			//document.write(xhr_object.responseText);
			eval(xhr_object.responseText);
		 }
		
		//alert(xhr_object.readyState);
		return xhr_object.readyState;
	} 
	 
	xhr_object.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
	
	xhr_object.send(args);

}
</script>


Cette fonction permet d'appeller un script PHP, de l'éxécuter, de récupérer le contenu de sa sortie (ce qui est afficher par le script PHP en gros) et de l'interpréter comme du javascript.
C'est sympa et ca va te permettre de créé un autre fichier PHP qui lui fera exactement la même chose que l'affichage du contenu, mais écrit de manière à ce que ce soit interprétable en javascript.

Mettons que l'on nomme ce fichier 'traitement.php', voici son contenu :

<?php

function listeFichier($chemin){
	$replace = array(":","/","\\"," ",".","(",")","_");
	$tableau = glob($chemin . '/*.*');

	$display = "";
  $display += "<table align ='center'>";

  foreach($tableau as $str){
    if (is_file($str)){
       $tab = explode('/',$str);
       $nomFichier = '';

       foreach ($tab as $tabs){
          $nomFichier = $tabs;
       }

       $extension = explode('.',$str);
       $extension = $extension[count($extension)-1];
       $extension = strtoupper($extension);

       $display += "<td><tr>".$nomFichier."</tr><tr>".$extension. "</tr></td>";
    }
	}

	if(count($tableau) == 0)
		$display += "<td><tr align ='center'>Ce repertoire est vide</tr></td>";
		
	
	$display += "</table>";

	// --- Finally return the string to display
	return $display;
}



$path = isset($_GET['path']) ? $_GET['path'] : '';

$toDisplay = "";
if ($path != ''){
	$toDisplay = listeFichier($Path);
}
else{
  $toDisplay = "Rien à afficher";
}

// --- Update the content of DIV 'contenu'
echo "var div = document.getElementById('contenu');";
echo "div.innerHTML = ".$toDisplay.";";

?> 


De cette manière, tu n'aura plus qu'à appeller la fonction javascript suivante sur le onclick (menu gauche) :
  onclick= \"callScript('traitement.php','path='".$tableau."')\"


Logiquement ca devrait fonctionner, il y a peut etre des erreurs de frappe par ci par là ^^

~ N'oubliez pas la balise "Résolu" lorsque votre problème est... résolu :) ~

Répondre à kij_82

16

Kitty-cat, le 13 déc 2007 à 16:13:52

Pas d"erreur critiques selon firefox. Pour autant, il ne m'affiche pas encore quelque chose. Je vois pas trop d'où le problème pourrait venir par contre. Le php m'a l'air au point, et je pense que si ca venait de la partie en ajax, firefox aurait crisé.

Cela viendrait-il de ma page qui contient les div et qui s'appelle "Main.php" ?

PS : Je précise que le "Rien à afficher" ne s'affiche pas non plus ^^'

Répondre à Kitty-cat

17

kij_82, le 13 déc 2007 à 16:36:59

Dans ce cas là c'est surement une erreur dans l'ajax. Le mieux pour voir si effectivement il y a erreur, puisque tu as FF, c'est d'aller dans 'Outils->console d'erreur' puis d'exécuter ton truc pour voir s'il n'affiche pas une erreur (si rien ne s'affiche c'est que c'est fort probable).

Tu peux également pour voir l'erreur, activer la popup de trace dans la fonction javascript 'callScript' en décommentant ceci :

//alert(xhr_object.responseText); // DEBUG MODE


Si tu as bien une erreur, peux-tu me donner le message ?

Sinon... peux-tu me donner le code PHP de ta page principale (celle qui contient tout normalement (les div, etc.) )

~ N'oubliez pas la balise "Résolu" lorsque votre problème est... résolu :) ~

Répondre à kij_82

18

Kitty-cat, le 13 déc 2007 à 16:43:05

Erreur : missing ) after argument list
Fichier source : http://localhost/appexplorer/main.php
Ligne : 1, Colonne : 35
Code source :
callScript('traitement.php','path='Array')

<== Message d'erreur.

<html>
<head>

<style type="text/css">
img
{
border: 0px;
}

.TreeView
{
position : Absolute;
margin-top : 0px;
Margin-left : 0px;
}

.Contenu
{
position : absolute;
margin-top : 0px;
margin-left : 351px;
}

</style>



</head>
<body>
<div id="Treeview">
<?php
include("arbo.php");
?>
</div>
<div id="Contenu">

<script language="javascript">
function callScript ( scriptName, args ){

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;
}

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

xhr_object.onreadystatechange = function() {
if(xhr_object.readyState == 4) {
//alert(xhr_object.responseText); // DEBUG MODE
//document.write(xhr_object.responseText);
eval(xhr_object.responseText);
}

//alert(xhr_object.readyState);
return xhr_object.readyState;
}

xhr_object.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

xhr_object.send(args);

}
</script>

</div>
</body>
</html>

<== Code de la page

Merci de me(nous) consacrer autant de temps alors qu'on galère en bon newbies que nous sommes.

Répondre à Kitty-cat

19

Kitty-cat, le 13 déc 2007 à 16:45:19

<style type = "text/css">

.repertoire
{
border : none;
background-color : #FFFFFF;
}

</style>

<script type='text/javascript'>

function plidepli(id)
{
var elem = document.getElementById(id);
if (elem != null)
{
if (elem.style.display == 'none')
{
elem.style.display = 'block';
}
else
{
elem.style.display = 'none';
}
}
}
</script>

<?php

function listeDir($chemin, $niveau)
{
$replace = array(":","/","\\"," ",".","(",")","_");

$tableau = glob($chemin . '/*', GLOB_ONLYDIR);

//variable $tableau sert dans la page contenu.php pour avoir le path dans lequel on liste les fichiers.

if($tableau != null)
{
if($niveau == 0)
echo "\n";
else
echo "<div id='".str_replace($replace,"",$chemin)."'style='display:none'>\n";

foreach($tableau as $str)
{
$tab = explode('/',$str);
$str2 = '';

foreach ($tab as $tabs)
{
$str2 = $tabs;
}
echo indentation($niveau) . "<img src=\"directory.png\" onclick=\"plidepli('".str_replace($replace,"",$str)."')\"> <input type='button' class= 'repertoire' value= '". $str2 ."'onclick= \"callScript('traitement.php','path='".$tableau."')\"><BR>";

listeDir($str, $niveau + 1);
}

echo "</div>\n";
}
}

function indentation($ind)
{
$str = '';

for($i = 0; $i < $ind; $i++)
$str .= "<img src=\"indentation.png\"><img src=\"indentation.png\">";

return $str;
}
?>

<?php
$startpath = dirname(getcwd()) . '/';
$startdir = basename(getcwd());
$folder = isset($_GET['folder']) ? $_GET['folder'] : '';

if ($folder != '')
{
$folder = base64_decode($folder);
}
else
{
$folder = $startpath.$startdir;
}

listeDir($folder, 0);

?>

<== Code de la fonction arbo.php :)

Si j'en suis le message d'erreur, j'ai l'impression qu'il renvoie le type de variable plutôt que son contenu. Mais j'vois pas pourquoi.

Répondre à Kitty-cat