Plant’airpur : les plantes pour Geeks

Posté par seiyar81 le 30 mars 2010 | Laisser un commentaire (0)
plantairpur

C’est bien connu, nous pauvres Geeks que nous sommes, restons enfermés toute la journée, sans sortir, sans même ouvrir les fenêtres, tels des Gollums des temps modernes à chérir nos “précieux” ordinateurs.

Comme vous le savez également, bien souvent on est exposé a plus de pollution en intérieur qu’en extérieur. Entre les peintures, moquettes, colles, ondes et autres appareils électriques, on en prend plein la tête et ce aussi bien chez soi qu’au travail. Tout ceci entraînant des symptômes tels les maux de têtes, de la fatigue, voire de l’asthme.

Plant’airpur c’est quoi ?

Plant’airpur est une association loi 1901 qui a pour but, je cite, de “de promouvoir l’utilisation des plantes dans la vie quotidienne comme ayant un rôle déterminant dans la qualité de l’environnement”.

Se basant sur des travaux scientifiques menés d’un côté par la NASA après la mission Skylab 3 en 1973, ainsi que sur le programme français Phyt’air, Plant’airpur vous propose de faire d’une pierre deux coups :

acheter une plante verte, et qui plus est une plante dépolluante !

Qu’est-ce que ça change ?

Les études citées ci-dessus ont démontré que l’air ambiant est souvent pollué par des composés organiques volatils ou COV. Et bien les plantes Plant’airpur se chargent tout simplement d’éliminer ces composés néfastes pour la santé ! Ainsi c’est un air plus propre que vous respirerez toute la journée !

Où trouver ces plantes ?

Dans n’importe quelle jardinerie qui se respecte, j’ai personnellement trouvé la mienne dans un magasin Baobab. Elles sont étiquetées Plant’airpur, faciles à repérer.
J’ai opté pour un petite plante à 3€, 2€ le cache-pot, prévoyez éventuellement un peu de terreau au cas où la plante doive être rempotée.
Au final vous avez pour 5€ une plante qui décore agréablement votre pièce et vous dépollue l’air ambiant que demander de plus !

Catégorie: Geek | Laisser un commentaire (0)

Zend Framework / jQuery : Exemple de « view helper »

Posté par seiyar81 le 29 mars 2010 | Laisser un commentaire (0)

Dans la continuité du précédent billet sur le Zend Framework et jQuery, j’ai codé un view helper pour la ProgressBar de jQuery UI.

Je suis tout simplement parti du code du slider que j’ai bien rogné et un peu modifié pour arriver à un code fonctionnel.

Sans plus attendre le voici :

/**
 * Zend Framework
 *
 * LICENSE
 *
 * This source file is subject to the new BSD license that is bundled
 * with this package in the file LICENSE.txt.
 * It is also available through the world-wide-web at this URL:
 * http://framework.zend.com/license/new-bsd
 * If you did not receive a copy of the license and are unable to
 * obtain it through the world-wide-web, please send an email
 * to license@zend.com so we can send you a copy immediately.
 *
 * @category    ZendX
 * @package     ZendX_JQuery
 * @subpackage  View
 * @copyright  Copyright (c) 2005-2010 Zend Technologies USA Inc. (http://www.zend.com)
 * @license     http://framework.zend.com/license/new-bsd     New BSD License
 * @version     $Id: Slider.php 20165 2010-01-09 18:57:56Z bkarwin $
 */

/**
 * @see ZendX_JQuery_View_Helper_UiWidget
 */
require_once "ZendX/JQuery/View/Helper/UiWidget.php";

/**
 * jQuery ProgressBar View Helper
 *
 * @uses 	   Zend_Json
 * @package    ZendX_JQuery
 * @subpackage View
 * @copyright  Copyright (c) 2005-2010 Zend Technologies USA Inc. (http://www.zend.com)
 * @license    http://framework.zend.com/license/new-bsd     New BSD License
 */
