CitySearch-API : webservice et son API géographique Rss du webservice CitySearch-API

Webservices JSON | Webservices XML | Villes proches |

Identification | Contact

API du webservice géographique français

Les widgets Javascript

Retrouvez tous les widgets javascript proposés pour la recherche de ville, code postal, départements, régions et/ou pays.

Ces widgets javascript utilisent la librairie JQuery
librairie javascript JQuery
.

Cette librairie JS a été concue de manière a pouvoir être intégrée sur n'importe quelle page sans générer de conflicts avec les autres librairies javascript tel que mootools, ...

Recherche sur des champs TEXT haut de page

Ce widget associé à des champs TEXT permet à l'utilisateur de pré-remplir les champs ville, département, code postal et d'obtenir des résultats cohérents avec votre base de données.

Tutorial

:

Recherche sur des champs SELECT haut de page

Ce widget associé à des champs SELECT permet à l'utilisateur de retrouver sa ville, son code postal, sa région... en un clic.

Tutorial

:

Téléchargement du js haut de page

Vous pouvez télécharger directement le fichier js ou faire appel à lui directement via ce site.

Télécharger les versions incluant la librairie Query (conseillé) :



Télécharger les versions n'incluant pas la librairie Query * :



Cette version sans JQuery inclu est recommandée si votre page appel déjà la librairie JQuery.

L'appel du script Javascript directement depuis votre site nécéssite toutefois les paramètres obligatoires liés à cette API et supporte aussi les paramètres optionnels ci-dessous.

Appel du Javascript en livehaut de page

Vous pouvez tout aussi bien télécharger les scripts javascript sur votre site ou faire appel en live depuis ce site via l'URL fournie ci-dessous.

Pour appeler le fichier directement, l'URL est la suvivante :

:

http://www.citysearch-api.com/js/widget.js

Exemple d'URL a appeler :

http://www.citysearch-api.com/js/widget.js?appname=APP_LOGIN&appkey=APP_KEY&needcss=1&sdefault=1&debug=0

Exemple avec le script d'appel :

			
		

Cette dernière méthode permet de n'avoir jamais besoin de mettre à jour la librairie javascript CitySearch-API.

Arguments requishaut de page

Les paramètres requis sont le login (APP_LOGIN) et la clé (APP_KEY) que vous avez créés pour le site concerné, tel que :

: String (nom que vous avez donné à votre application)

: String (la clé que vous avez reçu lors de la création de votre application)

Arguments optionnelshaut de page

A l'appel du JS, plusieurs arguments peuvent venir se rajouter :

: Boolean (appel du CSS)

Activé, ce paramètre permet d'appeler le CSS lié au widget JS pour obtenir une mise en forme fonctionnelle.

: Boolean (liste des pays, régions ou départements)

Activé, ce paramètre pré-rempli automatiquement les selects pays, régions (ou départements) de votre page.

: Boolean (affichage des logs)

Permet d'afficher les logs dans le navigateur (par exemple : via firebug).

Exemple d'appel du widget JS:

		
	

Construction du HTMLhaut de page

La construction du formulaire HTML est classique et ne nécéssite que l'ajout d'un attribut de type search sur les champs concernés par le widget JS ainsi que d'une classe ui-autocomplete-select.

Pour ne pas interférer avec le HTML déjà existant de vos formulaires, CitySearch-API a pris le parti de ne pas prendre en compte l'attribut name dans son fonctionnement.

Exemple d'ajout d'un attribut search sur un champ pays :

		
	

Attributs possibleshaut de page

L'attribut search permet de spécifier le type de recherche à effectuer sur le champ concerné.

Il peut prendre différent type de valeurs :

: string

Permet de spécifier un champ de type pays.

Dans le cas d'un champ SELECT, lorsque l'utilisateur selectionnera le pays FRANCE, les champs SELECT, déjà présents dans la page, de type "régions" (ou "départements" si aucun champ région n'est trouvé) apparaitront automatiquement dans votre formulaire.

Dans le cas où le paramètre default du widget JS est activé, au chargement de la page, la liste des pays sera automatiquement loadée dans ce select.

Exemple avec un champ SELECT :

			
		

: string

Permet de spécifier un champ de type région.

Dans le cas d'un champ SELECT, lorsque l'utilisateur selectionnera l'une des régions de ce champ, les champs SELECT, déjà présents dans la page, de type "département" (ou "ville" si aucun champ département n'est trouvé) apparaitront automatiquement dans votre formulaire.

Dans le cas où le paramètre default du widget JS est activé, au chargement de la page, la liste des régions sera automatiquement loadée dans ce select.

Exemple :

			
		

: string

Permet de spécifier un champ de type département.

Dans le cas d'un champ SELECT, lorsque l'utilisateur selectionnera l'un des départements de ce champ, les champs SELECT, déjà présents dans la page, de type "villes" apparaitront automatiquement dans votre formulaire.

Dans le cas où le paramètre default du widget javascript est activé, au chargement de la page, la liste des départements sera automatiquement loadée dans ce SELECT si aucun champ région n'est trouvé.

Dans le cas d'un champ TEXT, lorsque l'utilisateur commencera à renseigner son département, des départements commençant par les premières lettres renseignées lui seront automatiquement proposés.

Exemple avec un champ SELECT:

			
		

Exemple avec un champ TEXT:

			
		

: string

Permet de spécifier un champ de type ville.

Dans le cas d'un champ TEXT, lorsque l'utilisateur commencera à renseigner sa ville, des villes commençant par les premières lettres renseignées lui seront automatiquement proposées.

Quelque soit le type de champ SELECT ou TEXT, lorsque l'utilisateur selectionnera l'une des villes proposées, les champs input, déjà présents dans la page, de type "cp" seront automatiquement renseignés.

Exemple avec un champ SELECT:

				
		

Exemple avec un champ TEXT:

			
		

: string

Permet de spécifier un champ de type "code postal".

Ce champ est automatiquement renseigné lorsqu'une ville est selectionnée via le widget JS.

Il peut donc être mis en HIDDEN pour réduire le nombre de champ du formulaire.

Exemple avec un champ TEXT:

				
		

Astucehaut de page

Sur les champs TEXT, ajoutez l'attribut autocomplete à off pour ne pas avoir des anciennes valeurs proposées automatiquement par le navigateur.

Exemple :

		
		

Compatibilité du widget Javascripthaut de page

Le widget JS est compatible avec les versions équivalentes et supérieures des navigateurs suivants:

Nous sommes tributaires de la résolution navigateur questions en permanence, donc si vous trouvez un bug, rapportez le!



widget JQuery de recherche géolocalisée
Licence Creative Commons
Widget Javascript CitySearch-API de Widget JS 1 est mis à disposition selon les termes de la licence Creative Commons Attribution - Pas d'Utilisation Commerciale - Partage dans les Mêmes Conditions 3.0 non transposé.
Basé(e) sur une oeuvre à www.citysearch-api.com.
Les autorisations au-delà du champ de cette licence peuvent être obtenues à http://www.citysearch-api.com/fr/contact/.

Webservices JSON | Webservices XML | Villes proches |

Identification | Contact

API du webservice géographique français

Menu