You know in-place editing? The cool idea is that you can edit the text inside a text field instead of opening a new page to use a separate editor.
What is In-place editing?
In-place editing (also called inline editing) is a user interface design pattern that allows users to edit content directlyon the page they are viewing.
Imagine you are writing a quick message on Facebook. But before posting it, you want to add something new. If the website supports in-place editing, then you can simply click the text and start typing.
The Best In-place Editing Plugin
In-place editing means inserting, deleting, or creating an element on the webpage without going to another page to edit.
The in-place editing plugin allows you to add a visual inline editor in your content area.
Table of contents:
Best jQuery In-Place Editing Plugins
Inline Editing With Input, Select And Textarea - jqInlineEdit
A small yet robust inline editing plugin for jQuery that makes an element act as an input field, select box or textarea when a specific event is triggered.
AJAX-enabled Edit In Place Plugin With jQuery - jeditable
A customizable edit in place plugin that turns any element into an Ajax-enabled, input- or textarea-based in-place editor for in-place editing of any data within the document.
In-place DOM Editing With jQuery - domEdit
A tiny, fast, and easy-to-use In-place/inline editing jQuery plugin that behaviors like the HTML5 contenteditable attribute and works any DOM elements like DIV, Paragraph, Table, etc.
Edit Any Element In Place - jQuery Editable
A simple, touch-friendly inline editing jQuery plugin which converts any valid html elements into an editable area (based on textarea) when double clicking/tapping on it.
Inplace/Inline Editor With Save/Cancel Buttons - jQuery inplace.js
A lightweight and easy-to-use jQuery inline editing plugin that allows visitors to edit the content of any DIV and then send the resulting change to a specific URL via AJAX.
Ajax-enabled In-place Editor For jQuery - doomEdit
Just another jQuery inline editing plugin which allows to edit and update content of an HTML element (text, table cell, editable container, etc) in its place. Click on the html element to start editing and the changed data will be saved/submitted to the server via AJAX requests (OPTIONAL).
Best Vanilla JS In-Place Editing Plugins
Medium Style Inline Rich Text Editor – Medium Editor
Minimal Inline Editor For HTML Table – HTMLInlineEdit
A rewritten version of the x-editable jQuery plugin that enables dynamic in-place editing in your web app.
Maybe we'll be able to add more plugins to this list in the future! Sharing knowledge and promoting open-source projects is our mission, so stay tuned for more collections like this one.
- 10 Best WYSIWYG Editors For Easier Content Editing
- 10 Best WYSIWYG Markdown Editors For Faster Writing
- 7 Best WYSIWYG Rich Text Editors For Vue.js