class ZendX_JQuery_View_Helper_ProgressBar extends ZendX_JQuery_View_Helper_UiWidget
{
    /**
     * Create a jQuery progressbar
     *
     * @link   http://docs.jquery.com/UI/Progressbar
     * @param  string $id
     * @param  string $value
     * @param  array  $params
     * @param  array  $attribs
     * @return string
     */
    public function progressBar($id, $value, array $params = array(), array $attribs = array())
    {
        if(!isset($attribs['id'])) {
            $attribs['id'] = $id;
        }

        $jqh = ZendX_JQuery_View_Helper_JQuery::getJQueryHandler();

        if(count($params) <= 0) {
            $params = ZendX_JQuery::encodeJson(array('value'=>$value));
        } else {
            $params = ZendX_JQuery::encodeJson($params);
        }

        $js = sprintf('%s("#%s").progressbar(%s);', $jqh, $attribs['id'], $params);
        $this->jquery->addOnLoad($js);

        $html = "<div ".$this->_htmlAttribs($attribs)." >";
        $html .= '</div>';

        return $html;
    }
}

C’est simple et ça fonctionne !
Il suffit de créer le fichier : « ZendX/JQuery/View/Helper/ProgressBar.php » et d’y placer ensuite le code ci-dessus.

Ensuite pour l’utiliser c’est très simple dans vos vues :

echo $this->progressBar("progressBarId", 65);

Voilà en espérant que cela serve :)

Catégorie: Développement Web, PHP, Zend Framework | Laisser un commentaire (0)

My GMail : Encore un plugin pour WordPress

Posté par seiyar81 le 28 mars 2010 | Laisser un commentaire (0)

Et oui encore un plugin pour WordPress ! Faut dire que c’est tellement facile d’en faire un !

Originalement intitulé « My GMail » ce dernier ajoute un widget au Tableau de bord de l’administration qui affiche tous vos mails non lus de votre boîte GMail. Pour l’instant, vous choisissez juste le nombre de mails maximum à afficher mais je l’améliorerai très vite par la suite.

Il se télécharge ici et vous pouvez me laisser des commentaires pour l’améliorer :)

EDIT : Un petit malin a, je ne sais pour quelle raison, mal noté le plugin et dit qu’il ne fonctionnait pas, et ce sans donner de détails ni expliquer le bug rencontré. Je suppose que c’est parce qu’il ne peut pas utiliser HTTPS, donc il est maintenant précisé que le plugin ne fonctionne qu’avec HTTPS pour récupérer les mails.

Catégorie: PHP, Wordpress, Yriase | Laisser un commentaire (0)

Zend Framework et jQuery une équipe qui gagne

Posté par seiyar81 le 27 mars 2010 | Laisser un commentaire (1)

Si Zend a fait le choix d’intégrer Dojo à son Framework, il faut bien avouer qu’aujourd’hui jQuery a acquit une certaine popularité auprès des développeurs. Notamment grâce à sa modularité, qui est son principal atout, mais également par sa simplicité d’utilisation qui rend accessible à tous le développement d’applications évoluées en Javascript.

Et bien sachez qu’il est possible (i.e. déjà prévu) d’intégrer jQuery au Zend Framework. En effet un package existe et est fournit avec le framework dans le dossier “extras/library/ZendX”.

Mise en place

Pour pouvoir l’utiliser vous devez d’abord copier le dossier ZendX dans le même répertoire que le dossier Zend.

Vous obtenez ensuite l’architecture suivante : 

zendx

