Best jQuery Editable Plugins & Tutorials with Demo
Add edit delete Rows dynamically using jQuery & Php
Today we are going to design a dynamic table, in which we can dynamically add rows to table using javascript remove rows number of times without refreshing a page even once and thats also with cool javascript animation.
This scripts turns table into editable grid, You can add new row, edit existing row, delete row also you can edit a single cell and all this happens with ajax so not even single page refresh required. This is configurable script so you can easily attach it to your existing page.
HTML5 Inline Edit with PHP, MYSQL & jQuery Ajax
Now a days, We are always looking for easiest way for people to interact with our Web Applications. I am going to tell you about In-Place Editing or Inline Editing. Popular websites like facebook wants their user to edit their profile information without having to navigate to different form.
HTML5′s new attribute called contenteditable , It takes care of inline editing automatically. We should write little jQuery code to send the data back to the server, so we can save it. Biggest advantage is we don’t need to create and toggle hidden forms.
Tiny editable jQuery Bootstrap Spreadsheet
This tiny (3KB, < 120 lines) jQuery plugin turns any table into an editable spreadsheet. Here are the key features:
- No magic – works on a normal HTML table (so you can plug it in into any web table)
- Supports validation and change events (so you can warn about invalid input or prevent invalid changes)
- Uses standard DOM focus for selection (so does not interrupt scrolling or tabbing outside the table)
- Native copy/paste support
- Does not force any styling (so you can style it any way you want, using normal CSS)
- Works well with Bootstrap
- Depends only on jQuery
Rich_textarea : jQuery UI plugin replacement for a TEXTAREA
Rich_TextArea is a jQuery plugin replacement for the venerable HTML TEXTAREA that adds arbitrary triggered autocompletes along with the insertion of rich “embedded objects” included images, links, or any other markup.
Rich_TextArea is not a WYSIWYG editor. It’s intended to be a replacement for a plain TEXTAREA with some additional features including:
- dropdown autocomplete support based on definable trigger characters such as @mentions, #tags, etc.
- insertion of arbitrary markup to represent “embedded objects”, such as images, links, etc. which are treated as single entities from the point of view of cursor movement and mouse selections.
- regular expression triggered callbacks enabling things like in-line URL rewriting, smiley insertion, etc.
- generation of a plain text representation of the editable area.
jinplace : jQuery Plugin for in-place Data Editing
This is a plugin for jQuery for in-place editing of data on the page. The intended way to use it is for the editable fields on the web page to be marked up with HTML data-* attributes. The plugin call can be placed in a page template and when it runs it finds all the fields that have been marked as editable.
Features:
- Primarily driven by markup on the page.
- Can also use javascript configuration.
- Framework independent.
- Works with IE6-8 and all modern browsers, including mobile.
- Supports text input fields.
- Supports textarea input fields.
- Supports select dropdown fields.
- Data to be edited can be supplied as an attribute of the element, rather than using the existing text within the element.
- Data to be edited can be retrieved from the server just before editing.