[C#] Rendu du TreeView avec IE

**grincheux** · 26/02/2004, 11h42

Bonjour,
je veux utiliser les treeview dans une page et probleme....
En effet, le treeview ne s affiche pas bien sous Internet Explorer. Par contre, il s affiche tres bien sous Mozilla.

QUelqu'un a t-il une solution?

Merci d'avance

**Keihilin** · 26/02/2004, 11h45

Envoyé par grincheux

En effet, le treeview ne s affiche pas bien sous Internet Explorer.

Qu'est-ce que ça veut dire "pas bien" ??

**grincheux** · 26/02/2004, 11h51

ca veut dire que sous IE, j ai un truc dans le genre:

root Node6 Node8 Node9 Node7

et sous Moezilla, j ai une vrai arborescence
root
...Node
......Node
...Node

**Keihilin** · 26/02/2004, 11h57

Qu'est-ce que tu utilises comme TreeView ?

On peut voir un exemple de ton code ?

**grincheux** · 26/02/2004, 12h10

J'utilise le composant treewiew de Microsoft.Web.UI.WebControls que j'ai telecharger sur msdn.

Le code se limite à une ligne declarative

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

protected Microsoft.Web.UI.WebControls.TreeView TreeView1;

**Keihilin** · 26/02/2004, 12h13

Ok...

Mais moi je vois plutôt bien un petit problème de css...

Est-ce qu'on peut voir le code complet de ta page ?

**grincheux** · 26/02/2004, 12h22

Pas de probleme. Mais j'utilise pas de css encore. J'en suis au niveau experimentation.

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
<%@ Register TagPrefix="iewc" Namespace="Microsoft.Web.UI.WebControls" Assembly="Microsoft.Web.UI.WebControls" %>
<%@ Page language="c#" Codebehind="g_essai_treeview.aspx.cs" AutoEventWireup="false" Inherits="philae.g_essai_treeview" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
	<HEAD>
		<title>g_essai_treeview</title>
		<meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
		<meta name="CODE_LANGUAGE" Content="C#">
		<meta name="vs_defaultClientScript" content="JavaScript">
		<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie3-2nav3-0">
	</HEAD>
	<body MS_POSITIONING="GridLayout">
		<TABLE height="182" cellSpacing="0" cellPadding="0" width="178" border="0" ms_2d_layout="TRUE">
			<TR vAlign="top">
				<TD width="178" height="182">
					<form id="Form1" method="post" runat="server">
						<TABLE height="161" cellSpacing="0" cellPadding="0" width="170" border="0" ms_2d_layout="TRUE">
							<TR vAlign="top">
								<TD width="24" height="16"></TD>
								<TD width="146"></TD>
							</TR>
							<TR vAlign="top">
								<TD height="145"></TD>
								<TD>
									<iewc:TreeView id="TreeView1" runat="server" Width="144px" Height="144px" SystemImagesPath="treeimages/">
										<iewc:TreeNode Text="root">
											<iewc:TreeNode CheckBox="True" Text="Node6">
												<iewc:TreeNode CheckBox="True" Text="Node8"></iewc:TreeNode>
												<iewc:TreeNode CheckBox="True" Text="Node9"></iewc:TreeNode>
											</iewc:TreeNode>
										</iewc:TreeNode>
										<iewc:TreeNode Text="Node7"></iewc:TreeNode>
									</iewc:TreeView></TD>
							</TR>
							&nbsp;
						</TABLE>
					</form>
				</TD>
			</TR>
		</TABLE>
	</body>
</HTML>

Le codebehind est:

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
 
using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
 
namespace philae
{
	/// <summary>
	/// Description résumée de g_essai_treeview.
	/// </summary>
	public class g_essai_treeview : System.Web.UI.Page
	{
		protected Microsoft.Web.UI.WebControls.TreeView TreeView1;
		#region Attributs
		#endregion
 
		private void Page_Load(object sender, System.EventArgs e)
		{
			// Placer ici le code utilisateur pour initialiser la page
		}
 
 
		#region Code généré par le Concepteur Web Form
		override protected void OnInit(EventArgs e)
		{
			//
			// CODEGEN : Cet appel est requis par le Concepteur Web Form ASP.NET.
			//
			InitializeComponent();
			base.OnInit(e);
		}
 
		/// <summary>
		/// Méthode requise pour la prise en charge du concepteur - ne modifiez pas
		/// le contenu de cette méthode avec l'éditeur de code.
		/// </summary>
		private void InitializeComponent()
		{    
			this.Load += new System.EventHandler(this.Page_Load);
 
		}
		#endregion
 
	}
}

**Maniak** · 26/02/2004, 12h25

Et le code HTML qui est envoyé au navigateur ?
C'est amusant que ça marche sous Moz et pas sous IE, d'habitude c'est l'inverse qui se passe avec le code bancal généré :)

**Keihilin** · 26/02/2004, 12h29

Oui c'est vrai que c'est amusant...

Il y a juste un truc qu'on ne sait pas : la version de IE ??

Effectivement, il faudrait voir le code HTML renvoyé...

