[javascript] Búsqueda inteligente (ajax)
Tema iniciado por y Añadir a favoritosResuelto

17/04/2014

[codebox]

[/codebox]

[hidecode]

Código:: (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 : 'Search Results', searching : 'Searcing topics for "{KEYWORDS}"...', no_results : 'No results were found for "{KEYWORDS}"', view_all : 'View in search page', close : 'Close' }, // 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); }); }());

[/hidecode]
[likepost][time="15/07/18 - 12:45 hrs."][avatar="https://imgfast.net/users/3214/29/54/58/avatars/gallery/origin10.png" user_id="http://www.opensourcephpbb3.com/u286"][userlike="http://www.opensourcephpbb3.com/u286"] MateusAnjosV[/userlike], [time="24/06/18 - 16 hrs."][avatar="https://www.opensourcephpbb3.com/users/3214/29/54/58/avatars/gallery/origin10.png" user_id="https://www.opensourcephpbb3.com/u286"][userlike="https://www.opensourcephpbb3.com/u286"] MateusAnjosV[/userlike][/likepost]