[AJAX] Affichage de requête PHP dans un div créé par Ajax

**will89** · 12/12/2007, 14h04

Bonjour à tous.
Je débute cette année dans la programmation en Ajax et je dois dire que je trouve ça vachement intéressant. Seulement j'ai quelques soucis à l'affichage de ma page comme en atteste le lien ci-après : http://mouchel.philippe.free.fr/viatelo/index.php Alors si qqn pouvait m'aider me dire si quelque chose ne va pas dans mon code, parce que je sais plus trop comment prendre le problème sans repartir à zéro d'un autre script que je suis même pas sur qu'il me convienne.

Le bug d'affichage n'est visible qu'au rafraichissement de la page, une fois que l'on commence à déplacer les blocs, ils apparaissent entièrement. Et pour l'erreur MySQL ne vous en préoccupez pas je sais d'où elle vient, je m'en occuperait plus tard.

Merci d'avance.

PS : si ça peut accélérer les choses l'interface que j'utilise est disponible ici : http://blog.xilinus.com/2007/8/26/pr...e-portal-class

**jeje13009** · 12/12/2007, 21h37

slt,

c'est de la taille des div dont tu parles ?? il faudrait que tu envoies le code source pour qu'on puisse t'aider...

**will89** · 13/12/2007, 15h03

Desolé pour les sources mais normalement, on peut y accéder simplement en les affichant (Ctrl+U), mais puisque vous me le demandez, les voici :

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
<?php
//ouverture de la session
session_start();
$_SESSION['ut'] = 1;
 
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
header("Last-Modified:".gmdate("D, d M Y H:i:s")." GMT");
header("Cache-Control: no-cache, must-revalidate");
header("Pragma: no-cache");
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Viatelo Drag&Drop</title>
<script type="text/javascript" src="lib/prototype.js"></script> 
<script type="text/javascript" src="lib/effects.js"></script> 
<script type="text/javascript" src="lib/builder.js"></script> 
<script type="text/javascript" src="lib/dragdrop.js"></script> 
<script type="text/javascript" src="src/portal.js"></script>
<link rel="stylesheet" href="stylesheet/page.css" type="text/css" media="screen" charset="utf-8" />
<link rel="stylesheet" href="themes/default.css" type="text/css" media="screen" charset="utf-8" />
</head>
<body>
<h1>Viatelo Drag&Drop</h1>
<div id="page">
    <div id="widget_col_0"></div>
    <div id="widget_col_1"></div>
    <div id="widget_col_2"></div>
    <div id="widget_col_3"></div>
</div>    
<div id="control_buttons" style="display:none">
<a href="#" id="edit_button"></a>
<a href="#" onclick="removeWidget(this); return false;" id="delete_button"></a>
</div>
 
<script type="text/javascript">
var portal;
 
function onOverWidget(portal, widget) {
	widget.getElement().insertBefore($('control_buttons'), widget.getElement().firstChild);
	$('control_buttons').show(); 
} 
 
function onOutWidget(portal, widget) {
	$('control_buttons').hide();      
} 
 
function removeWidget(element) {
	var widget = $(element).up(".widget").widget;
 
	if (confirm('Are sure to remove this widget?')) { 
		document.body.appendChild($('control_buttons').hide())
		portal.remove(widget);
	}
}                                
 
function onChange() {
 
}
 
function init() {             
	portal = new Xilinus.Portal("#page div", {onOverWidget: onOverWidget, onOutWidget: onOutWidget, onChange: onChange, removeEffect: Effect.SwitchOff}); 
	// Fake widgets
	portal.add(new Xilinus.Widget().setTitle("Actualit&eacute;s :").setContent("<div id='widget00'></div>"), 0);
 
	portal.add(new Xilinus.Widget().setTitle("Galerie photo :").setContent("jytsegruy uyiergfou aygrf_g ruyze gro zgr_ goa_eygf oazgizgfergfysegrfu ysergv yrgf uygertfseryugf uergfyus egrvtsergfujkeyrtgs ergfuyerg gerygf uyergukf gruytgse yurgt"), 1);
	portal.add(new Xilinus.Widget().setTitle("Top 5 &Eacute;v&egrave;nements :").setContent("<div id='widget02'></div>"), 1);      
 
	portal.add(new Xilinus.Widget().setTitle("Derniers organismes inscrits :").setContent("<div id='widget03'></div>"), 2);
	portal.add(new Xilinus.Widget().setTitle("Derniers commentaires :").setContent("<div id='widget04'></div>"), 2);
	portal.add(new Xilinus.Widget().setTitle("&Agrave; faire aujourd'hui :").setContent("<div id='widget05'></div>"), 2);
 
	portal.add(new Xilinus.Widget().setTitle("Votre organisme :").setContent("<div id='widget06'></div>"), 3);
	portal.add(new Xilinus.Widget().setTitle("Vous &ecirc;tes inscrit :").setContent("<div id='widget07'></div>"), 3);
	// Add controls buttons
	portal.addWidgetControls("control_buttons");
}
 
Event.observe(window, "load", init);
 
function aff_requete(url,div_aff) {
	var div = div_aff;
	var myAjax = new Ajax.Updater(div,url,{method: 'get',parameters: ''});
}
 
<!--aff_requete('gallery_js.php', 'widget01'); -->
aff_requete('request.php?request=top_even', 'widget02');
aff_requete('request.php?request=last_ec', 'widget03');
aff_requete('request.php?request=last_comm', 'widget04');
aff_requete('request.php?request=a_faire', 'widget05');
aff_requete('request.php?request=ut_inscrit', 'widget07');
</script>
</body>
</html>

**jeje13009** · 13/12/2007, 19h00

Slt,

en fait les div content_widget_2 à 7 ont un height fixé à 10px et leur class widget_content un overflow:hidden (masque ce qui dépasse du cadre) ; il faut que tu supprimes le height:10px pour régler le problème...

le mieux serait de revoir l'ensemble du css...

[AJAX] Affichage de requête PHP dans un div créé par Ajax

JavaScript

Discussions similaires

Partager

Partager