What is Ajax and how does Ajax search work?

Ajax is not so new anymore and it stands for Asynchronous JavaScript and XML. By using this technology, your script will post a request to the server and in return the script will get a response without a page reload. Like the name suggests, the submitted data should be formatted as an XML structure.

Ajax search is nothing more than a regular search query post by a web form, but the whole process is done in the background using JavaScript. The JavaScript code will use the search value from a form field for the Ajax request and the server will use the received data for a database query. The response is returned to the same Javascript file and at last passed to the HTML page.

Every time a user enters more characters into the search field, a new request is sent to the server. A typical Ajax search will work with the “input” event which is fired after the value from a form element is changed.

Ajax search vs. regular search

Based on the information above it looks like the Ajax search is a great replacement for the regular search. Sure, there are a lot of advantages:

• Basic form field validation without a server request
• Frontend and backend code are separated
• The search is faster and more user friendly
• Combine form element values without reloading the page
• Using Ajax search on static websites

But there are also disadvantages, like:

• Accessibility issues, because the response is loaded dynamically into the HTML structure
• Server side data validation is still necessary
• The browser back button doesn’t bring you back to the previous search result (compared to a result page with a query string inside the URL)
• A higher server load because a new request is submitted with every character typed in the search form
• You can’t create a (cached) pages for search results.

Which of both search interfaces is best, depends on your website and how visitors use your search function. Check your Ajax live search on different devices like iPads and cell phones. The search might not work for users on small screens.