Astuces Forumactif

EDGE/ PHPBB2 / PHPBB3/ PUNBB / INVISION/ MODERNBB/ AWESOMEBB

Connexion

Récupérer mon mot de passe

Derniers sujets
» [AwesomeBB] Profils en onglets
[EDGE] Auto suggestion de la recherche Clock-10Aujourd'hui à 19:01:21 par Milouze14

» [PhpBB2] Changer le lien d'une image par une icone font awesone
[EDGE] Auto suggestion de la recherche Clock-10Aujourd'hui à 16:14:19 par fascicularia

» Test d'intelligence des politiciens-(e) histoire blagounette
[EDGE] Auto suggestion de la recherche Clock-10Aujourd'hui à 9:22:04 par Quad Daniel

» histoire du Jour sans fin
[EDGE] Auto suggestion de la recherche Clock-10Aujourd'hui à 9:11:19 par Quad Daniel

» Règlement de l'entraide Forumactif
[EDGE] Auto suggestion de la recherche Clock-10Hier à 11:42:12 par BADLANDS

» [AwesomeBB] Problème avec le tuto "AutoSuggestion" - Incompatible version AwesomeBB
[EDGE] Auto suggestion de la recherche Clock-10Mer 21 Aoû - 12:14:44 par MathisB

» *RESOLU*[AwesomeBB] Barre de progression sur la page - AwesomeBB
[EDGE] Auto suggestion de la recherche Clock-10Mar 20 Aoû - 21:17:52 par Milouze14

» *RESOLU*[PhpBB2] Insérer la valeur d'un champ personnalisé dans une page HTML
[EDGE] Auto suggestion de la recherche Clock-10Mar 20 Aoû - 19:11:22 par Milouze14

» *CORBEILLE*[PhpBB2] Récupérer la valeur d'un input
[EDGE] Auto suggestion de la recherche Clock-10Lun 19 Aoû - 18:42:46 par Milouze14

» *RESOLU*[PhpBB3] Prévisualisation directe
[EDGE] Auto suggestion de la recherche Clock-10Ven 16 Aoû - 11:06:17 par Milouze14

» *RESOLU*[PhpBB2] l'image s'éclairci dans le codage
[EDGE] Auto suggestion de la recherche Clock-10Lun 12 Aoû - 6:30:13 par Milouze14

» *RESOLU*[PhpBB2] Vérifier valeur dans InArray (Jquery)
[EDGE] Auto suggestion de la recherche Clock-10Sam 10 Aoû - 6:24:38 par Milouze14

» *RESOLU*[PhpBB2] Récupérer valeur checkbox
[EDGE] Auto suggestion de la recherche Clock-10Jeu 8 Aoû - 4:17:47 par Milouze14

» [Toutes versions] Utiliser les variables utilisateur/forum
[EDGE] Auto suggestion de la recherche Clock-10Mer 31 Juil - 19:36:09 par photoclic

» *RESOLU*[PhpBB2] Encadrement des photos dans le .preview .postbody
[EDGE] Auto suggestion de la recherche Clock-10Mer 31 Juil - 19:19:19 par Milouze14

» *RESOLU*[PhpBB3] Nombre de messages et membres su qeel
[EDGE] Auto suggestion de la recherche Clock-10Mer 31 Juil - 17:01:42 par no_way

» *RESOLU*[PhpBB2] Prévisualisation en direct
[EDGE] Auto suggestion de la recherche Clock-10Lun 29 Juil - 17:42:06 par Milouze14

» *RESOLU*[PhpBB2] La version web ne s'affiche pas sur "mon" IPAD.
[EDGE] Auto suggestion de la recherche Clock-10Ven 26 Juil - 19:51:58 par Milouze14

» [AwesomeBB] Problème avec le tuto "AutoSuggestion" - Incompatible version AwesomeBB
[EDGE] Auto suggestion de la recherche Clock-10Dim 21 Juil - 6:07:55 par Milouze14

» [Toutes versions]Remplacer les icônes de l'éditeur par des icônes FontAwesome
[EDGE] Auto suggestion de la recherche Clock-10Sam 20 Juil - 11:23:30 par Morane

[EDGE] Auto suggestion de la recherche

 :: Astuces Forumactif :: Les astuces EDGE

Voir le sujet précédent Voir le sujet suivant Aller en bas

Icône par defaut [EDGE] Auto suggestion de la recherche

#582198
Milouze14
Milouze14
Fondateur

MessageMilouze14 le Dim 23 Avr - 19:32:26