Ensuite il va nous falloir utiliser le “view helper” fournit par ZendX_JQuery. Plusieurs méthodes s’offrent à nous :

  • Dans les contrôleurs/vues où l’on souhaite utiliser JQuery on ajoute
    	$this->view->addHelperPath("ZendX/JQuery/View/Helper", "ZendX_JQuery_View_Helper");
    	// ou bien, et cela revient au même
    	ZendX_JQuery::enableView($this->view);
    	
  • Pour l’utiliser dans toute l’application on ajoute à notre fichier BootStrap
          $view = new Zend_View();
          $view->addHelperPath('ZendX/JQuery/View/Helper/', 'ZendX_JQuery_View_Helper');
    
          $viewRenderer = new Zend_Controller_Action_Helper_ViewRenderer();
          $viewRenderer->setView($view);
          Zend_Controller_Action_HelperBroker::addHelper($viewRenderer);
        

Je préfère personnellement choisir les vues auxquelles je souhaite appliquer le “view helper” plutôt que de l’utiliser dans toute l’application.

Vous pouvez tout d’abord choisir entre utiliser les fichiers de jQuery et jQuery UI du CDN de Google ou bien utiliser vos propres fichiers.

  • CDN de Google : utilisé par défaut, vous pouvez spécifier la version à charger avec
    		$view->jQuery->setVersion('1.4.2');
    		$view->jQuery->setUiVersion('1.8'); // pour jQuery UI
           
  • Vos fichiers :
    	// Pour inclure vous-même les fichiers dans la balise head.
    	$view->jQuery()->setRenderMode(ZendX_JQuery::RENDER_JAVASCRIPT | ZendX_JQuery::RENDER_JQUERY_ON_LOAD);
    	// Pour indiquer le chemin de vos fichiers et laisser le framework gérer le tout
    	$view->jQuery()->
    	

Petite précision toutefois, les fichiers de thèmes de jQuery UI ne sont pas disponibles sur le CDN, vous devez donc les inclure vous-même avec par exemple la fonction jQuery->addStylesheet($pathToFile);

Utilisation

Tout ceci ne nous dit pas comment faire pour utiliser jQuery dans notre application, rassurez-vous c’est on ne peut plus simple.

Imaginons par exemple un simple lien pour charger une partie de la page en Ajax :

echo $this->ajaxLink("Get Index", "/index",
                        array('update' => '#mydiv',
                              'method' => 'POST',
                              'beforeSend' => 'aCallbackFunction()',
                              'complete' => 'alert(data)')); ?>

Rien de bien compliqué ici, #mydiv indiquant la div au sein de laquelle il faut insérer le contenu, /index l’url de la page à récupérer, beforeSend et complete les callback à utiliser.

Pas plus de code à écrire, le code généré sera inséré à l’appel de $this->jQuery();.

Mais on peut utiliser jQuery pour plus que des simples liens. Ainsi on peut dans des formulaires :

// Créé un input avec auto-complétion
echo $this->autoComplete("country", "",
                             array('source' => array('France', 'United Kingdom', 'United States', 'Germany', 'Italy', 'Spain')));
// On peut donc facilement charger la source via une base de données

// Créé un input avec un calendrier
echo $this->datePicker("datePicker", '',
                        array('defaultDate' => date('d/m/Y', time()),
                                'onClose' => new Zend_Json_Expr('myFunction')));

// Créé un slider
echo $this->slider("slider", "",
                        array('min'=>'0', 'max'=>'100', 'step'=>'5'));

On peut également utiliser le framework pour créer des dialogs, tabContainer, accordionContainer.

Vous pouvez en apprendre plus avec la documentation, attention toutefois car des helpers sont toujours disponibles tels que ZendX_JQuery_View_Helper_ColorPicker ou ZendX_JQuery_View_Helper_Spinner alors que jQuery UI ne supporte plus les éléments.

Avec cette gestion de jQuery, ce dernier devient une bonne alternative à Dojo pour développer avec le Zend Framework.

Je l’ai personnellement adopté, et vous comptez-vous un jour passer à jQuery grâce à cette utilisation simplifiée ?

Catégorie: Développement Web, Javascript, PHP, Zend Framework | Laisser un commentaire (1)

Qt 4.7, Qt Creator 2.0, QML, quoi de neuf chez Qt ?

