Using PHP/MySQL with Google Maps - Google Maps API Ben Appleton, Google Geo TeamWith contributions from Lary Stucker, Maps API DeveloperApril 2007 This tutorial is intended for developers who are familiar with PHP/MySQL, and want to learn how to use Google Maps with a MySQL database. After completing this tutorial, you will have a Google Map based off a database of places. The map will differentiate between two types of places—restaurants and bars—by giving their markers distinguishing icons. An info window with name and address information will display above a marker when clicked. The tutorial is broken up into the following steps: Creating the Table When you create the MySQL table, you want to pay particular attention to the lat and lng attributes. Note: This tutorial uses location data that already have latitude and longitude information needed to plot corresponding markers. If you prefer interacting with your database through the phpMyAdmin interface, here's a screenshot of the table creation. Populating the Table Outputting XML with PHP
MySQL Vous avez de nombreuses données à traiter et vous voulez les organiser correctement, avec un outil adapté ? Les bases de données ont été créées pour vous ! Ce tutoriel porte sur MySQL, qui est un Système de Gestion de Bases de Données Relationnelles (abrégé SGBDR). C'est-à-dire un logiciel qui permet de gérer des bases de données, et donc de gérer de grosses quantités d'informations. Il utilise pour cela le langage SQL. MySQL peut donc s'utiliser seul, mais est la plupart du temps combiné à un autre langage de programmation : PHP par exemple pour de nombreux sites web, mais aussi Java, Python, C++, et beaucoup, beaucoup d'autres. MySQL avec l'interface PHPMyAdmin MySQL avec une console windows Différentes façons d'utiliser MySQL Quelques exemples d'applications Vous voulez créer un site web dynamique en HTML/CSS/PHP avec un espace membre, un forum, un système de news ou même un simple livre d'or. Points abordés dans ce tutoriel
Ajax Tutorial - MySQL We already know how to run an external PHP script with AJAX, so let's take it to the next level and pull some data down from a MySQL database. Our "order.html" file and PHP script will have to be updated and we also need to make a new database. To clearly illustrate how easy it is to access information from a database using Ajax, we are going to build MySQL queries on the fly and display the results on "order.html". Create a new database or use an existing one and then import the table ajax_example.sql to that database. This sql file will create the table ajax_example and insert all the data rows. The table has four columns: ae_name - The name of the person ae_age - Person's age ae_sex - The gender of the person ae_wpm - The words per minute that person can type We want to be able to build queries from our HTML file, so there are a few form elements that will need to be added. Maximum Age (Text Input) - Let the user select the maximum age to be returned. order.html HTML/Javascript Code: <?
SQL Avant d'utiliser les jointures, il faut que votre base de données relationnelle soit correctement conçue. Vous apprendrez dans cette partie quelques règles de base (loin d'être exhaustives) dans la conception des bases de données. Pour ce faire, utilisons un exemple. Citation Vous êtes informaticien dans une agence de presse et vous devez stocker les articles des journalistes de l'agence dans une base de données relationnelle. Ces règles n'étant pas faciles à comprendre de prime abord, appliquons-les à notre exemple. On aurait a priori tendance à créer une table "articles" ayant la structure suivante (notez l'absence de caractères spéciaux, d'espaces et d'accents dans les noms des champs) : Ce qui donne, avec quelques données (exemple) : On remarque cependant qu’il y a répétition des informations sur l'auteur. On va donc créer une table "auteurs" en relation avec la table "articles" pour éviter d'avoir une répétition inutile de toutes les informations sur les auteurs. Mise en pratique :
Tutoriel Ajax en exemples Asynchronous Javascript + XMLLa 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 XMLHttpRequest, un objet coté client utilisable en JavaScript, qui est apparu avec Internet Explorer 4.0. 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. Pourquoi utiliser Ajax? Ajax permet de modifier partiellement la page affichée par le navigateur pour la mettre à jour sans avoir à recharger la page entière. Ajax est une technique qui fait usage des éléments suivants: HTML pour l'interface. 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. Dynamic HTML est aussi un ensemble de techniques, qui comprend: HTML, CSS, JavaScript. Attributs
Tips Facebook: Comment récupérer un access_token pour accéder à la Graph API Vous l’avez sans doute constaté, l’API de Facebook a (encore) changé ! Maintenant il vous faudra un « access_token » pour accéder via l’API Open Graph aux données de page Fan. Ainsi, le script que j’avais publié sur la récupération d’informations provenant d’une page Fan ne marche (pour l’instant) plus. Tout d’abord essayons de comprendre la mécanique. Principe Différentes étapes doivent être accomplies afin de pouvoir à nouveau utiliser l’Open Graph API pour les pages fan. s’identifier en tant que développeurcréer une application où l’on va récupérer certaines informations précieuses.autoriser l’application à utiliser les informations facebookrécupérer un access_tokenutiliser cet access_token pour accéder à la Graph API Détails pas à pas S’identifier en tant que développeur Pour cela, rendez-vous sur la page developers.facebook et acceptez de devenir développeur. Créer une application Allez sur la page facebook.com/developers et cliquez sur « Créer une application » en haut à droite.
Les Bugs D'Internet Explorer en CSS - Bug IE 6 - BUG IE 7 - Compatibilité entre navigateurs - Firefox 2 et 3 (esprit-creatif) Internet Explorer 6 est souvent difficile à contrôler et un jeune webmaster peu vite être dérouté par les différences d'affichage qu'il pourra constater entre Internet Explorer 6 (IE 6), Internet Explorer 7 (IE7) et FireFox (FF). Je vais commencer par vous donner quelques conseils pour éviter un maximum de bugs, puis je vais établir ci-dessous une liste des bugs rencontrés sur Microsoft Internet Explorer 6 et le cas échéant la solution à appliquer. J'ajouterai au fur et à mesure de mes heureuses surprises. Pour m'y encourager, laissez-moi un commentaire ou cliquez sur une bannière si cet article vous a aidé ! A. 1# Bien renseigner son doctype Essentiel à la bonne compréhension de votre code, le doctype va donner une clé à IE 6 pour interpréter votre code HTML. Le DOCTYPE se place tout en haut de votre page HTML. Ex: L'importance va être de choisir le doctype adapté. Plus d'informations : Lire l'excellent article de Pompage.net 2# Valider son code HTML et son CSS B.
Empêcher les flottants de dépasser de leur conteneur Par défaut dans les navigateurs, les éléments positionnés grâce à la propriété CSS float (aussi appelés flottants, ou en anglais floats) sortent du flux de leur conteneur. Autrement dit, les flottants «dépassent». C'est ainsi qu'on se retrouve avec des conteneurs qui font zéro pixel de hauteur, des colonnes qui passent à travers un pied de page, et autres résultats peu souhaitables. Par exemple, avec ce code HTML et CSS les «colonnes» flottantes dépasseront de leur conteneur: <div id="conteneur"><div class="colonne">AAA</div><div class="colonne">BBB</div><div class="colonne">CCC</div></div> Comment bloquer ponctuellement le dépassement des flottants? La propriété overflow La propriété CSS overflow définit comment un bloc doit se comporter lorsqu'un contenu dépasse de ce bloc. Cette propriété a aussi pour caractéristique, lorsqu'on utilise les valeurs autres que visible, de créer ce qu'on appelle un contexte de formatage de bloc. Avantage: technique efficace, tient en une ligne.
Loic Le Meur Digital Brittany: Embeddable Facebook Page Photo Gallery I FINALLY got it! I don't even want to admit the time it has taken me to make this code.... But it is finally done! You can find your album ID by looking in the address bar of your browser while viewing your album: Then paste the code to your webpage and viola! Features: •Photos open in new window. This script only works for Facebook Page albums and NOT personal profile albums. SEE ONE IN ACTION! Like it? Touch The Future: Create An Elegant Website With HTML 5 And CSS3 I’m sure that who chooses to work as web designer makes a choice of heart, a choice of love. He/she decides to bet any given day on his creativity and his ability of producing an idea and of making it tangible, visible and perceptible for all. These crazy men have my respect. But, also when the creative side is very important for a work, there exists a logical (and technical) part in all creative process. There are some moments and situations in which the creative mind needs an analytical method to achieve the objective, that is, for us, the creation of a well-done website. In his article on Design Informer titled “Web Design Iterations And Algorithm,” Adit Gupta explains how we can approach a web design work and how a website project can be processed in a number of iterations following a main algorithm. Five macro-steps to build an effective website using brain, pencil, paper, Photoshop, HTML and CSS. How HTML 5 And CSS3 Can Change Web Design Quick Overview On HTML 5 Sketch Your Ideas <!
[PHP] Recuperer des variables | CommentCaMarche J'ai penser à un truc.. bon solution de port tu me dira, mais j'y ai pas réfléchi plus que ca. Voilà ce que je te propose : Tu as ton formulaire avec X input dont les noms sont variables. Ce que tu peux faire tout simplement, c'est créer un tableau de ces noms d'input, tableau que dans lequel tu insere tes valeurs au fur et à mesure que tu pose tes input (donc dans ta boucle, j'imagine). Puis, à la fin de ton formulaire, tu met un champ caché prenant pour valeur ton tableau rempli précédemment. Tu met ton formulaire en POST, et ainsi, au tout début de ta page suivante (celle appellée par le formulaire), tu récupère ton tableau de valeur par POST. Tu as donc maintenant possibilité de connaitre les noms de tes inputs créés dynamiquement :) Afin de pouvoir extraire les valeurs passées en POST à ces input, car il a bien falloir les extraires pour les traiter, il te faut ensuite faire une fonction qui t'extrait les valeurs et les mets dans un tableau. Bon courage :)
Making a jQuery Countdown Timer Martin Angelov When building a coming soon or event page, you find yourself in search for a good way to display the remaining time. A countdown gives the feel of urgency, and combined with an email field will yield more signups for your newsletter. Today we are going to build a neat jQuery plugin for displaying a countdown timer. Let’s start with the markup! The HTML We will give the plugin the creative name of “countdown”. Generated markup In the above example, the plugin has been originally called on a div with an id of countdown. Inside is the markup for the digits. The static class of the digits gives them their gradient background and box-shadow. A jQuery Countdown Timer The .countDiv spans are the dividers between the units. But how is this markup generated exactly? The jQuery First let’s write two helper functions used by the plugin: init generates the markup you saw above;switchDigit takes a .position span and animates the digits inside it; assets/countdown/jquery.countdown.js Great!