Hello les ami(e)s,

l'astuce est présente aussi sur ce forum, il suffit de cliquer sur le menu de recherche pour visualiser le résultat.

L'aperçu imagé:
[EDGE] Auto suggestion de la recherche Ajaxse10


Comme la plupart des scripts viennent du support EDGE, cette dernière restera visible mais un merci sera
toujours apprécié car la traduction a été effectuée par mes soins:


Modules/HTML JAVASCRIPT/Gestion des codes JavascriptCréer un nouveau javascript


Mettez un titre explicite.
Cochez sur toutes les pages


Déposez ceci:
Code:

(function() {
          'DEVELOPED BY ANGE TUTEUR';
          'NO DISTRIBUTION WITHOUT CONSENT OF THE AUTHOR';
          'ORIGIN : http://fmdesign.forumotion.com/t1118-live-search#26404';
          window.fa_ajax_search = {
            input_fields : 'input[name="search_keywords"]', // input elements you want to enable ajax searching on
            delay : 100, // delay before sending search
            // language settings
            lang : {
              title : 'Résultats de la recherche',
              searching : 'Recherche de sujets pour "{KEYWORDS}"...',
              no_results : 'Aucun résultat n\'a été trouvé pour "{KEYWORDS}"',
              view_all : 'Afficher dans la page de recherche',
              close : 'Fermer'
            },
            // wait before sending the search
            queue : function (caller) {
              fa_ajax_search.clear(); // clear ongoing searches
              fa_ajax_search.wait = window.setTimeout(function() {
                fa_ajax_search.query(caller);
              }, fa_ajax_search.delay);
            },
            // create the search result popup
            createPopup : function (caller) {
              if (!fa_ajax_search.popup) {
                var popup = document.createElement('DIV');
                popup.className = 'fa_ajax_search-results';
                popup.innerHTML =
                  '<a href="javascript:fa_ajax_search.clear();" class="fa_ajax_search-close" title="' + fa_ajax_search.lang.close + '">X</a>'+
                  '<div class="fa_ajax_search-title">' + fa_ajax_search.lang.title + '</div>'+
                  '<ul class="fa_ajax_search-topics"></ul>'+
                  '<p style="text-align:center;">'+
                    '<a href="#" class="button1">' + fa_ajax_search.lang.view_all + '</a>'+
                  '</p>';
                fa_ajax_search.popup = popup;
              }
              fa_ajax_search.popup.getElementsByTagName('UL')[0].innerHTML = '<li>' + fa_ajax_search.lang.searching.replace('{KEYWORDS}', caller.value) + '</li>';
              fa_ajax_search.popup.lastChild.getElementsByTagName('A')[0].href = fa_ajax_search.url(caller);
              caller.parentNode.appendChild(fa_ajax_search.popup);
            },
            // submit a search
            query : function (caller) {
              fa_ajax_search.createPopup(caller);
              fa_ajax_search.request = $.get(fa_ajax_search.url(caller), function(d) {
                fa_ajax_search.showResults(caller, $('.topictitle', d));
              });
            },
            // create and return the search URL
            url : function (caller) {
              var form = $(caller).closest('form')[0],
                  where = form ? form.search_where : null;
              return '/search?search_keywords=' + encodeURIComponent(caller.value) + '*' + ( where ? '&search_where=' + where.value : '' );
            },
            // show the results in the popup
            showResults : function (caller, results) {
              var i = 0,
                  j = results.length,
                  list = fa_ajax_search.popup.getElementsByTagName('UL')[0],
                  frag = document.createDocumentFragment(),
                  li;
              if (j) {
                for (; i < j; i++) {
                  li = document.createElement('LI');
                  results[i].href = results[i].href.replace(/%2A$/, '');
                  li.appendChild(results[i]);
                  frag.appendChild(li);
                }
                list.innerHTML = '';
                list.appendChild(frag);
              } else {
                list.innerHTML = '<li>' + fa_ajax_search.lang.no_results.replace('{KEYWORDS}', caller.value) + '</li>';
              }
            },
            // initialize the selected input(s)
            init : function (node) {
              $(node).keyup(function() {
                if (this.value.length >= 3) {
                  fa_ajax_search.queue(this);
                } else {
                  fa_ajax_search.clear();
                }
              }).attr('autocomplete', 'off');
            },
            // clear and abort ongoing searches
            clear : function () {
              if (fa_ajax_search.wait) {
                window.clearTimeout(fa_ajax_search.wait);
                delete fa_ajax_search.wait;
              }
              if (fa_ajax_search.request) {
                fa_ajax_search.request.abort();
                delete fa_ajax_search.request;
              }
              if (fa_ajax_search.popup && fa_ajax_search.popup.parentNode) {
                fa_ajax_search.popup.parentNode.removeChild(fa_ajax_search.popup);
              }
            }
          };
          // search result styles
          $('head').append(
            '<style type="text/css">'+
              '.fa_ajax_search-results {'+
                'font-family:arial, verdana, sans-serif;'+
                'font-size:12px;'+
                'text-align:left;'+
                'white-space:normal;'+
                'background:#FFF;'+
                'border:1px solid #CCC;'+
                'box-shadow:0 6px 12px rgba(0, 0, 0, 0.175);'+
                'margin-top:3px;'+
                'position:absolute;'+
                'z-index:1;'+
              '}'+
              '.fa_ajax_search-title {'+
                'color:#FFF;'+
                'background:#69C;'+
                'font-size:16px;'+
                'height:25px;'+
                'line-height:25px;'+
                'margin:-1px -1px 0 -1px;'+
                'padding:0 40px 0 6px;'+
              '}'+
              '.fa_ajax_search-results a.fa_ajax_search-close {'+
                'color:#FFF !important;'+
                'background:none;'+
                'display:block;'+
                'position:absolute;'+
                'top:-1px;'+
                'right:-1px;'+
                'text-align:center;'+
                'text-decoration:none !important;'+
                'font-size:18px;'+
                'line-height:25px;'+
                'height:25px;'+
                'width:35px;'+
                'margin:0 !important;'+
                'padding:0 !important;'+
              '}'+
              '.fa_ajax_search-results a.fa_ajax_search-close:hover { background:#F33 !important; }'+
              '.fa_ajax_search-results > p { padding:3px; }'+
              '.fa_ajax_search-topics {'+
                'width:100%;'+
                'max-height:300px;'+
                'overflow-y:auto;'+
                'overflow-x:hidden;'+
              '}'+
              '.fa_ajax_search-topics {'+
                'color:#333;'+
                'border-top:1px solid #CCC;'+
                'border-bottom:1px solid #CCC;'+
                'padding:0 !important;'+
              '}'+
              '.fa_ajax_search-topics li {'+
                'padding:3px;'+
                'display:block !important;'+
                'line-height:14px !important;'+
              '}'+
              '.fa_ajax_search-topics li:nth-child(even) { background:rgba(0, 0, 0, 0.05); }'+
              '.fa_ajax_search-topics li:nth-child(odd) { background:rgba(0, 0, 0, 0.1); }'+
              '.fa_ajax_search-topics a.topictitle, #ipbwrapper .fa_ajax_search-results > p > a {'+
                'font-size:12px;'+
                'font-weight:normal !important;'+
                'padding:0 !important;'+
                'background:none !important;'+
              '}'+
            '</style>'
          );
          // wait for the document to be ready before initializing
          $(function() {
            fa_ajax_search.init(fa_ajax_search.input_fields);
          });
        }());


