Discussion :

[knice]

Bonjour,
je suis actuellement en stage et je dois mettre en place un formulaire où certains champs sont visibles pour l'utilisateur, mais invisibles dans le code html de la page...

Bon, ça semble un peu fou comme ça, mais mes patrons ont vu ça sur Vivastreet.

Suivez la démarche pour comprendre ce que je veux dire (ça prend maximum une minute) :
- aller sur : http://post.vivastreet.fr/post.php
- choisir "Location Appartement - Maison"
- là, la suite du formulaire s'affiche...
- afficher la source de la page (clic droit/Code source de la page sous Firefox) et chercher le mot "Titre" (avec un ctrl+F) : il n'y est pas ! Pourtant, il est bien sur la page
- Maintenant, sélectionner tout le texte (avec un ctrl+A) et choisir : "Code source de la sélection" sous Firefox
- Essayer de trouver le champ "Titre" : il y est !

Voilà, est-ce que vous savez comment Vivastreet s'y prend pour faire ce miracle ?... Car il serait vraiment bienvenue que j'arrive à faire de même...


Merci à ceux qui ont eu le courage de suivre la démarche, et encore plus à ceux qui pourront m'aider à avancer dans mon travail !

[MasterOfChakhaL]

Salut,

A mon avis, il ne s'agit pas d'un miracle mais plutôt d'un formulaire généré chez le client à l'aide de javascript (c'est pour ça que le champ n'apparaît pas dans le code source reçu par le navigateur).
Si tu désactives javascript, je suppose que tu ne verras plus ces champs...

[_ash_]

Effectivement, sans javascript ça ne fonctionne pas.
En fait le truc qui est plutôt surprenant dans le code source c'est ce passage :

Code :

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

<link type="text/ornithorynque" ...

C'est moi ou c'est étrange ?...

[knice]

<-- programmateur de Vivastreet ^^
N'empêche que je ne m'explique toujours pas leur manière de procéder...

Comment reproduire un tel comportement ?!

[Tommy31]

C'est un vulgaire appel ajax qui charge dynamiquement le formulaire.

Si tu regarde avec firebug, tu verras un appel serveur sur http://post.vivastreet.fr/post.php?x...g_for_rent&x=1 qui retourne un xml qui lui décrit le formulaire à afficher :

Code :

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

1
2
3
4
5
6
7
<table class="steps" cellpadding="3" border="0" cellspacing="0" width="100%"><tr class="">
    			<td class="title">
    				<strong class="">Titre de l'annonce<span class="star_mendatory"> *</span></strong>
    			</td>

...

Rien de bien magique, et surtout cette façon de procéder ne cache pas grand chose.

[Halleck]

Comment reproduire un tel comportement ?!

Très simplement :

Code javascript :

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

1
2
 
document.write('un exemple);

ou

Code javascript :

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

1
2
 
document.getElementById('unelementexemple').innerHTML = '<b>du texte en gras</b>;

C'est pas forcément la bonne méthode, surtout le deuxième exemple, mais ça marche et ça te donne un exemple

[knice]

ben merci beaucoup, je regarderai ça au boulot lundi ^^

bon week-end !

[Rakken]

De toute maniere, il faut bien te dire (et dire a tes patrons) une chose. Si ca s'affiche sur le navigateur, c'est qu'a un moment ou a un autre, l'info est arrivée jusqu'a ton pc. De fait, "cacher" le code devient utopique (cf post plus haut, un simple firebug et on en parle plus). Dans le meilleur des cas, ca ne sert à rien, et dans le pire, ca rend la maintenance plus compliquée et ca peut génerer de nombreux bugs de compatibilité.