Posté par seiyar81 le 26 mars 2010 | Laisser un commentaire (0)

Je connais et développe avec Qt depuis un moment maintenant, et le moins qu’on puisse dire c’est que le rachat de TrollTech par Nokia n’a en rien altéré la volonté des développeur de faire évoluer leur bébé.

Il faut bien reconnaître que Nokia y trouve son compte en disposant ainsi d’un framework bien complet pour animer ses appareils mobiles.

Mais que nous réservent donc ces deux produits actuellement en “Technology Preview” que sont Qt 4.7 et Qt Creator 2.0 ?

On commence avec Qt 4.7 et les nouveautés que cette version apporte à la 4.6 :

  • De nouvelles classes pour la gestion des medias : gestion des playlists etc…
  • Nouvelles classes pour le réseau, gestion des interfaces entre autres
  • Mais la plus grosse nouveauté dans cette version c’est l’arrivée de Qt Quick

Qt Quick qu’est-ce que c’est ?

Qt Quick c’est un ensemble de trois produits qui vous permet de créer des interfaces dynamiques facilement, rapidement et compatible avec les technologies Qt déjà en place. Qt Quick comprend :

  • QML : un langage déclaratif (sur lequel je reviendrai un jour) semblable au Javascript et qui simplifie la création d’interfaces animées et fluides
  • QtDeclarative : un ensemble de classes C++ qui traduisent le QML en objets QGraphicScene, et permettent la connexion entre l’interface QML et l’application en C++.
  • Enfin Qt Creator 2.0 : l’IDE made in Qt a été revu pour pleinement supporter le QML et ainsi offrir une interface facile à utiliser via le drag and drop, l’auto-complétion et la détection d’erreurs de syntaxe.

Ci-dessous une petite vidéo de Qt Quick en action sur un N900. On notera la fluidité de l’ensemble.

Une autre vidéo disponible sur la page de Qt 4.7, c’est un exemple de développement en QML avec Qt Creator. Encore une fois la simplicité est au rendez-vous.

Vous pouvez en apprendre plus sur ces deux pages et évidemment télécharger le tout pour vous amuser !

Présentation de Qt 4.7

Snapshot Qt 4.7

Catégorie: Qt | Laisser un commentaire (0)

La saga Scream de retour en 2011

Posté par seiyar81 le 23 mars 2010 | Laisser un commentaire (0)

Je n’ai pas beaucoup parlé de cinéma jusqu’à présent, mais je viens d’apprendre une nouvelle qui m’a bien fait plaisir. Grand fan du premier volet, à l’époque terrifié, aujourd’hui amusé ( mais toujours content ) de voir ce dernier, on peut lire sur Allocine que la saga Scream, initiée par le film éponyme sortit en 1997, sera de retour en 2011 et avec Wes Craven en tant que réalisateur s’il vous plaît !

Mais ce n’est pas tout on apprend aussi que le film réunira les acteurs principaux de la série : Neve Campbell, David Arquette et Courteney Cox !

Alors qu’attendre de cette suite ? Un raté à la manière de Vendredi 13 ? Un énième slasher à la noix ? Un teen-movie ridicule ?

Rien de tout cela je l’espère, mais plutôt un digne successeur au premier film, faisons confiance à Wes Craven pour nous sortir un petit bijou et rendez-vous le 15 Avril 2011 !

Catégorie: Cinéma | Laisser un commentaire (0)

Programmer un envoi de SMS avec le Zend Framework et Google Agenda

Posté par seiyar81 le 22 mars 2010 | Laisser un commentaire (5)
Google Agenda

Si vous développez déjà avec le Zend Framework vous devez connaître ou avoir entendu parler de Zend_Gdata. C’est, comme son nom l’indique, un ensemble de classes qui permettent l’accès aux services en ligne de Google (Google Data API). On a ainsi accès à :