**grincheux** · 26/02/2004, 12h37

J'utilise la version 6 d'internet explorer.

Le code que je recois du sertveur est :

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
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<html>
	<head>
		<title>g_essai_treeview</title>
		<meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
		<meta name="CODE_LANGUAGE" Content="C#">
		<meta name="vs_defaultClientScript" content="JavaScript">
		<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie3-2nav3-0">
	</head>
 
	<body MS_POSITIONING="GridLayout">
		<table height="182" cellSpacing="0" cellPadding="0" width="178" border="0" ms_2d_layout="TRUE">
			<tr vAlign="top">
				<td width="178" height="182">
					<form name="Form1" method="post" action="g_essai_treeview.aspx" id="Form1">
<input type="hidden" name="__VIEWSTATE" value="dDwtODU5NjgwNzQyO3Q8O2w8aTwxPjs+O2w8dDw7bDxpPDE+Oz47bDx0PEAwPHA8cDxsPFNlbGVjdGVkTm9kZUluZGV4Oz47bDwwOz4+Oz47Ozs7O0AwPDtAMDxsPGk8MD47PjtsPEAwPEAwPHA8bDxTZWxlY3RlZDtFeHBhbmRlZDs+O2w8bzx0PjtvPHQ+Oz4+Ozs7Oz47Oz47Pjs+Oz47Pjs7Pjs+Pjs+Pjs+w0j34rgdOksq0zBSXBhZPxeD1f0=" />
 
						<table height="161" cellSpacing="0" cellPadding="0" width="170" border="0" ms_2d_layout="TRUE">
							<tr vAlign="top">
								<td width="24" height="16"></td>
 
								<td width="146"></td>
							</tr>
							<tr vAlign="top">
								<td height="145"></td>
								<td>
									<div id="TreeView1" style="height:144px;width:144px;height:144px;width:144px;">
<table CELLSPACING="0" CELLPADDING="0" BORDER="0">
	<tr><td valign='middle'>&nbsp;<a href="javascript:__doPostBack('TreeView1','oncollapse,0')"><img align='top' border='0' class='icon' SRC='treeimages/Fminus.gif'></a><font COLOR="#00FFFF" SIZE="2" style="display:inline;font-size:10pt;font-face:Times;text-decoration:none;cursor:hand;overflow:hidden;color:#00FFFF;background-color:#08246B;">&nbsp;root</font></td></tr>
<tr><td valign='middle'>&nbsp;<img align='top' border='0' SRC='treeimages/I.gif'><a href="javascript:__doPostBack('TreeView1','onexpand,0.0')"><img align='top' border='0' class='icon' SRC='treeimages/Lplus.gif'></a><input style='display:inline' align=middle type=checkbox  onclick="__doPostBack('TreeView1','oncheck,0.0')" /><a href="javascript:__doPostBack('TreeView1','onselectedindexchange,0,0.0')"><font COLOR="#000000" SIZE="2" style="display:inline;font-size:10pt;font-face:Times;color:black;text-decoration:none;cursor:hand;overflow:hidden;">&nbsp;Node6</font></a></td></tr>
 
<tr><td valign='middle'>&nbsp;<img align='top' border='0' class='icon' SRC='treeimages/L.gif'><a href="javascript:__doPostBack('TreeView1','onselectedindexchange,0,1')"><font COLOR="#000000" SIZE="2" style="display:inline;font-size:10pt;font-face:Times;color:black;text-decoration:none;cursor:hand;overflow:hidden;">&nbsp;Node7</font></a></td></tr>
 
</table>
</div></td>
							</tr>
							&nbsp;
						</table>
 
<input type="hidden" name="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" value="" />
<script language="javascript">
<!--
	function __doPostBack(eventTarget, eventArgument) {
		var theform;
		if (window.navigator.appName.toLowerCase().indexOf("netscape") > -1) {
			theform = document.forms["Form1"];
		}
		else {
			theform = document.Form1;
		}
		theform.__EVENTTARGET.value = eventTarget.split("$").join(":");
		theform.__EVENTARGUMENT.value = eventArgument;
		theform.submit();
	}
// -->
</script>
</form>
 
				</td>
			</tr>
		</table>
	</body>
</html>

**grincheux** · 26/02/2004, 12h42

Rectification. Le code en,vye ci-dessus est le code recu sous mozilla.

Le code sous IE est le suivant:

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
 
