background preloader

Ajax

Facebook Twitter

How To Build A Real-Time Commenting System. The Web has become increasingly interactive over the years.

How To Build A Real-Time Commenting System

This trend is set to continue with the next generation of applications driven by the real-time Web. Adding real-time functionality to an application can result in a more interactive and engaging user experience. However, setting up and maintaining the server-side real-time components can be an unwanted distraction. But don’t worry, there is a solution. Cloud hosted Web services and APIs have come to the rescue of many a developer over the past few years, and real-time functionality is no different.

Why Should We Care About The Real-Time Web? In my opinion there are a number of factors that have moved real-time Web technologies to the forefront of Web application development. Social Media Data Social media, and specifically Twitter, has meant that more and more data is becoming instantly available. Increased User Expectations WebSockets How are Real-Time Technologies being used? Creating Generic Blog Commenting System Comments <? Great! Detecting Ajax Events on the Server. When working with an Ajax-enhanced website, it's generally a good idea to provide a regular request fallback for any core functionality of the site.

Detecting Ajax Events on the Server

When you work to ensure that a fallback is in place, you will be faced with determining when a particular request is an Ajax request or just a normal page request. In most situations, it's considered a best practice to build your site without Ajax first, adding the Ajax functionality afterward so the fallbacks are in place from the beginning. Fortunately, jQuery makes it super easy to differentiate the Ajax requests from normal page views.

If you were to browse the jQuery source, you would see that jQuery adds a special HTTP header to (almost) every Ajax request it makes with $.ajax(), $.get(), $.getJSON(), $.post() and .load() methods. JavaScript: if ( ! Keep in mind, though, that the header is not sent with $.getScript() or any JSONP request made with $.ajax() or $.getJSON(), since they aren't technically Ajax requests. Detection on the Server. Autocomplete local Database. AutoCompleter Tutorial As always, links to a demo and ZIP at the bottom, Enjoy!

Autocomplete local Database

I thought i would write this tutorial because most of the auto completer applications i have seen just dump the code into a zip and tell you how to use it rather than how and why it works, knowing about this enables you to customise it a lot more (this has been demonstrated with the other apps i have written here)! And so we begin:JavaScript JS Explaniation Ok, the above code it the guts to the script, this allows us to hook into the rpc.php file which carries out all the processing.

The Lookup function takes the word from the input box and POSTS it to the rpc.php page using the jQuery Ajax POST call. IF the inputString is ’0′ (Zero), it hides the suggestion box, naturally you would not want this showing if there is nothing in the text box. to search for. ELSE we take the ‘inputString’ and post it to the rpc.php page, the jQuery $.post() function is used as follows… $.post(url, [data], [callback]) PHP Explaination.

PHP AJAX Submit Forms Class.