Aujourd’hui je vais expliquer comment se servir de Zend_Gdata pour communiquer avec Google Agenda. Si vous en connaissez le fonctionnement, vous savez qu’on peut définir des rappels pour les rendez-vous de trois façons : Email, Pop-up ou SMS.

C’est au SMS que nous nous intéresseront, en effet, utiliser Google Agenda pour l’envoi de SMS ne vous coutera pas un centime !

Pré-requis

Vous devez avant tout disposer de :

  • Un compte Google
  • Un agenda activé dans Google Agenda
  • Un numéro de portable associé au compte Google Agenda et vérifié
  • La dernière version du Zend Framework disponible ici
  • Un serveur HTTP avec le support de PHP (peut-être pas besoin de le préciser mais on ne sait jamais :p )

Mise en situation (enfin essai ^^)

C’est bien joli d’écrire ce tutoriel mais sans un exemple pratique il peut être difficile d’en voir l’intérêt.

Imaginez que vous développez pour une entreprise qui installe et gère le fonctionnement de panneaux solaires (vous pouvez remplacer panneaux solaires par chaudières, fenêtres, voire même par l’adoption de poissons rouges birmans, si si ça marche aussi !).

Imaginez maintenant que vos clients aient la possibilité via une interface web de créer des “tickets”, ou “alertes” comme vous le sentez, dès lors qu’ils rencontrent un problème auquel ils ne peuvent faire face seuls !

C’est alors que par malheur, vous n’êtes pas joignable au bureau et le client n’a pas votre numéro de portable (si si c’est possible) ! Drâme ! Horreur ! Comment faire ?

Et bien tout simplement en créant un évènement sur votre Google Agenda avec l’option “reminder by SMS” !

Formulaire

Vous créez donc un formulaire pour que vos clients puissent expliquer en quelques lignes ce qui se passe avec en bonus une liste pour choisir la priorité du ticket.

class Default_Form_Ticket extends Zend_Form
{
    public function __construct($sitesList, $options = null)
    {
        parent::__construct($options);
        $this->setName('ticket_form');
        $this->setAction('/tickets/new')
     	->setMethod('post');
     	$this->setDecorators(array(
	    'FormElements',
	    array('HtmlTag', array('tag' => 'table')),
	    'Form',
		));

        $title = new Zend_Form_Element_Text('title');
        $title->setLabel('Sujet : ')
        ->setRequired(true)
        ->addFilter('StripTags')
        ->addFilter('StringTrim')
        ->setAttrib('size', '50')
        ->addValidator('NotEmpty');
        $title->setDecorators(array(
	    'ViewHelper',
	    'Errors',
	    array(array('data' => 'HtmlTag'), array('tag' => 'td', 'class' => 'element-input')),
	    array('Label', array('tag' => 'td'), array('tag' => 'td', 'placement' => 'prepend')),
	    array(array('row' => 'HtmlTag'), array('tag' => 'tr')),
		));

        $priority = new Zend_Form_Element_Select('priority');
        $priority->setLabel('Priorité : ')
        ->setRequired(true)
        ->addFilter('StripTags')
        ->addFilter('StringTrim')
        ->addValidator('NotEmpty');
        $priority->addMultiOptions(array('Basse'=>'Basse', 'Normale'=>'Normale', 'Haute'=>'Haute', 'Urgente'=>'Urgente'));
        $priority->setDecorators(array(
	    'ViewHelper',
	    'Errors',
	    array(array('data' => 'HtmlTag'), array('tag' => 'td', 'class' => 'element-input')),
	    array('Label', array('tag' => 'td'), array('tag' => 'td', 'placement' => 'prepend')),
	    array(array('row' => 'HtmlTag'), array('tag' => 'tr')),
		));

        $message = new Zend_Form_Element_Textarea('message');
        $message->setLabel('Message : ')
        ->setRequired(true)
        ->addFilter('StripTags')
        ->addFilter('StringTrim')
        ->setAttrib('cols', '50')->setAttrib('rows', '15')
        ->addValidator('NotEmpty');
        $message->setDecorators(array(
	    'ViewHelper',
	    'Errors',
	    array(array('data' => 'HtmlTag'), array('tag' => 'td', 'class' => 'element-input')),
	    array('Label', array('tag' => 'td'), array('tag' => 'td', 'placement' => 'prepend')),
	    array(array('row' => 'HtmlTag'), array('tag' => 'tr')),
		));

        $submit = new Zend_Form_Element_Submit('Soumettre');
        $submit->setAttrib('id', 'submitbutton');
        $submit->setValue('Soumettre');
        $submit->setDecorators(array(
	    'ViewHelper',
	    array(array('data' => 'HtmlTag'), array('tag' => 'td', 'class' => 'element-submit')),
	    array(array('label' => 'HtmlTag'), array('tag' => 'td', 'placement' => 'prepend')),
	    array(array('row' => 'HtmlTag'), array('tag' => 'tr')),
		));

        $this->addElements(array($title, $priority, $message, $submit));
    }
}

