Form xml recherche

Go_Ahead · 24/06/2008, 09h40

Salut à tous,

Je souhaiterais faire un formulaire de recherche avec Ajax sur des données provenant d'un fichier xml. Est ce possible ? y a t il des scripts dispo ou des tuto ?

Merci pour votre aide.

E.Bzz · 24/06/2008, 09h48

Bonjour,

Citation:

Envoyé par Go_Ahead

Je souhaiterais faire un formulaire de recherche avec Ajax sur des données provenant d'un fichier xml. Est ce possible ?

Oui.

Citation:

Envoyé par Go_Ahead

y a t il des scripts dispo ou des tuto ?

Bien sûr : juste au-dessus des discussions de ce forum

A+

Go_Ahead · 24/06/2008, 10h17

Citation:

Bien sûr : juste au-dessus des discussions de ce forum

Merci pour ce link, mais mon souhait c'est de pouvoir parser un fichier xml, avec Javascript ou Ajax et ne pas passer par un langage serveur (php, ...).

E.Bzz · 24/06/2008, 10h22

Citation:

Envoyé par Go_Ahead

Merci pour ce link, mais mon souhait c'est de pouvoir parser un fichier xml, avec Javascript ou Ajax et ne pas passer par un langage serveur (php, ...).

Oui, j'ai bien compris

Tu n'a pas besoin de langage serveur pour Ajax (ni même de serveur d'ailleurs : ça peut être un fichier local).

Les tutos te montrent comment faire l'appel au fichier, puis en traiter la réponse.

Et puis, ce n'est pas "Javascript ou Ajax", mais plutôt "Ajax donc Javascript"

A+

DoubleU · 24/06/2008, 10h51

Citation:

Et puis, ce n'est pas "Javascript ou Ajax", mais plutôt "Ajax donc Javascript"

T'es pas obligé d'utiliser Ajax pour parser un fichier xml.

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
<html>
<body>
<script type="text/javascript">
var doc = null;
 
if (window.ActiveXObject)
	doc = new ActiveXObject("Microsoft.XMLDOM");
else
	doc = document.implementation.createDocument("","",null);
 
doc.async=false;
doc.load("file.xml");
 
var root = doc.documentElement;
alert(root);
</script>
</body>

E.Bzz · 24/06/2008, 10h55

Citation:

Envoyé par DoubleU

Citation:

Et puis, ce n'est pas "Javascript ou Ajax", mais plutôt "Ajax donc Javascript"

T'es pas obligé d'utiliser Ajax pour parser un fichier xml.

Ce n'était qu'une remarque sur le vocabulaire (confusion récurrente) et non sur la méthode

A+

Bovino · 24/06/2008, 20h03

Citation:

Envoyé par E.Bzz

Tu n'a pas besoin de langage serveur pour Ajax (ni même de serveur d'ailleurs : ça peut être un fichier local).

Désolé de faire mon tatillon, mais je ne suis pas tout à fait d'accord avec ça...
Certes, il est possible de récupérer des fichiers en local en utilisant le modèle de requête Ajax, sauf que ce n'est ici qu'une utilisation impropre de l'objet XMLHttpRequest.
Pour faire cela, tu ne peux plus passer par un protocole http qui est pourtant l'essence même de XMLHttpRequest ! De plus, impossible de travailler avec les codes retour (readyState et satus).
Enfin, l'argument 'qui tue' :

Citation:

The XMLHttpRequest Object specification defines an API that provides scripted client functionality for transferring data between a client and a server.

La source ici, on ne peut plus fiable...
Mais bon, tout cela ne sert qu'à chipoter et n'est que question de point de vue et de terminologie.
En guise de conclusion, tu as malgré tout raison de dire qu'une requête de type Ajax peut récupérer des données en local, mais selon moi, ce n'est plus de l'Ajax...

Citation:

Envoyé par E.Bzz

Et puis, ce n'est pas "Javascript ou Ajax", mais plutôt "Ajax donc Javascript"

Mille fois d'accord et ça a déjà été dit assez souvent, mais j'ai peur que l'on soit encore obligés de le répéter souvent !

Go_Ahead · 25/06/2008, 08h24

DoubleU, merci pour ton début de script.
Le but pour moi est de parser un fichier xml, et de pouvoir faire des recherches dessus, afficher un tableau par exemple etc...

E.Bzz · 25/06/2008, 09h33

