Caractères vides " - " avant affichage d'un form

**psylo66** · 06/10/2010, 02h12

Bonjour,

J'ai un problème particulier que je n'arrive pas à cerner, j'ai un layout avec un formulaire d'authentification, et j'ai une marge sur ce formulaire quand je regarde le code html généré je m'aperçois qu'il y a du texte vide juste avant ma balise <form>, j'ai aussi ce texte vide avant mon <body> et avec firebug mes fichiers css sont inclus dans le body au lieu du head alors qu'ils sont correctements placés dans le layout, voici mes fichiers :

//layout.phtml

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
 
<?php echo $this->doctype(); ?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <?php echo $this->headTitle(); ?>
	<meta name="description" content="description" />
	<meta name="keywords" content="keyword" />
	<meta name="author" content="author" />
	<meta charset="UTF-8" />
	<!--[if IE]>
	<script src="/scripts/html5-ie.js"></script>
	<link href="/css/themes/colorpaper/ie.css" media="screen" rel="stylesheet" type="text/css" />
	<![endif]--> 
	 <?php echo $this->headLink()->appendStylesheet('/css/themes/colorpaper/style.css')
								 ->appendStylesheet('/css/themes/colorpaper/reset-min.css');?>
 
</head>
<body>
<div id="bgRepeatBottom">
			<div id="bgTop">
				<div id="bgBottom">
					<div id="content">
					<header>
						<nav>
							<a href="<?php echo $this->url(array('controller'=>'index'),'default',true) ?>" title="Accueil" >Accueil</a>
							<a href="<?php echo $this->url(array('controller'=>'concept'),'default',true) ?>" title="Concept du site" >Concept du site</a>
							<a href="<?php echo $this->url(array('controller'=>'rss'),'default',true) ?>" title="RSS" >RSS</a>
							<a href="<?php echo $this->url(array('controller'=>'contact'),'default',true) ?>" title="Contact">Contact</a>
						</nav>
					</header>	
						<div id="brdTopContent"></div>
						<div id="page">
							<div id="leftContent">
								<section id="searchengine">
									 <h1><?php echo $this->escape($this->title); ?></h1>
									<?php echo $this->layout()->contenu;?>
								</section>	
								<div id="backgroundBottomLeftContent"></div>
								<section id="news">
 
								</section>
							</div>
							<div id="rightContent">
								<section id="log">
									<h1> Authentification </h1>
									<?php echo $this->action('index','login'); ?>	
								</section>	
								<section id="statistics">
 
								</section>
								<section id="ranking">		
 
								</section>
							</div>
							<div class="spacer"></div>
						</div>
						<footer>
							<nav>
								<a href="<?php echo $this->url(array('controller'=>'index'),'default',true) ?>" title="Accueil" >Accueil</a>
								<a href="<?php echo $this->url(array('controller'=>'concept'),'default',true) ?>" title="Concept du site" >Concept du site</a>
								<a href="<?php echo $this->url(array('controller'=>'rss'),'default',true) ?>" title="RSS" >RSS</a>
								<a href="<?php echo $this->url(array('controller'=>'contact'),'default',true) ?>" title="Contact">Contact</a>
							</nav>
						</footer>
					</div>
				</div>
			</div>
		</div>
</body>
</html>

//bootstrap

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
 
class Bootstrap extends Zend_Application_Bootstrap_Bootstrap
{
 
	protected function _initDoctype()
    {
        $this->bootstrap('view');
        $view = $this->getResource('view');
        $view->doctype('HTML5');
		$view->headTitle('Search Events');
		$view->headTitle()->setSeparator(' - ');
 
    }
 
	protected function _initAutoload()
	{
		$moduleLoader = new Zend_Application_Module_Autoloader(array(
			'namespace' => '',
			'basePath' => APPLICATION_PATH));
 
		return $moduleLoader;
	}
 
}

login/index.phtml

Code :

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

1
2
 
<?php echo $this->login;?>

//login form

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
 