Ensuite dans le contrôlleur on instancie le formulaire et on l’ajoute à la vue et dans le même temps on met en place le code pour la création de l’évènement.

    public function newAction() {
        $form = new Default_Form_Ticket($sitesList);

        if($this->_request->isPost() && $form->isValid($_POST)) {
            try {
	    /*
		Vous pouvez enregistrer le ticket dans une base de données.
		Nous nous contenterons simplement de l'ajout de l'évènement.
	    */

            $title = 'New Ticket - '.$this->view->user->mail.' - ' . $_POST['title'];
            $message = $_POST['message'];

            $this->createAgendaEvent($title, $message);

            $this->_redirect('/tickets');
            } catch(Exception $e) {
                $this->view->error = 'Une erreur est survenue pendant la création du ticket.';
            }

        }
        $form->populate($_POST);
        $this->view->form = $form;
    }

Il ne nous reste plus qu’à implémenter la fonction createAgendaEvent. Un petit détail toutefois avant de commencer, le reminder se déclenche au minimum 5 min avant le début de l’évènement. Nous créerons donc un évènement à H+6min.

    public function createAgendaEvent($title, $message) {
	// On charge toutes les classes qui vont nous servir
        Zend_Loader::loadClass("Zend_Gdata");
        Zend_Loader::loadClass("Zend_Gdata_ClientLogin");
        Zend_Loader::loadClass("Zend_Gdata_Calendar");
        // On récupère le nom du service
        $service = Zend_Gdata_Calendar::AUTH_SERVICE_NAME;

        // On s'authentifie
        $client = Zend_Gdata_ClientLogin::getHttpClient('IDENTIFIANT_COMPTE_GOOGLE', 'PASSWORD_COMPTE_GOOGLE', $service);

        // On crée un nouvel objet Calendar
        $calendar = new Zend_Gdata_Calendar($client);

        // On lui ajoute un évènement
        $event = $calendar->newEventEntry();

        // On met en place le reminder
        $reminder = $calendar->newReminder();
        $reminder->method = "sms";
        $reminder->minutes = "5";

        // Date de début à H+6min
        $startDate     = date("Y-m-d");
        $startTime     = date("H:i", time() + 6*60);
        // Date de fin à H+7min
        $endDate     = date("Y-m-d");
        $endTime     = date("H:i", time() + 7*60);
        // Offset GMT+01 pour Paris
        $tzOffset     = "+01";

        // On assigne tout ça au calendrier
        $when = $calendar->newWhen();
        $when->startTime = "{$startDate}T{$startTime}:00.000{$tzOffset}:00";
        $when->endTime = "{$endDate}T{$endTime}:00.000{$tzOffset}:00";
        $when->reminders = array($reminder);
        $event->when = array($when);

        // Enfin on ajoute le titre et le message
        $event->title = $calendar->newTitle($title);
        $event->content = $calendar->newContent($message);

        // Et on envoit le tout à Google Calendar
        $newEvent = $calendar->insertEvent($event, "http://www.google.com/calendar/feeds/IDENTIFIANT_COMPTE_GOOGLE/private/full");
    }