Pensez a cliquer sur le bouton Valider


Voilà,c'est tout pour le moment.
Un soucis?
Direction l'entraide clin oeil
https://www.milouze14.com/f108-entraide-tous-supports


Dernière édition par Milouze14 le Sam 13 Avr - 19:31:09, édité 2 fois

Icône par defaut Re: [EDGE] Auto suggestion de la recherche

#594790
chrisnvidia
chrisnvidia
Milouzien

Messagechrisnvidia le Sam 10 Mar - 21:56:46

Merci Philippe pour cette astuce clin oeil

Icône par defaut Re: [EDGE] Auto suggestion de la recherche

#603750
Splash
Splash
Milouzien

MessageSplash le Mar 30 Oct - 17:10:17

Icône par defaut Re: [EDGE] Auto suggestion de la recherche

#603751
Splash
Splash
Milouzien

MessageSplash le Mar 30 Oct - 17:10:36

Voir le sujet précédent Voir le sujet suivant Revenir en haut

Créer un compte ou se connecter pour répondre

Vous devez être membre pour répondre.

S'enregistrer

Rejoignez notre communauté ! C'est facile !


S'enregistrer

Connexion

Vous êtes déjà membre ? Aucun soucis, cliquez ici pour vous connecter.


Connexion

Astuces Forumactif :: Astuces Forumactif :: Les astuces EDGE

 
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum
© phpBB | Signaler un abus