<?php
	class Form_Login extends Zend_Form
	{
		public function __construct($options = null)
		{
			parent::__construct($options);
			$this->setName('login');
 
			$idForm = new Zend_Form_Element_Hidden('form');
			$idForm->removeDecorator('HtmlTag')
				   ->removeDecorator('label')
				   ->setAttrib('id', 'formLog')
				   ->setValue('formLog');
 
			$email = new Zend_Form_Element_Text("emailLog",array('size' => 25));		
			$email ->setLabel('E-mail *')
				   ->setRequired(true)
				   ->addFilter('StringTrim')
				   ->addFilter('StripTags')
				   ->addValidator('NotEmpty', true , array('messages' => array('isEmpty' => 'Vide')))
				   ->addValidator('EmailAddress');
 
 
			$email->addDecorator(new My_Form_Decorator_Html(array('html' => "<div class='spacer'></div>",'placement' => 'append')));
 
			$password = new Zend_Form_Element_Password("passwordLog", array('size' => 25));
			$password ->setLabel('Mot de passe *')
					  ->setRequired(true)
					  ->addFilter('StringTrim')
					  ->addValidator('NotEmpty', true , array('messages' => array('isEmpty' => 'Vide')));
			$password->addDecorator(new My_Form_Decorator_Html(array('html' => "<div class='spacer'></div>",'placement' => 'append')));	
 
 
			$valider = new Zend_Form_Element_Submit('valider');
			$valider->addDecorator(new My_Form_Decorator_Html(array('html' => "<a title='Inscription' href='/users/ajouter' id='inscription-link'>Inscription</a>",'placement' => 'append')));	
			$valider->setAttrib('id', 'boutonValider')
					 ->removeDecorator('DtDdWrapper');	
 
			$this->addElements(array($idForm,$email,$password,$valider));
 
 
 
		}
 
	}

**manuscle** · 06/10/2010, 08h19

Salut,

Est-ce que dans ton css tu as défini des marges à 0 pour ta balise body?

Code :

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

1
2
3
4
5
 
body {
    margin:0;
    padding: 0;
}

**psylo66** · 06/10/2010, 10h52

Oui, dans mon layout j'inclus la feuille de reset.css fourni par yahoo qui met à 0 les margin et la padding de pas mal d'élement par défaut.

Mais c'est pas le css je pense que c'est au niveau du framework je dois avoir quelquechose qui me génère du texte vide mais alors pour savoir d'ou ça vient ?

**manuscle** · 06/10/2010, 11h09

Peux-tu dans ce cas copier coller le code html généré?

**psylo66** · 06/10/2010, 11h45

Ok pas de problème :

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
 
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>Search Events</title>	<meta name="description" content="description" /> 
	<meta name="keywords" content="keywords" /> 
	<meta name="author" content="author" /> 
	<meta charset="UTF-8" /> 
	<!--[if IE]>
	<script src="/scripts/html5-ie.js"></script>
	<link href="/css/themes/colorpaper/ie.css" media="screen" rel="stylesheet" type="text/css" />
	<![endif]--> 
	 <link href="/css/themes/colorpaper/style.css" media="screen" rel="stylesheet" type="text/css" > 
<link href="/css/themes/colorpaper/reset-min.css" media="screen" rel="stylesheet" type="text/css" >	 
</head> 
<body> 
<div id="bgRepeatBottom"> 
			<div id="bgTop"> 
				<div id="bgBottom"> 
					<div id="content"> 
					<header> 
						<nav> 
							<a href="/" title="Accueil" >Accueil</a> 
							<a href="/concept" title="Concept du site" >Concept du site</a> 
							<a href="/rss" title="RSS" >RSS</a> 
							<a href="/contact" title="Contact">Contact</a> 
						</nav> 
					</header>	
						<div id="brdTopContent"></div> 
						<div id="page"> 
							<div id="leftContent"> 
								<section id="searchengine"> 
									 <h1></h1> 
									<h1>Moteur de recherche</h1> 
<ul> 
	<li> <h2> <a href="/criteria" title="Recherche par critères" >Recherche par critères</a> </h2> </li> 
	<li> <h2><a href="/keyword" title="Recherche par mots clés">Recherche par mots clés</a> </h2> </li>	
</ul> 
								</section>	
								<div id="backgroundBottomLeftContent"></div> 
								<section id="news"> 
									<h1> Actualités </h1> 
									<ul> 
										<li> <h2> <a href="/lastEvent" title="Les dernières soirées ajoutées" >Les dernières soirées ajoutées</a> </h2> </li> 
										<li> <h2> <a href="/lastPartner" title="Les derniers partenaires du site" >Les derniers partenaires du site</a> </h2> </li> 
										<li> <h2> <a href="/lastUser" title="Les derniers utilisateurs inscrits" >Les derniers utilisateurs inscrits</a> </h2> </li> 
										<li> <h2> <a href="/lastArtist" title="Les derniers artistes ajoutés" >Les derniers artistes ajoutés</a> </h2> </li> 
										<li> <h2> <a href="/lastPlace" title="Les derniers lieux ajoutés" >Les dernieres lieux ajoutés </a> </h2> </li> 
										<li> <h2> <a href="/lastStyle" title="Les derniers styles de soirées" >Les dernièrs styles de soirées </a> </h2> </li> 
									</ul> 
								</section> 
							</div> 
							<div id="rightContent"> 
								<section id="log"> 
									<h1> Authentification </h1> 
									<form id="login" enctype="application/x-www-form-urlencoded" action="" method="post"><dl class="zend_form"> 
 