Et là, comme par magie vous recevrez une minute plus tard (oui H+6min – 5min = 1min !) un gentil SMS de Google avec le titre de l’évènement.
Si c’est pas beau ça :)

J’espère que ce tutoriel vous aura plu et/ou servi, je continue avec d’autres articles sur le Zend Framework très bientôt.

Catégorie: Développement Web, PHP, Zend Framework | Laisser un commentaire (5)

Poster Avatar : Nouveau plugin pour WordPress

Posté par seiyar81 le 19 mars 2010 | Laisser un commentaire (0)

Je vous présente ici un petit plugin développé cette nuit, oui oui je suis un développeur fou !

En effet j’ai remarqué que lorsqu’on poste un article, à moins d’en faire la requête directement dans le thème (ce qui implique de bidouiller le code du thème et un bout de CSS), l’avatar du poster ne s’affiche pas (logique). Mais il peut être parfois lourd de devoir modifier le thème, surtout quand on n’en est pas propriétaire ou alors quand on n’est pas développeur tout simplement.
J’ai donc codé ce petit plugin qui vous permet de choisir comment vous souhaitez afficher l’avatar, avec une bordure et sa couleur, sa taille etc…
Je pense que cela peut être agréable pour les blogs avec plusieurs rédacteurs, ainsi il est plus aisé de les identifier.

Il va très vite être amené à évoluer, car il ne s’agit pour l’instant que d’une première version mais elle fonctionne sans problèmes.

EDIT : déjà une mise à jour avec maintenant l’affichage de l’avatar dans le widget « commentaires récents ».
EDIT 2 : mise à jour corrigeant un bug qui rendait les flux rss invalides.

Disponible sur le site de WordPress, si vous avez des remarques/suggestions, n’hésitez pas :)

Catégorie: PHP, Wordpress, Yriase | Laisser un commentaire (0)

jQuery : poster un formulaire simplement avec AJAX

Posté par seiyar81 le 18 mars 2010 | Laisser un commentaire (1)

jQuery, ce merveilleux framework qui nous permet de faire tellement de choses … Bien souvent je suis passé à côté de fonctionnalités on ne peut plus simple à utiliser mais tellement utiles.

Du genre, je dois envoyer ce formulaire avec AJAX, il contient plein de champs différents, comment faire pour que ce soit le plus simple et rapide possible ?

Tout d’abord imaginons un formulaire regroupant plusieurs champs sur toute la page.

Coordonnées

... ...

Rien de bien compliqué jusque là mais n’oubliez pas d’inclure la librairie jQuery !
On créé ensuite la page qui va traiter nos données, appelons-la post.php :

    <?php foreach($_POST as $key => $value) echo "
  • $key => $value
  • "; ?>

Il ne nous reste plus que la partie qui nous intéresse ici, le code javascript :

$(document).ready(function(){
	$("#formulaire").submit(function(){
		$.ajax({type:"POST", data: $(this).serialize(), url:"post.php",
			success: function(data){
				$("#post").html(data);
			},
                        error: function(){
			        $("#post").html('Une erreur est survenue.');
			}
		});
		return false;
	});
});

Tout ce qu’on a à faire c’est ré-implémenter la fonction submit du formulaire et sérialiser ses champs avec la fonction ‘serialize()’ pour envoyer les données.
C’est tout bête mais je ne connaissais pas cette fonction et on ne développe pas toujours avec un IDE qui liste pour nous les fonctions à utiliser !
Enfin comme dit le vieil adage : RTFM !

Catégorie: Développement Web, Javascript, PHP | Laisser un commentaire (1)