Best jQuery jSON Plugins & Tutorials with Demo

    Formbuilder.js : Graphical Interface to build Webforms

    Formbuilder.js : Graphical Interface to build Webforms

    Formbuilder is a graphical interface for letting users build their own webforms. Think Wufoo or Google Forms, but a lightweight component that can be integrated into your application.

    As of right now, Formbuilder only handles the client-side logic of creating a form. It will output a structured JSON representation of your form, but saving the form, rendering it on the server, and storing users’ responses is all up to you. I’m planning on releasing a Rails gem to handle this logic, but the ETA on that is pretty up in the air. If you’d like to help, feel free to reach out.

    jQuery plugin for caching forms using HTML5 local storage

    jQuery plugin for caching forms using HTML5 local storage

    In this tutorial we’ll be utilizing the localStorage mechanism to store the current state of a form. This means that when the page is reloaded or the user re-opens the page after closing it the form will be populated with the previous values. For improved complexity, we’ll be storing the data as serialized JSON strings.

    Wikipedia : jQuery Plugin for Wikipedia API

    Wikipedia : jQuery Plugin for Wikipedia API

    jQuery plugin for easy reloading of data from Wikipedia about Wikipedia API using JSON. invite must be passed to a Wikipedia page title. The second parameter can be a number of settings for the presentation to be made.

    Reddit Image Browser with jQuery & Html5

    Reddit Image Browser with jQuery & Html5

    Reddit Image Browser is a client-side image browser for Reddit. The application uses jQuery to fetch and process unauthenticated JSONP. Some rendering is done with D3.js with the eventual goal of creating richer visualizations and user interactivity. HTML 5 Local Storage is used to maintain state.

    Features:

    • Runs entirely in your browser.
    • Identifies post type (i.e. NSFW, videos, self) and displays content in an appropriate format.
    • Infinite scrolling with automatic asynchronous loading.
    • Hotkeys, such as j to go to next post and c to open comments page, enable fast browsing.
    • Your subreddit selections persist across sessions via HTML 5 Local Storage.
    • Local Storage support for IE provided by Remy Sharp’s storage polyfill.
    • Retries on load error.

    Table-to-JSON jQuery Plugin

    Table-to-JSON jQuery Plugin

    A jQuery plugin that converts an HTML Table into a javascript object. Great for working with user-editable tables or accessing output from 3rd party tools.

    jQuery Terminal Emulator : Creating Command line interpreters

    jQuery Terminal Emulator : Creating Command line interpreters

    jQuery Terminal Emulator is a plugin for creating command line interpreters in your applications. It can automatically call JSON-RPC service when user type commands or you can provide you own function in which you can parse user command. It’s ideal if you want to provide additional functionality for power users. It can also be used to debug your aplication.

    Features:

    • You can create interpreter for your JSON-RPC service with one line of code.
    • Support for authentication (you can provide function when user enter login and password or if you use JSON-RPC it can automatically call login function on the server and pass token to all functions)
    • Stack of interpreters – you can create commands that trigger additional interpreters (eg. you can use couple of JSON-RPC service and run them when user type command)
    • Support for command line history it use Local Storage if posible
    • Include keyboard shortcut from bash like CTRL+A, CTRL+D, CTRL+E etc.

    form2js : jQuery library for collecting form data

    form2js : jQuery library for collecting form data

    Convenient way to collect structured form data into JavaScript object. Because everything is better with jQuery, jQuery plugin added, check out jquery.toObject.js.

    This is not a serialization library. Library used in example for JSON serialization is http://www.json.org/js.html Structure of resulting object defined by name attribute of form fields. See examples below. All this library doing is collecting form data and putting it in javascript object. Obviously you can get JSON/XML/etc string by serializing it, but it’s not an only purpose.

    bootstrap-ajax : Adding declarative ajax functionality to your website

    bootstrap-ajax : Adding declarative ajax functionality to your website

    This plugin is designed to work with Twitter Bootstrap to enable declarative AJAX support.

    No more writing the same 20 line $.ajax blocks of Javascript over and over again for each snippet of AJAX that you want to support. Easily extend support on the server side code for this by adding a top-level attribute to the JSON you are already returning called "html" that is the rendered content. Unlike a backbone.js approach to building a web app, bootstrap-ajax leverages server side template rendering engines to render and return HTML fragments.

    jQuery Product Filtering and Categorization

    jQuery Product Filtering and Categorization

    Elegant way of product filtering and categorization. Easily editable json driven structure with smooth effects and visualisation.

    Features:

    • Json driven readable database
    • Full screen or limited usage
    • Includes two themes as grey and sephia and psd files
    • Runtime image loading for performance
    • Commented and qualified javascript code with JSLint

    Voting System Youtube Style With jQuery & PHP

    Voting System Youtube Style With jQuery & PHP

    Voting system can be important part of any website, especially if you want to keep track of user ratings. Let’s create a cookie based voting system, similar to YouTube like & dislike buttons (Thumbs up & Thumbs down), which can be applied to any content in php and jQuery.