@Bovino > je simplifie en assimilant Ajax à XMLHttpRequest + Javascript, mais d'accord sur le reste.
Sauf sur l'argument qui tue : il s'agit d'une phrase d'introduction descriptive : ce n'est pas parce qu'un parapluie fournit un moyen efficace de se protéger de la pluie, qu'il ne peut pas être utilisé pour se protéger tout aussi efficacement du soleil

Mais tu peux ajouter dans ta feuille de style :

Code :

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

tatillon : absolute;

@Go_ahead :

C'est bien là-dessus qu'on t'a répondu ...
Qu'est-ce qui ne va pas ?

A+

Go_Ahead · 25/06/2008, 12h16

Citation:

C'est bien là-dessus qu'on t'a répondu ...
Qu'est-ce qui ne va pas ?

Le fait que ça ne fonctionne pas, mais aussi je souhaiterais afficher sous forme de tableau un noeud complet...

E.Bzz · 25/06/2008, 12h22

Citation:

Envoyé par Go_Ahead

Le fait que ça ne fonctionne pas,

Qu'est-ce qui ne fonctionne pas ?
On a pas une ligne de ton code et on ne sait même pas ou tu en es ...

Bovino · 25/06/2008, 12h23

Citation:

Envoyé par Go_Ahead

Le fait que ça ne fonctionne pas, mais aussi je souhaiterais afficher sous forme de tableau un noeud complet...

Montre nous quand même un peu comment tu procèdes... sinon, c'est difficile de t'aider avec comme seule indication : ça ne fonctionne pas !
Donc

Citation:

Envoyé par E.Bzz

Qu'est-ce qui ne va pas ?

Go_Ahead · 25/06/2008, 14h05

Citation:

Qu'est-ce qui ne va pas ?

Alors je suis parti du code et je me rends compte que j'ai une erreur à cause du :

Citation:

alert(root);

j'ai cette erreur : [object], il ne reconnait pas l'objet 'root'..
En plus de cela, je souhaiterais mettre en forme le resultat sous forme de tableau et pas en alert...

Merci pour votre aide.

DoubleU · 25/06/2008, 14h12

En fait, je t'avais juste mis cette ligne pour illustrer le fait que root contient le noeud racine de ton arbre xml.

Apres, tu peux faire tes traitements (mettre en tableau?) dessus.

Bovino · 25/06/2008, 14h17

Si l'erreur est d'afficher [Object] dans un alert, la solution est simple, ne demande pas d'afficher un alert sur un objet !

Désolé, plus sérieusement, ça montre au contraire que ça marche, maintenant, à toi de naviguer dans le xml pour récupérer les données que tu veux.

Go_Ahead · 25/06/2008, 14h26

Tout d'abord merci pour vos réponses.

Citation:

En fait, je t'avais juste mis cette ligne pour illustrer le fait que root contient le noeud racine de ton arbre xml.

Ok je viens de comprendre pour quelles raisons j'ai ce type d'affichage...
Mon fichier xml contient plusieurs noeud, et je souhaiterais faire un outil de recherche assez rapide, et donc avoir en sortie un tableau, après avoir rempli certains champs de recherche.
Je cherchais simplement voir si de tels exemples étaient dispo, pour me faciliter un peu le boulot.

Go_Ahead · 26/06/2008, 16h58

Voici ce que j'ai :
bdd.xml

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
<?xml version="1.0" encoding="iso-8859-1" ?> 
<bibliotheque>
 <livre>
  	<nom>Le guet des orfèvres</nom> 
  	<auteur>Terry Pratchett</auteur> 
  	<date>1993</date> 
 </livre>
 <livre>
 	<nom>Nobliaux et sorcières</nom> 
  	<auteur>Terry Pratchett</auteur> 
  	<date>1992</date> 
 </livre>
 <livre>
 	<nom>Mécomptes de fées</nom> 
  	<auteur>Terry Pratchett</auteur> 
  	<date>1991</date> 
 </livre>
</bibliotheque>

fichier .js :

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
function loadXML(){
 
	if (document.implementation && document.implementation.createDocument) {
		// déclaration pour Mozilla et FF
		docXml = document.implementation.createDocument('', '', null);
 
	}
	else if (window.ActiveXObject){
		// déclaration pour IE
		docXml = new ActiveXObject("Microsoft.XMLDOM");
 
	}
	else {
 
		alert('Votre navigateur ne saurait pas éxécuter ce script.');
 
	}
 
	docXml.load("bdd.xml");
 
}
function biblio(num) {
 
	var numero = parseInt(num, 10);
 
	var book = docXml.getElementsByTagName('nom');
	var author = docXml.getElementsByTagName('auteur');
	var parution = docXml.getElementsByTagName('date');
 
	document.forms[0].elements[2].value = book[numero].firstChild.nodeValue;
	document.forms[0].elements[3].value = author[numero].firstChild.nodeValue;
	document.forms[0].elements[4].value = parution[numero].firstChild.nodeValue;
 
}
 
 
window.onload = function() {
 
	document.forms[0].reset();
 
	loadXML();
 
	document.forms[0].elements[1].onclick = function() {
		biblio(document.forms[0].elements[0].value);
	};
};

