BlogYann » Ajax http://blog.yann.info Fri, 02 Dec 2011 22:53:52 +0000 en hourly 1 http://wordpress.org/?v=3.3.1 Mementos jQuery http://blog.yann.info/2010/03/04/mementos-jquery/ http://blog.yann.info/2010/03/04/mementos-jquery/#comments Thu, 04 Mar 2010 10:03:46 +0000 blog.yann http://blog.yann.info/?p=366 Voici quelques mémento jQuery que j’ai trouvé sur le net :

Mémento jQuery 1.4

Version HTML
Version PDF

jquery.cheatsheet.1.4
Créé par Future Colors.

Mémento complet jQuery 1.3

par Antonio Lupetti

memento jQuery

memento jQuery

Source : http://woork.blogspot.com/2009/09/jquery-visual-cheat-sheet.html

Mémento pour la balise select

http://comp345.awardspace.com/select_element_cheatsheet.pdf

memento_select

memento_select

Trouvé sur le blog myphpetc.com

Extension firefox jQuery

jQuery Menu de Simon Lang

jQuery menu

]]> http://blog.yann.info/2010/03/04/mementos-jquery/feed/ 0 jQuery ou comment simplifier les requêtes Ajax http://blog.yann.info/2010/03/02/jquery-ou-comment-simplifier-ajax/ http://blog.yann.info/2010/03/02/jquery-ou-comment-simplifier-ajax/#comments Tue, 02 Mar 2010 22:15:09 +0000 blog.yann http://blog.yann.info/?p=251 Avant il fallait jongler avec XMLHttpRequest, bien sûr ça fonctionne très bien, mais une fois qu’on a essayé jQuery difficile de faire machine arrière !
En effet ce simple code ci dessous permet d’envoyer la variable js info à page.php avec la méthode POST, pendant l’envoi et en attendant le retour de page.php, l’image load.gif est affichée dans le div chargement et enfin si tout s’est bien passé, retourPHP affiche ce que renvoi page.php.

Démo du script

$.ajax({
    type : "POST",
    url : "page.php",
    data : "info ="+info,
    send : $('#chargement').html("<img src="img/load.gif" alt="chargement" />"),
    error :function(msg){
        alert( "Erreur  : " + msg );
    },
    success : function(data){
    $('#retourPHP').html(data);
}});

Tout d’abord pour faire patienter l’internaute vous pouvez créer votre gif de chargement avec AjaxLoad

Mise en place du script :

D’abord insérez l’appel à jQuery

 <script src="http://code.jquery.com/jquery-latest.js"></script>

Ensuite on va créer un champ monChamp qui contiendra les données à envoyer, un bouton envoiAjax et une balise div retourPHP qui renverra la valeur saisie dans le champ

<input type="text" id="monChamp" />
<input type="button" value="Envoi" id="envoiAjax" />
<div id="retourPHP"></div>

Avec jQuery on surveille le click sur envoiAjax et on récupère le value de monChamp que l’on stocke dans la variable info (le reste est expliqué au début de l’article)

<script language='javascript'>
$(document).ready(function(){
    $("#envoiAjax").click(function () {
        var info = $("#monChamp").val();

            $.ajax({
                type : "POST",
                url : "page.php",
                data : "info="+info,
                send : $('#retourPHP').html("<img src='load.gif' alt='chargement' />"),
                error :function(msg){
                    alert( "Erreur  : " + msg );
                },
                success : function(data){
                $('#retourPHP').html(data);
            }});
    });
});
</script>

et page.php y’a quoi dedans ? pas pas grand chose on se contente d’afficher ce que l’on a reçu (sans vérification de contenu : ni isset, ni empty ni rien…)

<?php
    echo "reception de : " . $_POST['info'];
?>

et voilà !

]]> http://blog.yann.info/2010/03/02/jquery-ou-comment-simplifier-ajax/feed/ 3 Ajaxload créez votre gif de chargement Ajax http://blog.yann.info/2010/03/02/ajaxload-creez-votre-gif-de-chargement-ajax/ http://blog.yann.info/2010/03/02/ajaxload-creez-votre-gif-de-chargement-ajax/#comments Tue, 02 Mar 2010 21:29:08 +0000 blog.yann http://blog.yann.info/?p=354 Vous utilisez ajax et vous avez besoin d’un petit gif animé pour occuper l’internaute pendant le chargement de votre script ? ne cherchez plus ! créez-le en quelques secondes avec http://www.ajaxload.info/

ajax-loader

Ajax-loader

]]> http://blog.yann.info/2010/03/02/ajaxload-creez-votre-gif-de-chargement-ajax/feed/ 1