ï»¿<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<!-- saved from url=(0040)http://philae:9999/g_essai_treeview.aspx -->
<HTML XMLNS:TVNS><HEAD><TITLE>g_essai_treeview</TITLE>
<META http-equiv=Content-Type content="text/html; charset=utf-8">
<META content="MSHTML 6.00.2800.1400" name=GENERATOR>
<META content=C# name=CODE_LANGUAGE>
<META content=JavaScript name=vs_defaultClientScript>
<META content=http://schemas.microsoft.com/intellisense/ie3-2nav3-0 
name=vs_targetSchema></HEAD>
<BODY MS_POSITIONING="GridLayout">
<TABLE height=182 cellSpacing=0 cellPadding=0 width=178 border=0 
ms_2d_layout="TRUE">
  <TBODY>
  <TR vAlign=top>
    <TD width=178 height=182>
      <FORM id=Form1 name=Form1 action=g_essai_treeview.aspx method=post><INPUT 
      type=hidden name=__TreeView1_State__> <INPUT type=hidden 
      value=dDwtODU5NjgwNzQyO3Q8O2w8aTwxPjs+O2w8dDw7bDxpPDE+Oz47bDx0PEAwPHA8cDxsPFNlbGVjdGVkTm9kZUluZGV4Oz47bDwwOz4+Oz47Ozs7O0AwPDtAMDxsPGk8MD47PjtsPEAwPEAwPHA8bDxTZWxlY3RlZDs+O2w8bzx0Pjs+Pjs7Ozs+Ozs+Oz47Pjs+Oz47Oz47Pj47Pj47bDxUcmVlVmlldzE7Pj7dIEctz2hpObujEvNhHDTOZ3J+/w== 
      name=__VIEWSTATE> 
      <TABLE height=161 cellSpacing=0 cellPadding=0 width=170 border=0 
      ms_2d_layout="TRUE">
        <TBODY>
        <TR vAlign=top>
          <TD width=24 height=16></TD>
          <TD width=146></TD></TR>
        <TR vAlign=top>
          <TD height=145></TD>
          <TD><tvns:treeview id=TreeView1 style="WIDTH: 144px; HEIGHT: 144px" 
            onselectedindexchange="javascript: if (event.oldTreeNodeIndex != event.newTreeNodeIndex) this.queueEvent('onselectedindexchange', event.oldTreeNodeIndex + ',' + event.newTreeNodeIndex)" 
            oncheck="javascript: if (this.clickedNodeIndex != null) this.queueEvent('oncheck', this.clickedNodeIndex)" 
            oncollapse="javascript: if (this.clickedNodeIndex != null) this.queueEvent('oncollapse', this.clickedNodeIndex)" 
            onexpand="javascript: if (this.clickedNodeIndex != null) this.queueEvent('onexpand', this.clickedNodeIndex)" 
            systemImagesPath="treeimages/" HelperID="__TreeView1_State__" 
            selectedNodeIndex="0"><tvns:treenode 
            Selected="true">root<tvns:treenode CheckBox="True"> 
            Node6<tvns:treenode CheckBox="True"> Node8 
            </tvns:treenode><tvns:treenode CheckBox="True">Node9 
            </tvns:treenode></tvns:treenode></tvns:treenode><tvns:treenode>Node7 
            </tvns:treenode></tvns:treeview></TD></TR>&nbsp; 
  </TBODY></TABLE></FORM></TD></TR></TBODY></TABLE></BODY></HTML>

Le probleme serait donc du cote du serveur.

**Keihilin** · 26/02/2004, 12h43

Cut & Paste du code HTML...

Résultat : ça marche très bien chez moi...

**Keihilin** · 26/02/2004, 12h47

Envoyé par Keihilin

Cut & Paste du code HTML...

Résultat : ça marche très bien chez moi...

Je parlais du code reçu par Mozilla...

En effet, le code reçu par IE ne fonctionne pas...

C'est vraiment très étrange...

Je ne connais pas ce treeview, mais il n'a pas vraiment une bonne réputation. Je ne peux que te conseiller d'en chercher un autre ou d'en développer un...
D'expérience, c'est pas très dur.

**Maniak** · 26/02/2004, 13h06

Envoyé par grincheux

Le probleme serait donc du cote du serveur.

Non, le problème est du contrôle de treeview qui pond du code différent selon si le navigateur est IE ou autre chose. C'est un mode de fonctionnement foireux qui rend les tests des pages abominables (c'est déjà pas évident de s'assurer que le code d'une page se comporte correctement, si en plus il faut tenir compte du fait que ce code ne sera pas forcément le même sur une autre machine et qu'il peut se comporter totalement différemment...)

Je rejoins plutôt l'avis de Keihilin : essaye de faire ton propre contrôle, ou trouves-en un qui pond du code HTML indépendant des navigateurs (s'il y en a).

Il doit y avoir un moyen de faire marcher celui-là, mais je te conseille vraiment de chercher une alternative moins bordélique niveau HTML.

**grincheux** · 26/02/2004, 13h42

Merci.
Je vais essayer de trouver autre chose ou de redévelopper des classes

**bendj** · 15/06/2005, 19h29

Bonjour,

J'ai le même problème que grincheux. Je développe sous WebMatrix, et quand je testais en local, sur mon poste, la page s'affichait très bien sous IE et FireFox.

J'ai mis pour la première fois ma page sur un serveur IIS, et là, mon TreeView ne fonctionne plus !!

Dans webconfig, j'ai mis :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
<browserCaps>
        TagWriter=System.Web.UI.HtmlTextWriter
        </browserCaps>

pour être sûr que le code généré soit le même.

[C#] Rendu du TreeView avec IE

ASP.NET

Vue hybride

Discussions similaires

Partager

Partager