fichier .html :

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3c.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr-BE" lang="fr-BE">
	<head>
 
		<link rel="stylesheet" type="text/css" href="css/styles.css" media="screen" />			
 
		<script type="text/javascript" src="Js_script.js"></script>	
	</head>
 
	<body>
		<div id="all-box">
 
			<form action="#">
				<p>
					<label>
						Afficher le 
						<select name="setBook" size="1">
							<option value="0" selected="selected">premier</option>
							<option value="1">deuxieme</option>
							<option value="2">troisieme</option>
						</select>
						 livre de la bibliotheque. 
						 <input type="button" value="valider" />
					 </label>
				</p>
 
 
 
 
				<p>
					Titre: <input type="text" value="" size="30" />
				</p>
 
				<p>
					Auteur: <input type="text" value="" size="20" />
				</p>
 
				<p>
					Annee de parution en langue originale: <input type="text" value="" size="5" />
				</p>
 
			</form>
 
 
 
 
		</div>
	</body>
</html>

Voila, le procédé me plait sauf que j'aimerais modifié l'affichage, la il se fait sur des input, pour moi j'aimerais afficher le resultat de ma recherche dans un tableau.
J'espere avoir l'aide d'un expert en javascript...

Merci à ceux qui pourront m'aider.

Bovino · 02/07/2008, 13h14

Ben... fais un tableau et insère tes résultats dedans...

Où as-tu un problème ?

Go_Ahead · 02/07/2008, 13h36

Citation:

Ben... fais un tableau et insère tes résultats dedans...
Où as-tu un problème ?

Le probleme c'est l'automatisation.
Je devrais remplacer dans le .js

Code :

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

document.forms[0]...

par

Code :

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

document.write("<table>")...

dans une boucle de préference...
Et aussi l'autre probleme, c'cest que je souhaiterais faire des recherches sur les valeurs des noeuds et pas sur les id ... mais je ne sais pas comment faire.

Bovino · 02/07/2008, 13h50

Bon, déjà, document.write(), c'est pas très joli... Il existe des méthodes plus propres pour créer et insérer des éléments dans une page.
Du style :

Code :

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

document.createElement('table')

et insertRow(), insertCell().
Tu peux facilement créer des boucles avec ces instructions.

Pour ce qui est des valeurs de noeuds, le plus compliqué est d'atteindre le noeud en question (gestion différente selon que tu utilises IE ou un navigateur...

), ensuite, récupérer la valeur du noeud est plutôt simple (nodeValue).
Documente toi sur le DOM.

24/06/2008, 09h40	#1
Go_Ahead Membre habitué Inscription : mars 2006 Messages : 395 Détails du profil Informations forums : Inscription : mars 2006 Messages : 395 Points : 128 Points : 128	Form xml recherche Salut à tous, Je souhaiterais faire un formulaire de recherche avec Ajax sur des données provenant d'un fichier xml. Est ce possible ? y a t il des scripts dispo ou des tuto ? Merci pour votre aide.
	00

25/06/2008, 09h33	#9
E.Bzz Responsable Modération Inscription : janvier 2007 Messages : 9 316 Détails du profil Informations personnelles : Sexe : Localisation : France, Isère (Rhône Alpes) Informations professionnelles : Secteur : Finance Informations forums : Inscription : janvier 2007 Messages : 9 316 Points : 15 522 Points : 15 522	@Bovino > je simplifie en assimilant Ajax à XMLHttpRequest + Javascript, mais d'accord sur le reste. Sauf sur l'argument qui tue : il s'agit d'une phrase d'introduction descriptive : ce n'est pas parce qu'un parapluie fournit un moyen efficace de se protéger de la pluie, qu'il ne peut pas être utilisé pour se protéger tout aussi efficacement du soleil Mais tu peux ajouter dans ta feuille de style : Code : Sélectionner tout - Visualiser dans une fenêtre à part tatillon : absolute; @Go_ahead : C'est bien là-dessus qu'on t'a répondu ... Qu'est-ce qui ne va pas ? A+
	00

