Best jQuery Editable Plugins & Tutorials with Demo

jQuery Responsive Miller Columns

jQuery Responsive Miller Columns

This is a Jquery plugin that implements Miller Columns with responsive design. Miller columns (also known as Cascading) are a browsing/visualization technique that can be applied to tree structures. The columns allow multiple levels of the hierarchy to be open at once, and provide a visual representation of the current location.

Form Designer : A JQuery Form Builder tool

Form Designer : A JQuery Form Builder tool

FORM-DESIGNER is a jQuery form builder tool which will help you to build an interactive form to use in your website template. This is mainly a HTML developer’s tool, but anyone who have a little knowledge about CSS and HTML structure and use of them, can use this tool. I try to keep this jquery application very simple and user-friendly so that anyone can understand it within one or two tries.In this tool you will get total 7 option to create form from 7 different template and one option to create a custom form. As a final output, you will get the HTML,CSS and jQuery code here.

LobiList : jQuery plugin for ToDo List

LobiList : jQuery plugin for ToDo List

LobiList is jQuery plugin for todo lists. Supports drag & drop of todos. Multiple lists with different colors.

Features:

  • Multiple list support
  • Different styles
  • Drag & drop list
  • Drag & drop todos
  • Ajax configuration urls for todo CRUD
  • Checkboxes to mark/unmark todo as done
  • Powerful event management

flextabledit : jQuery Flexible Table Editor

flextabledit : jQuery Flexible Table Editor

flextabledit is a jQuery plugin that allows users to create, edit and manage grid cells that are arranged in table columns and rows. It is particularly usefull in enviroments where the user must be given the possibility to completely define both the structure and the content of a table; e.g. on a form of a web page.

GIjgo : jQuery plugin for Interaction controls to HTML Table

GIjgo : jQuery plugin for Interaction controls to HTML Table

jQuery Grid by Gijgo.com is a plug-in for the jQuery Javascript library. It is a very fast and extandable tool, and will add advanced interaction controls to any HTML table. This plugin support pagination, javascript and server side data sources, jQuery UI and Bootstrap.

Evolutility.js : Web UI Library for Tables & Forms

Evolutility.js : Web UI Library for Tables & Forms

Evolutility provides a set of generic Backbone Views to browse, edit, filter, export and chart Backbone models and collections of different structures. With it you configure views with metadata instead of hand-coding templates, Javascript and CSS.

jsGrid : jQuery Lightweight Grid Plugin

jsGrid : jQuery Lightweight Grid Plugin

jsGrid is a lightweight client-side data grid control based on jQuery. It supports basic grid operations like inserting, filtering, editing, deleting, paging and sorting. Although jsGrid is tunable and allows to customize appearance and components.

Wysiwyg.js : jQuery Wysiwyg Editor

Wysiwyg.js : jQuery Wysiwyg Editor

‘wysiwyg.js’ is a (minified) 12k contenteditable-editor with no dependencies. There is also a (minified) 10k jQuery-plugin ‘$.wysiwyg()’ to create a full-featured editor.It does only:

  • Transforms any HTML-element into contenteditable
  • onselection-event: e.g. to open a toolbar
  • onkeypress-event: e.g. to handle hotkeys
  • onplaceholder-event: show/hide a placeholder
  • .bold(), .forecolor(), .inserthtml(), … functions

Dynamic Pricing Table with CSS3 & jQuery

Dynamic Pricing Table with CSS3 & jQuery

I’m going to recreate a Dynamic Pricing Table inspired by the pricing table from Website Chef. The main point of this is to have an editable list of options that will recalculate the features and price of the whole table. As you toggle different addable “Packages” extra features will pop into view in the table as well as updating the overall price.

Editable Listview : jQuery Mobile Plugin

Editable Listview : jQuery Mobile Plugin

A jQuery Mobile Plugin with an intuitive UI to add new list items and remove existing ones.