<input type="hidden" name="form" value="formLog" id="formLog"> 
<dt id="emailLog-label"><label for="emailLog" class="required">E-mail *</label></dt> 
<dd id="emailLog-element"> 
<input type="text" name="emailLog" id="emailLog" value="" size="25"></dd><div class='spacer'></div> 
<dt id="passwordLog-label"><label for="passwordLog" class="required">Mot de passe *</label></dt> 
<dd id="passwordLog-element"> 
<input type="password" name="passwordLog" id="passwordLog" value="" size="25"></dd><div class='spacer'></div> 
 
<input type="submit" name="valider" id="boutonValider" value="valider"><a title='Inscription' href='/users/ajouter' id='inscription-link'>Inscription</a></dl></form>	
								</section>	
								<section id="statistics"> 
									<h1> Chiffres </h1> 
									<ul> 
										<li> <h2> <a href="/numberEvent" title="Nombres de soirées : #X1# " >Nombres de soirées : #X1# </a> </h2> </li> 
										<li> <h2> <a href="/numberPlace" title="Nombres de lieus: #X2#" >Nombres de lieus : #X2# </a> </h2> </li> 
										<li> <h2> <a href="/numberArtist" title="Nombres d\'artistes : #X3#" >Nombres d'artistes : #X3# </a> </h2> </li> 
										<li> <h2> <a href="/numberUser" title="Nombres d\'utilisateurs : #X4#" >Nombres d'utilisateurs : #X4#</a> </h2> </li> 
										<li> <h2> <a href="/numberPartner" title="Nombres de partenaires : #X5#" >Nombres de partenaires : #X5#</a> </h2> </li> 
										<li> <h2> <a href="/numberStyle" title="Nombres de styles: #X6#" >Nombres de styles: #X6# </a> </h2> </li> 
									</ul> 
								</section> 
								<section id="ranking">		
									<h1> Classements </h1> 
									<ul> 
										<li> <h2> <a href="/topEvent" title="Top 100 des soirées" >Top 100 des soirées </a> </h2> </li> 
										<li> <h2> <a href="/topPlace" title="Top 100 des lieus" > Top 100 des lieus</a> </h2> </li> 
										<li> <h2> <a href="/topArtist" title="Top 100 des artistes" >Top 100 des artistes  </a> </h2> </li> 
										<li> <h2> <a href="/topUser" title="Top 100 des utilisateurs" >Top 100 des utilisateurs </a> </h2> </li> 
										<li> <h2> <a href="/topPartner" title="Top 100 des partenaires" >Top 100 des partenaires </a> </h2> </li> 
										<li> <h2> <a href="/topStyle" title="Top 100 des styles" >Top 100 des styles</a> </h2> </li> 
									</ul> 
								</section> 
							</div> 
							<div class="spacer"></div> 
						</div> 
						<footer> 
							<nav> 
								<a href="/" title="Accueil" >Accueil</a> 
								<a href="/concept" title="Concept du site" >Concept du site</a> 
								<a href="/rss" title="RSS" >RSS</a> 
								<a href="/contact" title="Contact">Contact</a> 
							</nav> 
						</footer> 
					</div> 
				</div> 
			</div> 
		</div> 
</body> 
</html>

En fait quand je regarde le code source il est correct, mais c'est quand j'utilise firebug ou l'outils de développement de chrome que je vois ce texte : " - " et quand je le supprime j'ai plus de problème d'affichage.

**manuscle** · 07/10/2010, 09h22

Je me demande si ce n'est pas un probleme d'encodage...
Tes fichiers sont encodés en UTF-8? ..... Sûre?

Si oui essaie ceci:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
 
protected function _initDoctype()
    {
        $this->bootstrap('view');
        $view = $this->getResource('view');
        $view->setEncoding('UTF-8');
        $view->doctype('HTML5');
		$view->headTitle('Search Events');
		$view->headTitle()->setSeparator(' - ');
		$view->headMeta()
		     ->setHttpEquiv('Content-Type', 'text/html; charset=utf-8')
		     ->setHttpEquiv('Content-Style-Type', 'text/css')
    }