25/06/2008, 14h17	#15
Bovino Responsable Développement Web Didier Mouronval Développeur Web Inscription : juin 2008 Messages : 13 828 Détails du profil Informations personnelles : Nom : Didier Mouronval Âge : 41 Localisation : France, Gironde (Aquitaine) Informations professionnelles : Activité : Développeur Web Secteur : High Tech - Éditeur de logiciels Informations forums : Inscription : juin 2008 Messages : 13 828 Points : 35 998 Points : 35 998	Si l'erreur est d'afficher [Object] dans un alert, la solution est simple, ne demande pas d'afficher un alert sur un objet ! Désolé, plus sérieusement, ça montre au contraire que ça marche, maintenant, à toi de naviguer dans le xml pour récupérer les données que tu veux. __________________ Pas de question technique par MP ! Tout le monde peut participer à developpez.com, vous avez une idée, contactez-moi ! Vous possédez un blog et aimeriez diffuser vos billets sur le forum, contactez-moi ! Mes formations video2brain : La formation complète sur JavaScript • JavaScript et le DOM par la pratique • PHP 5 et MySQL : les fondamentaux Mon livre sur jQuery
	00

02/07/2008, 13h14	#18
Bovino Responsable Développement Web Didier Mouronval Développeur Web Inscription : juin 2008 Messages : 13 828 Détails du profil Informations personnelles : Nom : Didier Mouronval Âge : 41 Localisation : France, Gironde (Aquitaine) Informations professionnelles : Activité : Développeur Web Secteur : High Tech - Éditeur de logiciels Informations forums : Inscription : juin 2008 Messages : 13 828 Points : 35 998 Points : 35 998	Ben... fais un tableau et insère tes résultats dedans... Où as-tu un problème ? __________________ Pas de question technique par MP ! Tout le monde peut participer à developpez.com, vous avez une idée, contactez-moi ! Vous possédez un blog et aimeriez diffuser vos billets sur le forum, contactez-moi ! Mes formations video2brain : La formation complète sur JavaScript • JavaScript et le DOM par la pratique • PHP 5 et MySQL : les fondamentaux Mon livre sur jQuery
	00

02/07/2008, 13h50	#20
Bovino Responsable Développement Web Didier Mouronval Développeur Web Inscription : juin 2008 Messages : 13 828 Détails du profil Informations personnelles : Nom : Didier Mouronval Âge : 41 Localisation : France, Gironde (Aquitaine) Informations professionnelles : Activité : Développeur Web Secteur : High Tech - Éditeur de logiciels Informations forums : Inscription : juin 2008 Messages : 13 828 Points : 35 998 Points : 35 998	Bon, déjà, document.write(), c'est pas très joli... Il existe des méthodes plus propres pour créer et insérer des éléments dans une page. Du style : Code : Sélectionner tout - Visualiser dans une fenêtre à part document.createElement('table') et insertRow(), insertCell(). Tu peux facilement créer des boucles avec ces instructions. Pour ce qui est des valeurs de noeuds, le plus compliqué est d'atteindre le noeud en question (gestion différente selon que tu utilises IE ou un navigateur...), ensuite, récupérer la valeur du noeud est plutôt simple (nodeValue). Documente toi sur le DOM. __________________ Pas de question technique par MP ! Tout le monde peut participer à developpez.com, vous avez une idée, contactez-moi ! Vous possédez un blog et aimeriez diffuser vos billets sur le forum, contactez-moi ! Mes formations video2brain : La formation complète sur JavaScript • JavaScript et le DOM par la pratique • PHP 5 et MySQL : les fondamentaux Mon livre sur jQuery
	00

25/06/2008, 08h24	#8
Go_Ahead Membre habitué Inscription : mars 2006 Messages : 395 Détails du profil Informations forums : Inscription : mars 2006 Messages : 395 Points : 128 Points : 128	DoubleU, merci pour ton début de script. Le but pour moi est de parser un fichier xml, et de pouvoir faire des recherches dessus, afficher un tableau par exemple etc...
	00

25/06/2008, 14h12	#14
DoubleU Modérateur Inscription : janvier 2006 Messages : 1 107 Détails du profil Informations forums : Inscription : janvier 2006 Messages : 1 107 Points : 1 118 Points : 1 118	En fait, je t'avais juste mis cette ligne pour illustrer le fait que root contient le noeud racine de ton arbre xml. Apres, tu peux faire tes traitements (mettre en tableau?) dessus.
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email