Ajax Search Snippet
With all of the AJAX talk going around I thought it was time to add some to my site. This Modx snippet turns the FlexSearchForm snippet into an AJAX site search. The reults from the search are loaded right in the page for the user. If the user does not have javascript, the snippet will use the default searching of the FlexSearchForm snippet.
Let me get these items out of the way before I get into using the snippet.
- This code is based off of the FlexSearchForm snippet created by jaredc.
- The javascript code is based off of the example by Steve Smith of orderedlist.com.
- The loading images I have included are from mentalized.net.
- The search highlighting plugin is modified from Susan Ottwell's (http://www.sottwell.com) original code.
- Thanks goes to eastbind and the Japanese Modx forum for utf-8 encoding additions.
- Thanks to Ryan Thrash (http://www.vertexworks.com) for the assistance in creating some of the new features.
Note: For this code to work you must include a call to the prototype and the script.aculo.us javascript libraries in your template. This is done automatically with the addJscript parameter unless you set it to 0.
If you would like to see this snippet in action use the search box on the right. You can disable javascript as well to see how the search will still work without it.
Updated: 05/18/2006 - I have added the code from Thomas (Shadock) to the main snippet to allow for live searching (i.e. results as you type). There is a new parameter that goes along with this. If you add the parameter &ajaxSearchType=`1` you will turn on the live search. I have also updated the scriptaculous effects to run in succession so the effects look better.
Updated: 04/29/2006 - The code from Eastbind and the japanese community has been integrated for utf-8 encoding. The code has been modified to work with Marcs tag cloud snippet. The plugin Search_Highlight has been included to carry the search highlighting to the linked page (modified from sottwells code). The inital text is removed when a search is started. The javascript is added to the page automatically through the api (this will not work correctly unless you upgraded your Modx version to 0.9.2.1). This can also be removed through a parameter.
Updated: 04/03/2006 - To make the search even better, I have added the search highlighting code form Marc (MadeMyDay). The updated code can be found in the downloads. You need to update all of the files excluding the images for this to work correctly.
Updated: 03/20/2006 - After receiving some feedback I have modified the snippet a little. There is now a button that appears to close the search box after a search. Also I have made the snippet output the parameters set in the snippet to a bit of javascript so that I can use them in the ajax call. So you do not have to update the file ajaxSearch.php for your search settings. A thank you goes out to sottwell for these great ideas.
For more information on AjaxSearch including parameters, examples, and change log information go here:
AjaxSearch Snippet Development Area
15
14
Hi everyone, I am trying to figure out why when I reload a page, the AjaxSearch.js and mootools.js are included again. Because of this, the search only works once. Has anybody had this problem?
Cheers!
13
Hello,
the snippet is great and works fine for my site. But one thing runs wrong. The "view all results page" does not show special chars like ä, ü ... intead it shows ? (and no highlight, thougH the css is there). The entire site is set to work with utf-8 charset and the Ajax result div shows correctly.
Do you have an idea?
12
hi!
has anyone already solved this problem? i get this error in IE:
EXCEPTION AJAX: 'message' is null or not an object undefined
in FF it says something like:
EXCEPTIONAL AJAX: e has no properties
anyone a clue?
11
Have just added search to a site but keep getting the following error message whenever a search is attempted:
EXCEPTION AJAX: 'message' is null or not an object undefined
Any ideas gratefully received...
9
hey, can't we display the search results on any location of the page. Now the search results displaying in the same location. I would like to know can i display the search textfied and search button in a one place.E.g<div id="search"></div>. Then the search results in <div id="results"></div>. I want to display the search results on the same page. Thanks !!
8
Sorry, it's my mistake in the first time. Now it's working !! thanks for developing this Snippet
7
Wonderfull ! It's a great snippets ... but when i traduce in French ($resultsIntroFailure = 'There were no search results. Please try using more general terms to get more results.'; replace by $resultsIntroFailure = 'Désolé, pas de résultats'; and so one), sometimes, i 've got a fatal error ! To progress, the only solution i find is to ... paste the initial code. :\
Any ideas to help me ? Thanks





[URL=http://nnupbsmi.com]cngszxfn[/URL] yvtiazmi http://qheidgef.com yggfraze pxndebns <a href="http://abfqrltn.com">pyojjgqd</a>