Best jQuery Ajax Plugins & Tutorials with Demo

    jKit : jQuery based UI Toolkit

    jKit : jQuery based UI Toolkit

    A very easy to use, cross platform, jQuery based UI toolkit, that’s still small in size, has the features you need, and doesn’t get in your way of doing things!

    MelonHTML5 – jQuery Royal Tab

    MelonHTML5 - jQuery Royal Tab

    Royal Tab is all in one, performance optimized Tab Solution that provides full tab functionalities and its own unique features. It can be easily integrated into any websites with simple & clean HTML markup. All major browsers (Chrome, Firefox, Safari, IE7+, Opera) and Mobile Devices are supported. Royal Tab also comes with Responsive Design, 4 Themes and full API Methods that can be used to interact with your Web App in your own way.

    jui_datagrid : jQuery Ajax Datagrid plugin

    jui_datagrid : jQuery Ajax Datagrid plugin

    jui_datagrid is an Ajax-enabled jQuery plugin, useful to manipulate database data in tabular format.

    Fully customizable, simple but powerful API, jQuery themes compatible, localization support. It has a modular design, so it is using jui_pagination plugin for paging and jui_filter_rules plugin for searching.

    jQuery jAutocomplete Plugin

    jQuery jAutocomplete Plugin

    jAutocomplete is a flexible jquery plugin that provides suggestions while you type into the field:

    Features:

    • JSON data source (local data array / AJAX)
    • Supports any HTML structure with next-generation jQuery Templates
    • Lightweight (only 3Kb)
    • Fully customizable styles
    • Works in all major browsers
    • Annotated source code
    • JSDoc documentation

    jQuery Tabs Widget with Ajax Content

    jQuery Tabs Widget with Ajax Content

    In this tutorial I want to demonstrate one such method for creating dynamic content tabs. We will load in external HTML data from local files pulled via Ajax commands. This technique has been simplified over the years so we aren’t struggling to build multiple XMLHttpRequest calls. Check out the demo page below and see what we’ll be creating.

    How to Make a Tumblr-powered News Ticker in jQuery

    How to Make a Tumblr-powered News Ticker in jQuery

    Tumblr is a blogging service with an elegant interface for creating and publishing content. In this tutorial, we are going to use it as the foundation of a news publishing system. We are going to develop a simple widget which cycles through the most recent posts on a Tumblr blog, and presents them as news items to your users. Adding news will be done by creating new blog posts in your Tumblr dashboard.

    The code we are writing will be organized as a jQuery plugin, which will make it portable and easy to embed in an existing website. When the plugin is run, it will request the latest posts from your blog with AJAX

    opentip : JavaScript Tooltip framework

    opentip : JavaScript Tooltip framework

    Opentip is an open source javascript tooltip based on the protoype framework.

    Features:

    • Stems (little pointers)
    • Automatic content download with AJAX
    • Different styles
    • Automatic repositioning of the tooltip if it’s not in the viewport of the browser anymore
    • All kind of triggers (The tooltip can be triggered by mouse over, click, form submit,… everything you can think of really)
    • CSS3 Animations
    • Well tested, with over 200 unit tests

    uLike : Ajax content like system with jQuery

    uLike : Ajax content like system with jQuery

    uLike is a simple and easy to install content like system. You can have a unique like button on each different content element on your page. Each like button is it’s own seperate identity and is stand alone from the others. The system is based on the content’s parent div, the ip of the user, and the page in which it’s on.

    Features:

    • Allow your visitors to like your content!
    • Jquery Plugin utilizing Ajax & php
    • Seperate like buttons for each content area you specify
    • Likes are based on IP address, so, one like for one user
    • Like buttons are based on parent element, ip address, and page

    Make Pretty Charts For Your App with jQuery and xCharts

    Make Pretty Charts For Your App with jQuery and xCharts

    Charts are a great visual aid when presenting data. You can’t build a professional admin panel without them. They are also tricky to set up. However, there is a new library that makes things easier – xCharts. Today, we are going to use it along with the daterange picker for Twitter Bootstrap, to build a pretty, AJAX-powered chart for your web application that fetches data from a MySQL table.

    FastLinks : jQuery Load all content with ajax

    FastLinks : jQuery Load all content with ajax

    FastLinks is a library which allows you to load the links on your website with ajax calls. With this library your website will load a lot faster. This library uses jQuery and the html5 history API. (The history api works in all browsers except IE, but the library works in all browsers. The only is that the url in the navigation bar updates in all browsers but IE). This plugin is tested in: IE7, IE8, IE9, Chrome 23, Firefox 15, Safari 5 and Opera 12.