www.archive-fr-2012.com » FR » X » XUL

Choose link from "Titles, links and description words view":

Or switch to "Titles and links view".

    Archived pages: 735 . Archive date: 2012-10.

  • Title: Xul.fr - Interfaces graphiques avec Ajax, HTML 5, JavaScript et CSS
    Descriptive info: .. Ajax.. JavaScript.. CSS.. HTML 5.. Gecko.. XUL.. Tutoriel Ajax.. XMLHttpRequest.. Frameworks.. Démos et scripts.. Web 2.. 0.. Techniques.. Application web.. Tutoriel RSS.. XUL XML.. Tutoriel XUL.. RDF.. DOM.. Ressources.. Logiciels.. Gecko et Firefox.. Lightbox.. Forum.. Traductions.. English.. Ajax, JavaScript, DOM et CSS sont des standards pour construire des sites et des applications web.. HTML 5 est un langage d'interface utilisateur graphique comme XUL.. Ajax, JavaScript, DOM and CSS are the standards of the Web to build modern sites and applications.. HTML 5 is a graphical user interface langage such as XUL.. Tutoriels et démonstrations pour maîtriser les composants des applications modernes basées sur les standards du Web.. Avec exemples en texte ou XML.. Comment construire une page.. Spécification XMLHttpRequest.. par le W3C, la traduction en français est hébergée sur xul.. fr.. Démos et script Ajax.. JSON.. Tutoriel et démo.. Un format simple d'échange de données avec le serveur.. Cadres d'applications Ajax.. Choisir la bonne bibliothèque pour simplifier la création d'une application ou un site interactif.. Extensible Page.. Un script pour construire des pages Web qui se développent à la demande du lecteur.. HTML 5.. Plateforme universelle pour les applications de bureau, sur mobiles et tablettes.. L'interface des pages Web et de XML.. Webmaster du Web 2.. Une page extensible pour faire un tour des techniques qu'emploient les sites modernes.. La création d'une application Web.. Comment faire un logiciel utilisable sans installation.. Tutoriel JavaScript interactif.. Des démonstrations interactives pour maîtriser plus facilement le langage.. JavaScript asynchrone.. Rendre tous les scripts comme Ajax et accélérer le chargement des pages.. Lightbox sans framework.. Plusieurs cas dont les images et les formulaires.. La balise blockquote stylée pour mettre en relief les citations.. En CSS pur, sans code JavaScript.. Les extensions Firefox.. Elles transforment le navigateur en outil de développement.. Liste des meilleurs extensions pour internautes et webmasters.. XML.. Les standards et les outils pour créer et utiliser des documents.. DocBook.. Faut-il choisir DocBook, PDF ou XPS pour les documents techniques?.. Introduction au format sémantique.. Apprendre à faire une interface en exemples.. SVG, graphisme interactif dans les pages web.. Description et outils du vocabulaire XML pour le graphisme vectoriel dans les pages Web.. Comment créer un flux RSS pour publier les nouveautés d'un site au format courant RSS 2.. Tutoriel RSS 1.. Le format RSS RDF.. Derniers articles.. L'orientation objet dans JavaScript.. Mise  ...   A propos.. On peut supprimer la mise à jour automatique si on le préfère avec about:config - app.. update.. auto = false.. Les joueurs profiteront d'une amélioration de WebGL mais se sont surtout les développeurs qui apprécieront cette nouvelle version.. Il est possible de basculer entre la vue desktop et mobile d'une page avec l'option Responsive Design dans le menu développeurs et un débogueur JavaScript est ajouté aux outils.. Démonstration de textures avec WebGL amélioré.. 29 août 2012.. HTML et HTML 5: il y a maintenant deux standards.. Cela a été.. annoncé officiellement.. par le WHATWG, il va maintenant développer librement HTML en toute indépendance vis à vis du W3C qui s'en tient à une version fixée nommée HTML 5.. Le HTML libre va donc être développé jour après jour en fonction des demandes des éditeurs de navigateurs sans attendre l'approbation du W3C.. Cela ne va pas vraiment changer la vie des webmasters qui utilisent déjà les nouvelles fonctions seulement quand elles sont implémentées par les principaux navigateurs.. Ian Hickson ne maintient plus la version W3C et se consacrera au HTML libre.. 19 juillet 2012.. Des mobiles Firefox OS en 2013.. Ce sera au Brésil pour commencer grâce au support de Vivo, un opérateur de télécommunication de ce pays.. Mais le système Boot 2 Gecko renommé Firefox OS, qui est basé sur HTML 5, a le support de nombreux autres opérateurs dans le monde et des fabricants de matériels Alcatel et ZTE.. Pour célébrer ce succès naissant, Mozilla à créé ce joli logo.. L'intérêt de B2G est d'accéder aux fonctions de l'appareil même pour une application HTML 5, ce que l'on fait aussi avec d'autres frameworks JavaScript comme PhoneGap, mais c'est plus direct car B2G est ici le système d'exploitation lui-même, la.. WebAPI.. sur une base Linux.. 2 juillet 2012.. RDF dans HTML 5.. Le W3C a validé RDFa comme format sémantique pour HTML 5.. Cela consiste essentiellement à ajouter des attributs aux balises pour leur donner une signification sémantique, qui puisse être traitée par un programme.. C'est aussi une alternative aux Microformats, que Google utilise, notamment pour les recettes de cuisine.. Le format.. RDFa Lite.. , est une version simplifiée.. Reste à voir ce standard adopté par les acteurs du Web et surtout les moteurs de recherche.. 9 juin 2012.. Archives.. 2012.. -.. 2011.. 2010.. 2009.. 2008.. 2006-2012.. Xul..

    Original link path: /
    Open archive

  • Title: Ajax, tutoriels et démonstrations
    Descriptive info: Tutoriel JSON.. Ajax et PHP.. Démos.. Scripts.. responseHTML.. Page extensible.. Galerie d'images.. Ajax multi-sites.. Ajax, tutoriels et démonstrations.. Ajax est l'élément principal d'une librairie de fonctions pour créer une application en ligne moderne.. Un programmeur du Web 2.. 0 a besoin d'Ajax pour réaliser une application ou un site moderne avec une interface rapide et la mise à jour instantanée du contenu des pages.. Applications de la technologie Ajax et compléments aux attributs et méthodes.. Demos Ajax.. Ces démos sont conçues comme des modèles que vous pouvez réutiliser comme point de départ de vos propres pages web.. Comment dialoguer avec un programme sur le serveur, obtenir des informations sur un fichier, etc.. ResponseHTML.. Pourquoi pas aussi un attribut responseHTML? Mais ce n'est pas un problème, une fonction JavaScript peut l'ajouter très simplement à Ajax.. Ajax Extensible Page.. Framework pour construire des pages Web qui se développent à la demande des visiteurs.. Galerie d'images et photos.. Ajax est utlisé pour charger les images en mode asynchrone.. Ainsi il est possible d'afficher les images en passant la souris sur les vignettes sans aucune attente.. Select dynamique.. Avec du code JavaScript, on modifie dynamiquement le contenu des listes et menu.. Ajax permet en outre de sauver la liste modifiée et la charger lors d'une session ultérieure.. Ajax avec un second site distant.. L'objet XMLHttpRequest, dans sa définition actuelle  ...   concernées par Ajax.. JavaScript et HTML.. Tutoriel JavaScript interactif et études de cas.. Les principales méthodes de.. , l'interface standard aux documents XML et pages Web HTML.. Tutoriel complet, comment interfacer JavaScript et XMLHttpRequest pour mettre à jour la page Web.. Exemples avec texte et XML.. XDomainRequest.. Microsoft a inventé XMLHTTP qui est à l'origine de XMLHttpRequest.. Avec XDomainRequest la firme invente un objet pour communiquer entre sites différents.. Quel est le rapport entre Ajax et PHP? Les bases de l'interaction entre les deux technologies.. Objet utilisable en JavaScript pour échanger des données entre le navigateur et le serveur.. JSON est un autre format pour sauvegarder des données sur le serveur et qui peuvent être récupérées par Ajax, il est structuré mais plus simple que XML.. Outils.. Programmation Ajax avec NetBeans.. Revue d'un IDE et son utilisation pour Ajax.. FAQ Ajax.. Pourquoi dois-je utiliser Ajax?.. Que représente le mot Ajax?.. Par quoi commencer pour utiliser Ajax?.. Dois-je obligatoirement utiliser XML?.. Ajax peut-il évoluer?.. Quand dois-je utiliser GET ou POST?.. Qu'est-ce que la navigation Ajax?.. Ajax peut-il rendre l'utilisation difficile?.. JavaScript asynchrone peut-il remplacer Ajax?.. Ajax peut-il remplacer Flash?.. Références et ressources.. La traduction officielle de la spécification du standard W3C est réalisée par xul.. Quel framework Ajax choisir?.. Les meilleurs cadres d'applications pour programmer en Ajax et leurs spécificités.. Avec une version Ajax.. Tweet.. 2006-2012 Xul..

    Original link path: /scripts/
    Open archive

  • Title: Tutoriel JavaScript par l'exemple. Widgets et scripts
    Descriptive info: Tutoriel JavaScript.. Variables.. Tableaux.. Fonctions.. PHP.. Formulaire.. Eval.. Expr.. régulière.. Objets.. Window.. Démo illusion.. Widgets JavaScript.. Vue d'ensemble.. Votes d'article.. Bookmarklet.. Onglets.. Ajax et HTML 5.. Tutoriel HTML 5.. Application Web.. A.. E.. P.. Scripts Ajax.. Traductions.. Anglais.. Tutoriel JavaScript par l'exemple.. Widgets et scripts.. Il est plus facile d'apprendre un langage avec des exemples interactifs.. Ce tutoriel qui est aussi un manuel de reférence, propose des démos interactives pour chaque élément du langage JavaScript.. Introduction à JavaScript.. Si l'on connait le langage C ou PHP, ce manuel suffira à utiliser JavaScript, notamment pour comprendre et utiliser les exemples et démos de ce site.. JavaScript et C: Héritage et différences.. Variables et constantes.. Les variables JavaScript sont dynamiques.. Les règles de visibilité.. Les opérateurs.. Les tableaux.. Ils sont dynamiques et dotés d'attributs et méthodes.. Tableau associatif.. For each.. Les fonctions.. Définition et utilisation de fonctions.. Fonctions prédéfinies.. On peut les utiliser dans tout script.. La fonction.. eval.. Cette fonction intégrée permet d'ajouter du code JavaScript dynamiquement.. Les structures de contrôle.. Structures conditionnelles et boucles.. JavaScript et PHP.. Partage de variables entre PHP et les pages Web.. Ajouter des variables à celles des formulaires.. Expression régulière.. Traitement de texte selon des règles de correspondance.. Evènements.. Illusion d'optique.. Démonstration: comment changer une image quand on presse le bouton de la souris.. Comment réaliser un code asynchrone comme celui de d'Analytics, de Google.. Aide-mémoire JavaScript.. L'essentiel dans une seule page.. Les objets.. En JavaScript, ils sont dynamiques et changent de structure durant le traitement.. L'objet.. Number.. Attributs et méthodes de l'objet nombre.. String.. Détail de toutes les méthodes de chaîne de caractères.. Array.. Avec un test interactif des attributs et méthodes de tableau.. Date.. RegExp.. Pour passer des expressions régulières à un formulaire.. Booléens et objet Boolean.. Principes et objets de formulaire en HTML 4 et HTML  ...   de dialogue.. Interagir avec l'utilisateur avec alert, confirm, prompt.. Ouvrir une fenêtre en JavaScript.. setTimeout et setInterval.. Les délais à l'exécution.. Navigator.. Pour identifier le navigateur de l'internaute.. Image Map.. Des hyperliens dans les images.. Images dynamiques.. Remplacer une image.. Lightbox sans framework.. Pour réaliser une lightbox et afficher du texte ou des images dans une boite, seules quelques descripteurs CSS suffisent.. Du code JavaScript est ajouté pour changer dynamiquement le contenu de la boite.. Onglets en CSS sans framework.. Un Tab Panel pour un site Web ou une application, sans framework, en simple CSS ou avec quelques lignes de JavaScript pour insérer le contenu dans la même page.. Onglets avec frames.. Bouton à deux états.. Comment créer un bouton ou une commande textuelle basculant entre deux états.. Votes pour un article.. Comment afficher une image qui donne le nombre de points attribués à un article.. Image mystérieuse.. Remplacer dans un effet de fondu un texte par une image afin qu'elle ne soit affichée qu'au moment voulu.. Barre de navigation.. Accéder aux pages d'un article.. Tutoriel des bookmarklets.. Un moyen simple d'incorporer des fonctionnalité à une page Web ou d'en rajouter au navigateur.. Bookmarklets de recherche.. Ajoutez des boutons de recherche avancée.. Informations sur la page.. Ajouter des bookmarks qui fournissent des informations statistiques ou descriptives sur toute page affichée par le navigateur.. Autres tutoriels.. par une autre sur une page déja chargée et affichée par le navigateur est facile, même si c'est l'image de fond de page, mais il faut connaître quelques fonctions du DOM.. Positionner un texte sur une image.. Créer une liste de sélection dynamique en JavaScript et Ajax.. Vidéo contextuelle Youtube.. Laisser Google choisir des vidéos pour illustrer un article en fonction du contenu de la page!.. Ressources et applications.. Frameworks JavaScript.. Outils de programmation JavaScript.. Jeux en JavaScript.. 2007-2012 Xul..

    Original link path: /ecmascript/
    Open archive

  • Title: Tutoriel CSS et style des balises HTML
    Descriptive info: Syntaxe.. Sélecteurs.. Display.. Position.. Float.. Clear.. Padding et margin.. Overflow.. Box-shadow.. Opacity.. Transition.. Démos CSS.. Fenêtre.. Galerie.. Scripting.. Tutoriel CSS et style des balises HTML.. CSS (Cascading Style Sheet) est une grammaire de règles pour définir la présentation d'un document HTML, XHTML ou XML.. C'est un standard du Web reconnu par tous les navigateurs.. Le tutoriel CSS permet avec des démonstrations interactives de mieux connaître les propriétés et la façon dont elles fonctionnent.. Syntaxe CSS.. Les sélecteurs CSS 2 et 3.. Comment ajouter une ombre à une boite de texte ou une image en CSS 3.. On peut aussi ajouter une.. ombre.. en CSS 2.. background.. Mettre une image en fond de page.. Fenêtre sur un paysage.. Voir un panoramique dans une fenêtre, avec effet de relief grâce à la propriété background.. display.. Propriété de mise en forme.. position.. Combinaison entre le conteneur et les éléments contenus.. Du texte sur une image.. L'utilisation de.. permet la superposition de calques.. float.. Son effet dépend de l'ordre dans le code.. clear.. Fonctionne en conjonction avec float.. clip.. Recadrer une image ou créer des vignettes.. padding et margin.. fieldset.. Personnaliser la balise et résoudre les problèmes de compatibilité.. white-space.. Contrôle les espaces et retours à la ligne.. Les tabulations dans une page web.. overflow.. : Contrôler l'alignement dans un bloc conteneur.. !important.. Surclasser les précédences.. z-index.. Propriété de mise en forme, elle permet aussi des effets spéciaux.. opacity.. Transparence et superposition.. transition.. Des effets graphiques  ...   Comment réaliser des boutons pour l'interface d'un site, et démonstration d'une barre de boutons.. Table HTML d'apparence professionnelle.. Sans framework, avec une fonction JavaScript.. Liste personnalisée.. Les listes peuvent devenir des éléments graphiques pour enrichir une page Web.. Menu Apple.. C'est une autre application du menu auquel on donne un style.. Blockquote.. Les citations mises en relief, retrait simple, ou rendu plus élaboré comme le phylactère en face à la photo de l'auteur.. Bordure avec texture.. Comment attribuer une texture aux cadres entourant les boites de texte ou les images.. Ajouter de nouveaux éléments à HTML avec seulement du CSS et sans JavaScript.. Lightbox CSS.. Une lightbox sans JavaScript.. Galerie d'images déroulantes sans JavaScript.. Présente une série d'images dans une fenêtre.. Graphe en barres.. Compléter simplement une page avec un graphe en barres, sans framework.. Histogramme.. Version spécialisée du graphe avec des années (ou autres libellés de taille identique).. Un concept largement utilisé par Apple, avec succès.. Un nouveau type d'interface utilisateur pourrait, combiné avec le commande vocale, rendre l'utilisation des logiciels beaucoup plus simple.. Compatibilité.. La spécification CSS 2.. 0 du W3C est implémentée par tous les navigateurs actuels.. La version 3 est en cours d'implémentation.. Elle l'est entièrement par Safari 4.. Des éléments de CSS3 peuvent être ajoutés aux styles des pages actuelles avec une définition alternative non standard pour Internet Explorer.. Compatibilité dans IE6 et IE7.. Compatibilité des navigateurs.. (Anglais).. Lien externe.. Montre l'implémentation dans les navigateurs.. 2009-2012 Xul..

    Original link path: /css/
    Open archive

  • Title: HTML 5, plateforme de sites et applications en ligne
    Descriptive info: Canvas.. Option.. Table.. Menu.. Div et span.. FileReader.. Video.. SessionStorage.. Applications Web.. Application Web.. Construire une RIA.. Tutoriels et formats.. Tutoriel JavaScript.. HTML 5, plateforme de sites et applications en ligne.. Pour succéder à HTML 4 qui est le format des pages Web actuel, le W3C qui établit les standards du Net à repris une spécification en cours du WHATWG.. Ce nouveau format qui est implémenté progressivement par tous les navigateurs y compris Internet Explorer, est conçu pour les applications Web et ajoute à la fois des balises et des fonctionnalités nouvelles, c'est devenu une.. alternative à Flash et Silverlight.. Steve Jobs a dit pour Apple:.. Apple ne supporte pas Flash parce qu'il est trop bogué.. Chaque fois qu'un Mac plante, le plus souvent c'est à cause de Flash.. Personne n'utilisera plus Flash.. Le Monde est en train de se tourner vers HTML 5.. (Apple Town Hall Meeting, fin Janvier 2010).. Des capacités très étendues pour les applications Web.. Utiliser les applications Web hors ligne est la tendance majeure dans ce domaine depuis 2008.. Un framework, Gears, avait été créé pour cela par Google maintenant remplacé par les fonctions équivalentes dans HTML.. En mode déconnecté les pages et objets qu'elles affichent sont mises en cache et une base SQL locale stocker localement les données pour dupliquer la base distante.. De nouveaux composants graphiques ont  ...   balises de structure introduite avec HTML 5.. Doctype.. Lequel choisir?.. Différences dans leur utilisation pratique.. Bouton radio.. Les groupes de cases à cocher dans un formulaire ou en Ajax.. Pour créer des menus contextuels ou des barres d'outils.. La balise et les balises internes.. InnerHTML.. Ajouter dynamiquement du contenu à une page.. Les attributs DOM équivalents.. Commentaire.. Balise standard et expressions conditionnelles.. Iframe.. Pour un contenu dynamique ou isolé de la page.. Charger un texte ou une image sur le système de fichiers local.. La balise canvas est une surface dans laquelle s'affichent des objets graphiques vectoriels ou bitmap ou des widgets d'interface graphique.. Démonstration et test de d'implementation.. La balise video.. Les codecs video pour HTML 5.. Ogg, WebM, H.. 264 et leur implémentations.. Les applications de HTML 5.. Problèmes de sécurité avec HTML 5.. HTML 5 comme interface d'ordinateur.. Exemples d'applications.. Les balises HTML 5 sur Internet Explorer.. Les spécifications.. Le format est divisé en plusieurs spécifications.. Mais qui donc définit HTML 5?.. Le format de milliards de pages est-il décidé par une seule personne?.. XUL vs HTML 5.. XUL permet d'intégrer du code HTML et est donc un moyen ajouter du code natif à une application HTML 5.. HTML 5 sur Firefox 3.. 5.. Parmi les nombreuses évolutions du navigateur, un support plus complet de HTML 5.. Pour utiliser HTML 5..

    Original link path: /html5/
    Open archive

  • Title: L'environnement Firefox, Gecko et XUL
    Descriptive info: Gecko XUL.. Extensions Firefox.. Chromeless.. Firefox OS.. Applications immersives.. Tutoriels.. Manuel de XUL.. Introduction à RDF.. Références.. Ressources.. L'environnement Firefox, Gecko et XUL.. L'environnement XUL est constitué de Gecko, XULRunner et Firefox.. - Firefox: navigateur Web, fait fonctionner les applications dont l'interface est écrite en langage XUL, mais qui peut aller au delà, notamment avec l'édition Prism qui affiche les applications web sur le bureau.. - Gecko: c'est le moteur d'affichage HTML, il supporte partiellement HTML 5.. - XULRunner est l'interpréteur de code XUL, il est intégré à Firefox pour présenter son interface propre, elle-même écrite en XUL, mais aussi l'interface des applications Web ou locales.. Si elles fonctionnent dans les deux cas sous Firefox, les applications locales en sont dispensées.. Firefox: Extensions pour développeurs.. Elles servent principalement à faire connaître l'état et le contenu des transactions avec le serveur et donc à déboguer Ajax et JavaScript.. Cloudlet, un assistant pour Google.. Cette extension complète la recherche dans les moteurs avec un nuage de tags, dont l'intérêt est manifeste.. Extensions primées au concours Firefox 2.. Le jury auquel participait Jesse James Garrett  ...   Web.. Les nouvelles fonctionnalités du navigateur et le support de HTML 5 pour les applications Web.. La seconde partie évoque le mode déconnecté sous Firefox.. Prefetch: une fonction de chargement anticipé.. est cachée dans Firefox.. Firefox OS, le Web sans Windows.. Mozilla veut inspirer le Web et les éditeurs de navigateur pour rendre les applications plus complètes.. XUL peut-il profiter du nouveau départ de l'interface Metro sous Windows 8, pour offrir une alternative à Microsoft?.. Des applications Web sur le bureau.. Prism, un lanceur d'applications Web.. sur le bureau est remplacé par Chromeless.. Chromeless ou Chrome?.. Comparaison des deux outils, lequel convient le mieux pour faire fonctionner des applications web localement?.. Logiciels basés sur XUL, Gecko et XULRunner.. Spicebird, une suite de communication.. Ce logiciel intègre plusieurs applications open source en une seule.. Pourquoi utiliser Seamonkey?.. La suite Internet comporte un éditeur HTML et tous les outils de communication du Web.. Flock, navigateur et éditeur de blog.. (maintenant abandonné).. Le navigateur était un outil du Web social et rend la gestion de flux et l'édition de blog plus faciles parmi d'autres fonctions..

    Original link path: /gecko/
    Open archive

  • Title: Tutoriel XUL pour une interface graphique XML
    Descriptive info: Sommaire.. Programme.. Boites.. Bouton.. Textbox.. Images.. Listbox.. Toolbar.. Progression.. Tree.. HTML.. Style.. Event.. Composant.. Application.. Ajax et XUL.. 0.. RSS.. Tutoriel XUL avec exemples.. Apprenez XUL pour construire des interfaces utilisateurs graphiques avec des balises XML.. Le tutoriel se lit en suivant d'abord l'ordre des chapitres de premier niveau.. Puis on pourra approfondir en lisant les chapitres qui leur sont attachés et mis en retrait.. Présentation générale du langage XUL et son environnement.. Premier programme.. Installer XUL.. Ouvrir une fenêtre XUL dans une page HTML.. Les boites.. Organiser le contenu d'une interface graphique.. Grid.. Organisation sous forme de table.. Groupbox.. Boite dotée d'un cadre.. Stack.. Surimposer des éléments.. Spacer et flex.. Séparer les éléments.. Tabbox.. Créer des pages accessibles par onglets.. Bouton et JavaScript.. Comment définir un bouton et lui assigner du code.. Le champ d'entrée de texte et son utilisation.. Placer des images sur la page ou dans les composants.. Pour afficher une liste ou un tableau.. Créer le menu de votre application.. Ajouter une barre d'outils.. Barre de progression.. Suivre l'avancement d'une tâche.. Créer une liste hiérarchique comme celle des favoris.. Votre code HTML peut être réutilisé dans un programme  ...   logiciels en tout langage de programmation.. Les outils pour développer une application XUL.. Ample SDK.. est un framework JavaScript pour utiliser le langage XUL dans le navigateur afin de construire l'interface d'une application portable.. Les widgets sont suffisamment nombreux pour avoir l'équivalent d'une interface Java.. XUL Explorer.. est une application graphique pour expérimenter les composants XUL.. Tapez ou insérez des composants dans l'éditeur et vous pourrez immédiatement étudier le résultat.. (Note: Il faut changer la version max de gecko dans application.. ini au besoin pour la 1.. 9).. Xul light est un code XUL sans crochets, plus lisible, que l'on peut intégrer dans le source d'un programme écrit en Scriptol.. XML light peut offrir des possibilités descriptives supérieures à celles des classes.. Exemple de.. source scriptol.. Le code.. généré par le compilateur scriptol à partir du source.. XULRunner.. est le runtime qui est requis pour faire tourner et afficher des applications XUL.. Lire les instructions d'.. installation.. de votre application sur ce site.. XPCom.. fait le lien entre des modules binaires écrits en C++ ou autre et l'interface XUL dont le code JavaScript est limité.. 2007-2012.. - Denis Sureau.. Tous droits réservés..

    Original link path: /tutoriel/
    Open archive

  • Title: Tutoriel Ajax en exemples
    Descriptive info: Asynchronous Javascript + XML.. La création de pages web dynamiques coté client.. Ajax est seulement un nom donné à un ensemble de techniques préexistantes.. Il dépend essentiellement de.. , un objet coté client utilisable en JavaScript, qui est apparu avec Internet Explorer 4.. XMLHttpRequest a été conçu par Mozilla sur le modèle d'un objet ActiveX nommé XMLHTTP créé par Microsoft.. Il s'est généralisé sur les navigateurs après que le nom Ajax ait été lancé par un.. article de J.. J.. Garrett.. Pourquoi utiliser Ajax?.. Comment cela fonctionne?.. L'objet XMLHttpRequest.. Construire une requête, pas à pas.. Créer une instance.. Attendre la réponse.. Faire la requête.. Exemples de pages Ajax.. Lire un texte.. Lire dans un fichier XML.. Ecrire dans la page.. Envoyer un texte.. Utiliser un fichier externe.. Comment faire un site Ajax?.. Inconvénients d'Ajax.. Téléchargement.. Référence et ressources.. Ajax permet de modifier partiellement la page affichée par le navigateur pour la mettre à jour sans avoir à recharger la page entière.. Par exemple le contenu d'un champ de formulaire peut être changé, sans avoir à recharger la page avec le titre, les images, le menu, etc.. Ajax est une technique qui fait usage des éléments suivants:.. HTML pour l'interface.. CSS (Cascading Style-Sheet) pour la présentation de la page.. JavaScript (EcmaScript) pour les traitements locaux, et DOM (Document Object Model) qui accède aux éléments de la page ou du formulaire ou aux éléments d'un fichier XML chargé sur le serveur.. L'objet XMLHttpRequest lit des données ou fichiers sur le serveur de façon asynchrone.. PHP ou un autre langage de scripts peut être utilisé coté serveur.. Le terme Asynchronous , asynchrone en français, signifie que l'exécution de JavaScript continue sans attendre la réponse du serveur qui sera traitée quand elle arrivera.. Tandis qu'en mode synchrone, le navigateur serait gelé en attendant la réponse du serveur.. Dynamic HTML est aussi un ensemble de techniques, qui comprend: HTML, CSS, JavaScript.. Cela permet de modifier le contenu d'une page selon les commandes de l'utilisateur, à partir de données préalablement fournies ou avec un texte tapé par l'utilisateur.. Ajax est DHTML plus l'objet XHR pour communiquer avec le serveur.. Pour recueillir des informations sur le serveur l'objet XHR dispose de deux méthodes:.. open.. : établit une connexion.. send.. : envoie une requête au serveur.. Les données fournies par le serveur seront récupérées dans les champs de l'objet XMLHttpRequest:.. responseXml.. pour un fichier XML ou.. responseText.. pour un fichier de texte bru.. Il faut attendre la disponibilité des données, et l'état est donné par l'attribut.. readyState.. de XMLHttpRequest.. Les états de.. sont les suivants (seul le dernier est vraiment utile):.. 0: non initialisé.. 1: connexion établie.. 2: requête reçue.. 3: réponse en cours.. 4: terminé.. Elle permet d'interagir avec le serveur, grâce à ses méthodes et ses attributs.. Attributs.. le code d'état passe successivement de 0 à 4 qui signifie prêt.. status.. 200 est ok.. 404 si la page n'est pas trouvée.. contient les données chargées dans une chaîne de caractères.. contient les données chargées sous forme XML, les méthodes de DOM servent à les extraire.. onreadystatechange.. propriété activée par un évènement de changement d'état.. On lui assigne une fonction.. Méthodes.. (mode, url, boolean).. mode: type de requête, GET ou POST.. url: l'endroit ou trouver les données, un fichier avec son chemin sur le disque.. boolean: true (asynchrone) / false (synchrone).. en option on peut ajouter un login et un mot de passe.. ( chaine ).. null pour une commande GET.. Première étape: créer une instance.. C'est juste une instance de classe classique mais deux options à essayer pour compatibilité avec les navigateurs.. if (window.. XMLHttpRequest) // Objet standard { xhr = new XMLHttpRequest(); // Firefox, Safari,.. } else if (window.. ActiveXObject) // Internet Explorer { xhr = new ActiveXObject("Microsoft.. XMLHTTP"); }.. ou plus simplement, on peut utiliser les exceptions:.. try { xhr = new ActiveXObject("Microsoft.. XMLHTTP"); // Essayer IE } catch(e) // Echec, utiliser l'objet standard { xhr = new XMLHttpRequest(); }.. Seconde étape: attendre la réponse.. Le traitement de la réponse et les traitements qui suivent sont inclus dans une fonction, et la valeur de retour de cette  ...   l'utilisateur grâce à un formulaire.. Démonstration.. Reçu:.. Pour lire des données dans un fichier XML il suffit de remplacer la ligne:.. document.. dyn= Reçu: + xhr.. responseText;.. par ce code:.. // Assigner le fichier XML à une variable var doc = xhr.. responseXML; // Lire le premier élément avec DOM var element = doc.. getElementsByTagName('root').. item(0); // Copier le contenu dans le formulaire document.. dyn.. value= element.. firstChild.. data;.. Le texte récupéré est inscrit dans le corps de la page et non dans un champ de texte.. Le code ci-dessous remplace l'objet de formulaire textfield et la seconde partie remplace l'assignement dans la fonction JavaScript.. div id= zone.. un texte à remplacer.. /div.. getElementById("zone").. innerHTML = "Received:" + xhr.. Attendre.. Un texte est envoyé au serveur et sera écrit dans un fichier.. L'appel de la méthode open change, le premier argument est POST, le second est le nom du fichier ou du script qui recevra les données et doit les traiter.. Et la méthode send aussi a pour argument une valeur qui est une chaîne de paramètres.. open("POST", "ajax-post-text.. php", true); xhr.. setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); xhr.. send(data);.. L'argument de send est au format des paramètres de la méthode POST.. S'il y a plusieurs données, on les sépare par le symbole et commercial:.. var data = file= + url + content= + content;.. Le paramètre file est un fichier qui contiendra le contenu content.. Le nom du fichier doit être vérifié par le serveur pour éviter qu'un autre fichier ne puisse être modifié.. Une démonstration de POST est incluse dans l'archive.. Il est plus simple d'inclure un fichier JavaScript.. Cette ligne sera incluse dans la section head de la page HTML:.. script src= ajax.. js type= text/javascript /script.. Et la fonction est appelée avec cette instruction:.. var xhr = createXHR();.. Le script du fichier externe:.. function createXHR() { var request = false; try { request = new ActiveXObject('Msxml2.. XMLHTTP'); } catch (err2) { try { request = new ActiveXObject('Microsoft.. XMLHTTP'); } catch (err3) { try { request = new XMLHttpRequest();} catch (err1) { request = false;} } } return request; }.. Il faut une interface prédéfinie, comme celles qui sont indiquées dans les liens plus bas.. Puis votre programme JavaScript, intégré dans une page web, et accédant par leur nom ou leur identifieur aux éléments de la page, envoie des requêtes au serveur pour obtenir un fichier.. Celui-ci est exploité par les méthodes de DOM, et la page mise à jour sur le poste client, de façon fluide et instantanée.. - Si JavaScript est désactivé, Ajax ne peut fonctionner.. Il faut demander au lecteur de l'activer parmi les options du navigateur.. - Si l'on charge les données à afficher de façon dynamique, elles ne font pas partie de la page et sont ignorées par les moteurs de recherche et donc non indexées.. - L'aspect asynchrone fait que les modifications se font avec un délai (si le traitement sur le serveur est long), ce qui peut être déconcertant d'autant que le résultat peut arriver après les instructions qui font appel au serveur.. - Le bouton de retour en arrière peut se trouver désactivé (ce n'est pas le cas dans les exemples fournis ici).. Cela peut être corrigé et cela plus facilement avec HTML 5.. Demonstrations et code source.. Les démonstrations de la page dans des fichiers individuels et la démonstration de POST.. On peut les tester localement avec un serveur local comme Wamp.. Références.. Ajax se fonde sur ces spécifications par le W3C:.. XML 1.. 1.. HTML 4.. DOM 2.. CSS 2.. ECMAScript 1.. (Standard de JavaScript par ECMA).. Spécification de.. par le W3C.. Mais a été décrit pour la première fois dans cet article:.. L'article de Jesse James Garett.. qui a lancé le nom Ajax (traduction française).. Compléments.. Le second format de données pour Ajax.. Répertoire ODP.. consacré à Ajax.. Etude de l'interaction avec un script PHP par les commandes GET et POST.. Firebug.. Extension Firefox pour déboguer Ajax.. Anaa.. Un framework simple basé sur ce tutoriel.. NetBeans.. Un IDE pour réaliser des applications Ajax.. Cadres d'applications (frameworks).. Voir.. Les cadres d'application Ajax.. 2006-2012 Denis Sureau..

    Original link path: /xml-ajax.html
    Open archive

  • Title: L'objet XMLHttpRequest, description et utilisation
    Descriptive info: Description basée sur la spécification du W3C avec un mode d'emploi.. Cet objet s'utilise en JavaScript pour échanger des données avec le serveur au format texte, XML ou JSON.. Les fichiers XML sont automatiquement parsés par l'objet et accessibles par les méthodes du.. Les fichiers JSON sont parsés par la commande eval() de JavaScript.. Court historique.. Attributs.. Comment utiliser XMLHttpRequest.. Le problème de mémoire cache.. Le problème des accents.. Le format HTML.. Demos.. Spécification et évolution du standard.. XMLHttpRequest, a été d'abord implémenté dans Internet Explorer depuis la version 4.. Ce concept s'appelait XMLHTTP dans les premiers temps, avant qu'Ajax ne devienne le nom le plus communément utilisé.. L'emploi de XMLHttpRequest en 2005 par Google, dans Gmail et GoogleMaps a contribué au succès de ce format.. XHR est une classe qui est reconnue par tous les navigateurs actuels et par le langage de programmation fonctionnant coté client JavaScript.. Pour chaque requête au serveur, une nouvelle instance est créée par l'appel du constructeur.. La méthode.. démarre la connexion, en mode lecture ou écriture, pour recevoir des données du serveur ou lui en envoyer.. Ce sera traité sur le serveur par un langage coté serveur comme PHP, Java, etc.. La connexion passe par plusieurs états successifs qui sont assignés à l'attribut readyState de l'objet.. Quand l'état final est atteint, les données peuvent être récupérées dans un autre attribut.. Elles sont du texte pur ou un document XML.. Le format JSON est aussi reconnu.. Plus de détails sur l'utilisation de la classe dans le.. tutoriel Ajax.. Le rôle des attributs de la classe est de se voir assigner l'état de la connexion, et les données reçues.. unsigned short readyState.. Le code change successivement de valeur jusqu'à ce que le serveur soit prêt de, passant de 0 à 4.. 0 Non initialisé.. 1 Ouvert.. 2 Envoyé.. 3 Reçu.. 4 Chargé.. unsigned short status.. DOMString statusText.. Contient le libellé de l'état, correspondant au code d'état.. DOMString responseText.. Contient les données chargées, au fur et à mesure, sous forme de chaine de caractères.. Elle est complètement remplie quand l'état vaut 4.. document responseXml.. Contient un fichier XML chargé, et les méthodes de DOM permettront d'en extraire les données.. Elle est assignée seulement au moment ou l'état est 4, et vaut null avant.. EventListener onreadystatechange.. Invoqué quand readyState est assigné.. Méthodes.. Outre le constructeur, la classe a deux méthodes principales,.. pour créer la session et désigner le fichier distant, et.. pour tranférer les données sur le serveur.. abort().. Restaure l'objet et stoppe toute activité créée par l'objet.. getAllResponseHeaders().. Retourne tous les en-têtes dans une  ...   catch (e2) { try { xhr = new ActiveXObject("Microsoft.. XMLHTTP"); } catch (e) {} } } xhr.. onreadystatechange = function() { document.. value="Wait server.. "; if(xhr.. status == 200) { document.. value="Received:" + xhr.. responseText; } else { document.. value="Error: returned status code " + xhr.. status + " " + xhr.. statusText; } } }; xhr.. open("GET", "data.. xml", true); xhr.. send(null); } /script /head body FORM method= POST name= ajax action= INPUT type= submit value= Submit ONCLICK= submitForm() INPUT type= text name= dyn value= /FORM /body /html.. L'anté-mémoire fonctionne mal avec l'objet.. Le fichier chargé par la méthode GET n'est pas toujours la dernière version mais le plus souvent une version conservée en mémoire cache.. Si le fichier n'est pas trop gros, cela peut se résoudre en ajouter un paramètre à la commande.. Remplacer:.. xml", true);.. par:.. xml?nocache=" + Math.. random(), true);.. L'encodage doit rester celui de la page HTML qui envoie les requêtes.. Sous Apache, cela nécessite éventuellement une petite reconfiguration: modifier la variable suivante dans.. httpd.. conf.. :.. AddDefaultCharset Off.. Puisque l'on peut charger des fichiers XML, peut-on aussi charger des fichiers HTML ou XHTML? En fait cela est prévu seulement pour la prochaine version de la spécification de XMLHttpRequest, de même que l'accès aux document sur d'autres sites Web que celui du serveur.. Il est prévu que dans ce cas, le type mime sera text/html tandis qu'il est text/xml pour les documents XML, dans l'en-tête de type de contenu.. En attendant, il existe une solution de remplacement avec un pseudo.. attribut responseHTML.. , qui est donnée sur ce site.. Une petite démo utilise la.. méthode HEAD.. pour lire les en-têtes d'une page Web.. Une autre démo montre les.. états successifs de readyState.. D'autres démos sont disponibles dans la section ressources ci-dessous.. Spécification et évolution du standard.. , document de travail.. La traduction française est faite par Xul.. Le W3C travaille sur une nouvelle spécification de l'objet nommée.. XMLHttpRequest Level 2.. Parmi les nouvelles fonctionnalités offertes, citons les requêtes entre sites différents, les évènements progressifs, et la prise en charge de flux binaires en envoi et réception.. A coté de l'objet XMLHttpRequest lui-même, le W3C a établi une spécification pour les échanges entre sites nommée Access Control.. Toutefois Microsoft a choisi de ne pas supporter ce protocole et propose à la place, dans Internet Explorer 8, le nouvel objet.. Celui-ci remplacera ou non XHR, cela dépend des fonctionnalités qu'il offrira dans la version finalisée.. Syntaxe et études de cas utilisant Ajax.. Création de pages web dynamiques en utilisant XMLHttpRequest et JavaScript.. Démonstrations utilisant XMLHttpRequest..

    Original link path: /Objet-XMLHttpRequest.html
    Open archive

  • Title: Cadre d'application Ajax: JavaScript, PHP, DOTNET...
    Descriptive info: Les cadres d'applications Ajax.. La meilleure technique pour construire des pages web dynamiques est.. Le code JavaScript imbriqué dans la page est utilisé pour envoyer des requêtes au serveur et pour modifier la page.. Du coté serveur, des traitements sont nécessaires pour répondre aux requêtes: trouver les informations, ou enregistrer des données.. Pour cela on a besoin d'un cadre d'application spécialisé.. Il se compose toujours de fonctions JavaScript, et éventuellement d'une bibliothèque coté serveur.. Il en existe dans de nombreux langages de programmation et sous différents environnement, mais seuls les principaux sont pris en compte ici.. Pourquoi un framework?.. Fonctionnalités d'un framework Ajax.. Quel framework choisir?.. Bibliothèques JavaScript.. Frameworks PHP.. Frameworks Java.. Frameworks.. NET.. Ajax et XUL.. Au-delà d'Ajax.. Plus d'informations.. Le framework est en fait le moteur dont parle l'article de J.. Garrett, qui supprime l'attente du lecteur envers le serveur.. Il fournit les fonctions classiques JavaScript pour utiliser l'objet XMLHttpRequest, pour tous les navigateurs, et toutes les fonctions d'interaction avec le serveur.. En fait, certains frameworks peuvent aller plus loin et permettre de créer ce que l'on appelle des applications clients riches , des applications fonctionnant à distance, sur un navigateur, dotée d'une interface graphique et des mêmes fonctionnalités qu'une application locale.. Tous les frameworks sont capables de communiquer avec le serveur, donc de lire des fichiers, d'envoyer des données ou de passer des commandes à exécuter sur le serveur, ce qui suppose l'emploi d'un script coté serveur.. Les frameworks proposent souvent des composants qui tirent parti de la communication asynchrone avec le serveur.. Les exemples classiques sont les bouton, panels à ongles, grilles, listes déroulantes et autres widgets.. Un exemple plus innovateurs, les box tendent à se répandre, avec comme exemples Lightbox et Slimbox.. Ce sont des galeries d'images qui les placent côte à côte à l'écran et utilisent Ajax pour un affichage instantané.. Les frameworks peuvent être commandés du coté du serveur et dans ce cas, les composants sont créés sur le serveur avec un langage de scripts comme PHP et envoyés au navigateur.. Ajax sert à transmettre les actions de l'utilisateur et prendre en charge les résultats.. La capacité de fonctionner hors-ligne, comme cela est permis par HTML 5 complète le framework aussi bien.. Quel framework Ajax choisir?.. Si l'on veut utiliser un framework Ajax pour faire des pages dynamiques sans avoir a réécrire soi-même toutes les fonctions Ajax et les tester sur tous les navigateurs reste à choisir quel framework!.. Ils sont si nombreux que l'on se demande lequel utiliser.. Si l'on se trompe dans mon choix on sera obligé plus tard de refaire ses pages avec un framework différent!.. On a moins de chance de regretter le choix d'un framework si l'on adopte un des plus utilisés car ils sont continuellement complétés de nouvelles extensions et disposent d'un support important par les utilisateurs.. Parmi ceux-ci, on peut distinguer jQuery, bien documenté, Mootools qui est modulaire, Ext JS qui offre de nombreux widgets de RIA.. L'interaction avec un langage coté serveur guidera aussi le choix.. Un grand nombre de frameworks sont constitués en fait uniquement de fonctions JavaScript, et laisse la partie serveur au soin du programmeur.. La plupart d'entre eux utilisent XML comme format de données, et quelquefois JSON, un autre format textuel.. Une librairie JavaScript s'utilise simplement à partir d'une page Web avec une balise de la forme:.. script src= prototype.. Cette balise inclut le fichier prototype.. js contenant les fonctions JavaScript dans la page et les rend accessible au navigateur.. jQuery.. Librairie JavaScript qui contient Ajax.. Alternative populaire à Script Aculo mais avec un code plus léger.. JQuery est intégré aux CMS Wordpress et Drupal.. jQuery offre la.. documentation.. la plus complète.. La version 1.. 3.. 2 est  ...   par des tiers pour l'interaction par XMLHttpRequest.. Yahoo UI.. Librairie du moteur de recherche Yahoo.. Elle inclut des ressources CSS.. Plutôt imposante, c'est une combinaison de Script Aculous et de Ext JS ou comme jQuery UI un ensemble de widgets au-dessus d'un framework de bas niveau.. Une librairie simple pour un GET ou POST avec callback.. Implémente.. , dispose de l'extension.. Anaa est un framework.. minimal.. , il permet les opérations de lecture et écriture, et peut se combiner avec toute bibliothèque JavaScript.. Il convient pour apprendre Ajax et pour l'ajout occasionnel de fonctionnalités asynchrones.. Coté serveur, il serait possible au programmeur d'utiliser les fonctions et classes PHP pour répondre aux requêtes du navigateur.. PHP 5 notamment dispose de la classe SimpleXML qui facilite le chargement d'un fichier XML et l'accès au contenu ainsi que les modifications.. Cela nécessite des connaissances spéciales, et l'écriture de fonctions nouvelles, c'est pourquoi l'usage d'un framework peut faciliter la tâche.. Tiny Ajax.. Une petite classe en PHP 5.. Java est le langage le plus utilisé par les entreprises qui proposent des services web.. L'utilisation d'un framework permet alors d'ajouter aux services les avantages que procure Ajax: modification instantanée de la page et utilisation de fichiers XML pour échanger de l'information.. Les frameworks les plus communs, propres à java sont:.. DWR (Direct Web Remoting).. Il permet au code dans une page HTML, grâce à son interface, d'utiliser des fonctions Java comme si le langage faisait partie du navigateur.. Il propose en JavaScript une partie pour la mise à jour de la page et une autre pour obtenir les données par des.. servlets.. Le principe consiste à générer en temps réel du code Java à partir de code JavaScript, l'envoyer au serveur et l'exécuter.. Google Web Toolkit.. Une boite à outils pour développer des applications en Java, lesquelles seront compilées en code JavaScript, qui opère sur la page HTML en utilisant le DOM.. Il est aussi possible d'utiliser JavaServer Faces qui propose maintenant des possibilités propres à Ajax.. Le framework ThinWire permet d'écrire une application Web comme s'il s'agissait d'une application locale, le framework gérant l'interaction avec le navigateur.. Microsoft Ajax Library.. (anciennement ATLAS), se compose d'une partie coté client:.. , et d'une partie coté serveur:.. ASP.. NET 2.. 0 Ajax Extensions,.. à quoi s'ajoute une librairie de composants, notamment graphiques:.. NET Ajax Control Toolkit.. NET Professional.. sérialise (enregistre en les convertissant) les données.. NET au format textuel JSON.. Ajax est fondé sur JavaScript, et XUL insère aussi du code JavaScript dans le code XML pour définir l'interaction d'une interface graphique.. Les deux systèmes fonctionnent sur le navigateur Mozilla.. Le premier fait interagir une page web avec des programmes sur le serveur et le second affiche une interface soit sur un poste local soit sur un poste distant avec le navigateur.. La principale différence est dans l'utilisation de Canvas (balise HTML) pour étendre Ajax, et pour étendre XUL, XPCom et XBL.. Certains développements en cours vont renforcer l'importance d'Ajax sur le Web en fournissant des standards pour les applications Web riches, principalement.. , qui ajoute des fonctionnalités d'applications à HTML et qui permet de faire fonctionner les applications Web hors connexion.. Voir les.. bibliothèques JavaScript pour réaliser des applications Web.. Le tutoriel Ajax.. Apprendre Ajax et XMLHttpRequest avec des exemples.. Une description de ce format de données alternatif à XML.. Ajax API library.. Google centralise le chargement d'un framework aux choix parmi les plus populaire et s'engage à tenir indéfiniment à disposition en ligne.. Cela semble devoir ralentir le chargement de faire appel à un site extérieur, mais si le code JavaScript est mis en cache, comme c'est normalement le cas, cela pourrait au contraire l'accélérer.. Frameworks HTML 5.. APIs JavaScript utilisant Canvas.. 2006-2012..

    Original link path: /ajax-librairies.html
    Open archive

  • Title: Demos Ajax - Scripts montrant diverses utilisations possibles
    Descriptive info: Démos Ajax.. Plusieurs démonstrations d'Ajax et de l'objet XMLHttpRequest.. Chaque démo est une page HTML qui contient le code JavaScript et le formulaire utilisé pour interagir avec le script.. Elles utilisent toutes un fichier JavaScript à inclure,.. ajax.. js.. qui crée une instance de l'objet, et l'assignent à la variable xhr.. Vous êtes libre d'utiliser le code de ces démos comme templates pour les pages de votre propre site web (voir licence en bas).. Lire un fichier.. Lit le fichier de texte.. ajax-get.. txt.. sur le serveur et en affiche le contenu sur la page, dans la balise zone , ci-dessous.. C'est un script minimal qui utilise la méthode GET et vérifie seulement la valeur de readyState, et pas celle de status.. Ce code très simple peut fonctionner localement.. Code.. function submitForm() { var xhr=createXHR(); xhr.. open("GET", "ajax-get.. txt",true); xhr.. onreadystatechange=function() { if(xhr.. readyState == 4) { document.. innerHTML= xhr.. responseText; } }; xhr.. send(null); }.. FORM name= ajax method= POST action=.. input type= BUTTON value= Soumettre onClick= submitForm() /FORM.. div id= zone /div.. Valeurs de readyState.. Cette propriété de XMLHttpRequest contient les valeurs successive, en partant de 1, et finissant à 4 quand l'échange est terminé.. Cette démo aide à comprendre comment l'objet fonctionne.. Les valeurs de readyState doivent être successivement 1, 2, 3 and 4.. Code:.. function submitStates(url) { xhr=createXHR(); var zone = document.. getElementById("zoneStates"); zone.. innerHTML="Started.. "; xhr.. open("GET", url, true); xhr.. onreadystatechange=function() { if (xhr.. readyState == 4) { zone.. innerHTML += xhr.. readyState; if (xhr.. status == 200) { zone.. innerHTML += "Completed.. "; document.. getElementById("datafield").. responseText; } else { alert("Error " + xhr.. status); } } else { zone.. readyState; } }  ...   valeurs prises dans un document XML.. Charge le fichier.. ajax-form.. xml.. et écrit son contenu dans les champs du formulaire.. function processData(doc) { var element = doc.. getElementsByTagName('one').. item(0); document.. form1.. one.. data; document.. two.. value= doc.. getElementsByTagName('two').. item(0).. three.. getElementsByTagName('three').. data; } function submitXML() { var xhr=createXHR(); xhr.. open("GET", "ajax-form.. xml",true); xhr.. status == 200) { processData(xhr.. responseXML); } else { alert("Error: returned status code " + xhr.. statusText); } } }; xhr.. FORM name= form1 method= POST action=.. INPUT type= BUTTON value= Remplir ONCLICK= submitXML() INPUT type= text name= one size= 32 value=.. INPUT type= text name= two.. INPUT type= text name= three.. Lire une autre page HTML.. Cette démo crée utilise l'équivalent d'un.. qui manque à l'objet XMLHttpRequest (à coté de responseText et responseXML), et se compose d'une fonction JavaScript et d'une balise.. Pour disposer de la nouvelle fonction il suffit de copier les trois lignes de code marquées dans le source, et les coller dans la page qui doit charger une autre page HTML.. Fonctionne localement ou sur le Web, et avec tout navigateur.. On charge le fichier.. autrepage.. html.. , le contenu de la section BODY est lu et écrit dans cette page, ci-dessous.. INPUT type= BUTTON value= Charger HTML et lire données ONCLICK= loadWholePage('autrepage.. html') /FORM.. div id= storage style= display:none; /div.. div id= displayed /div.. Code JavaScript.. Autres démos.. Séquence de requêtes GET et POST.. Vous pouvez créer un dialogue avec un programme sur le serveur en Ajax, en enchaînant successivement les requêtes POST, pour envoyer des données, et GET pour lire les réponses.. Cette démo montre comment éviter les pièges du mode asynchrone grâce à l'emploi judicieux des appels des fonctions..

    Original link path: /scripts/demos-ajax.php
    Open archive





  • Archived pages: 735