**psylo66** · 07/10/2010, 13h25

Oui je viens passer en revue tout mes fichiers ils sont tous en UTF-8.
J'ai essayé ton code dans le bootstrap mais rien à faire, toujours ce texte juste après le body.
Le truc c'est que même en simplifiant les affichages de la pages il persiste franchement c'est pas évident de trouver l'origine de cette génération.
Si quelqu'un a une autre idée ? je suis preneur.
En tout cas merci pour l'idée ça aurait pu venir de ça...

**manuscle** · 07/10/2010, 14h38

Vraiment ça m'énerve car j'ai souvenir d'avoir eu aussi ce problème y a longtemps et je n'arrive pas à me souvenir comment je l'ai résolu!

Tu utilise quelle version du framework?
La 1.10, j'avais pas vu...

**psylo66** · 07/10/2010, 15h23

Ah c'est déjà une bonne chose ça veut dire que c'est corrigible !
Ma version Zend 1.10.

**manuscle** · 07/10/2010, 16h56

Je vais te paraitre un peu têtu mais je reste quand même sur un problème d'encodage...

Tu développe ton site avec quel outil?

Je rajoute que j'ai trouvé des problèmes similaires en faisant des recherches google et que ces problèmes concernaient des fichiers encodés en UTF-8 avec BOM et contenant des caractères invisibles non imprimables avec UTF8 sans BOM

**psylo66** · 07/10/2010, 17h16

J'utilise Notepad++ , il y a effectivement la possibilité de convertir les fichiers en UTF-8 sans BOM je l'ai fais sur une bonne partie des fichiers mais rien à faire toujours le problème.
J'ai tout remis en UTF-8 du coup.

**manuscle** · 08/10/2010, 10h06

Normalement tu dois être en UTF-8 sans BOM avec Notepad++
Ouvre ta page qui pose problème avec Firefox et fait Affichage > Encodage des caractères > ISO-8859-1, est-ce que tu vois des caractères étranges?
Chez moi je vois ceci

Code :

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

 ï»¿

Sinon, essaie avec Notepad ++ de modifier ton layout comme ceci:
Tu fait dans l'ordre :
Encodage > Convertir en UTF-8 sans BOM (et non Encoder)
Tu retire tout espace blanc entre le début du fichier et ta première balise php
Tu enregistre et tu vérifie si tu as toujours devant la balise <!DOCTYPE html>

**psylo66** · 08/10/2010, 14h44

Je crois qu'effectivement déja que tu as cerné le problème, qui est un problème d'encodage.
J'ai convertit mon layout en UTF-8 sans BOM mais il n'y a pas d'espace blanc entre le début du fichier et ma première balise php et toujours ce fameux caractère quand je met l'encodage de mon navigateur en ISO-8859-1

Code :

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

1
2
 
ï»¿

Je me suis dit que ça pouvais venir d'autre vues inclues dans mon layout alors j'ai convertit tout mes fichiers en UTF-8 sans BOM mais toujours ce fameux caractère devant le Doctype :

Code :

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

1
2
 
ï»¿ ï»¿

Après j'avais entendu dire que Notepad++ était un peu limite au niveau de la gestion des encodages de caractères, si toutefois tu me conseillais de changer d'éditeur de texte lequel me ferais tu choisir ?

**manuscle** · 08/10/2010, 15h48

Je te conseil eclipse ou zend studio (un eclipse avec ZF integré). Là au moins t'auras pas de soucis...

**psylo66** · 08/10/2010, 15h59

Merci, je vais essayer Zend Studio alors, le fait qu'il soit intégré au framework me semble intéressant.
Je te tiens au courant après avoir essayé de corriger cette affreux petit problème d'affichage.

**stealth35** · 08/10/2010, 16h19

Envoyé par manuscle

Je te conseil eclipse ou zend studio (un eclipse avec ZF integré). Là au moins t'auras pas de soucis...

on peux intégrer le ZF avec éclipse direct aussi ( et gratuitement

)

**manuscle** · 08/10/2010, 16h57

Envoyé par stealth35

on peux intégrer le ZF avec éclipse direct aussi ( et gratuitement

)

Ah bon? Comment?

**stealth35** · 08/10/2010, 17h16

Envoyé par manuscle

Ah bon? Comment?

tu rajoutes le dépôt: http://downloads.zend.com/studio-eclipse/updates/8_0

après faut choisir :

Feature Patches
- Zend Studio Patches Feature

Zend Studio Feature
- Zend Debugger (si il est pas installer)
- Zend Studio CE Feature