Today’s post is a collection of 10 JSON Data with jQuery Plugins, Scripts & Tuts. Learn how to create a classy bar chart with flash like animation effects with DDChart (JSON Driven Zoomable Drill Down Bar Chart) and more… Enjoy!

Related Posts:

1. Load JSON data with jQuery, PHP and MySQL

This post shows how to populate a select box based on the value of another, by getting JSON data with jQuery from a PHP script that gets the data from a MySQL database.

Load JSON data with jQuery

Source + Demo

2. jQuery JSON Ajax Requests and Caching

This post looks at which browsers cache the requests, and how to make sure it is not cached.

jQuery JSON Ajax

Source + Demo

3. doubleSuggest

A jQuery plugin will set up a UI that suggest results as you type. It will display two types of suggestions, first (and faster) the local data and second (and slower) the results from an AJAX search query.



4. DDChart: JSON Driven Zoomable Drill Down Bar Chart

Is a JSON data driven bar chart plugin that creates a classy bar chart with flash like animation effects.


Source + Demo

5. How to build a web widget using jQuery

The interesting points will be:
> Ensure the widget’s code doesn’t accidentally mess up with the rest of the page,
> Dynamically load external CSS and JavaScript files,
> Bypass browsers’ single-origin policy using JSONP.

web widge


6. jQuery Tokeninput

jQuery plugin which allows your users to select multiple items from a predefined list, using auto completion as they type to find each item.

jQuery Tokeninput

Source + Demo

7. jQuery quickie

Unlimited scroll using jQuery. I’ve using the Twitter API to make the example, so you’ll learn a little bit about JSON too…

jQuery quickie


8. jQuery charToTable Plugin

It uses some PHP + GD to convert a character to an image, and then to a JSON object containing the glyph matrix.

jQuery charToTable


9. FlexBox – jQuery Ajax based Textbox & Selectbox

A jQuery plugin that is intended to be a very flexible replacement for html textboxes and dropdowns, using AJAX to retrieve and bind JSON data.



10. jQuery Randomly Rotating Image Gallery – Mosaiqy

Mosaiqy is a jQuery plugin for presenting images in a Mosaic-like grid interface. It retrieves images from a JSON/JSONP data source which makes integrating with image hosting services pretty easy and there are already demos for Flickr, Instagram and Panoramio.


Source + Demo

Sam Deering is a Front-end Web Developer who specialises in JavaScript & jQuery. Sam is driven and passionate about sharing his knowledge to educate others.

Free Guide:

How to Choose the Right Charting Library for Your Application

How do you make sure that the charting library you choose has everything you need? Sign up to receive this detailed guide from FusionCharts, which explores all the factors you need to consider before making the decision.

  • SteveX

    Thankyou! Great list of articles. I opened several, and found jfhovine, doublesuggest and alexmarandon article very interesting. I will be using this info coding tomorrow.

    Thanks again! Very cool.

Special Offer
Free course!

Git into it! Bonus course Introduction to Git is yours when you take up a free 14 day SitePoint Premium trial.