Nov 172013
 

Pour détecter un clic dans la page html (n’importe où) avec jQuery :

    // Détection d'un clic dans la page
    $('html').click(function() {
        // votre code
    });

Pour qu’un élément ne pas passe par l’événement ci dessus (exemple si on souhaite afficher ou cacher un menu via un bouton et cacher le menu en dehors d’un clic sur ce bouton) il suffit d’ajouter « event.stopPropagation(); » :


    // Détection d'un clic sur le bouton pour afficher ou cacher le menu
    $("a#btn-menu").click(function(event){
        event.stopPropagation(); // pour éviter de cacher le menu
        cacheAfficheMenu();
    });
   
    // Détection d'un clic dans la page pour cacher le menu
    $('html').click(function() {
        cacheMenu();
    });
VN:F [1.9.22_1171]
Cette astuce est pratique ? laissez un vote ;)
Rating: 0.0/10 (0 votes cast)
Oct 022013
 

Logo CKEditor

Pour détecter la modification d’un champs CKEditor et effectuer une action à chaque saisie d’un caractère :

  1. télécharger le plugin « onchange »

    http://alfonsoml.blogspot.fr/2012/05/recipe-live-preview-of-ckeditor.html

  2. installer le
    – dezipper le répertoire complet du plugin dans le repertoire de ckeditor
    – ouvrir le fichier build-config.js
    – ajouter la ligne ‘onchange’ : 1

    /**
     * @license Copyright (c) 2003-2013, CKSource - Frederico Knabben. All rights reserved.
     * For licensing, see LICENSE.html or http://ckeditor.com/license
     */
    
    /**
     * This file was added automatically by CKEditor builder.
     * You may re-use it at any time at http://ckeditor.com/builder to build CKEditor again.
     *
     * NOTE:
     *    This file is not used by CKEditor, you may remove it.
     *    Changing this file will not change your CKEditor configuration.
     */
    
    var CKBUILDER_CONFIG = {
        skin: 'moono',
        preset: 'basic',
        ignore: [
    ...
        ],
        plugins : {
       ...
            'onchange' : 1
        },
        languages : {
            'en' : 1,
            'fr' : 1,
        }
    };
  3. maintenant pour ajouter l’event sur l’iframe de ckeditor
    CKEDITOR.on('instanceCreated', function (e) {
        e.editor.on('change', function (ev) {
            $(".rendu").html(ev.editor.getData());
        });
    });
  4. VN:F [1.9.22_1171]
    Cette astuce est pratique ? laissez un vote ;)
    Rating: 10.0/10 (1 vote cast)
Sep 262013
 

Pour activer l’autocomplete (JQuery UI) uniquement en cliquant sur le bouton recherche.

Le champs HTML :



Autocomplete sur le champs, on fixe l’option « minLength » pour ne pas le déclencher automatiquement :

var source = ['un', 'deux', 'trois', 'quatre'];

$("input#autocomplete").autocomplete({
    minLength: 10000,
    source: source
});

Pour lancer la recherche via le click sur le bouton « recherche » :

$('#btn-recherche').on('click', function(){
        var champs = $( 'input#autocomplete' );
        var valeur = champs.val();
        if ( $.trim(valeur) != '' ) { 
            champs.addClass('ui-autocomplete-loading');       
            champs.autocomplete('option', 'minLength', 0);
            champs.autocomplete('search',valeur);
            champs.removeClass('ui-autocomplete-loading');   
            champs.autocomplete('option', 'minLength', 10000);
        } 
    });
VN:F [1.9.22_1171]
Cette astuce est pratique ? laissez un vote ;)
Rating: 8.5/10 (2 votes cast)
Oct 262012
 

Deux solutions :

  • Redirection type lien ( <a href> )
    window.location.href = "http://www.votre-url.com";
  • Redirection HTTP ( l’historique de la navigation n’est pas sauvegardée dans ce cas )
    window.location.replace("http://www.votre-url.com");
VN:F [1.9.22_1171]
Cette astuce est pratique ? laissez un vote ;)
Rating: 0.0/10 (0 votes cast)
Juil 112012
 

Pour afficher une image de chargement sur un champ autocomplété avec JQuery :

CSS

.chargement{background:url('../img/chargement.gif') no-repeat right center;}

JS

$("#champs-input").autocomplete
(
search  : function(){$(this).addClass('chargement');},
open    : function(){$(this).removeClass('chargement');}
);
VN:F [1.9.22_1171]
Cette astuce est pratique ? laissez un vote ;)
Rating: 9.0/10 (1 vote cast)