# vitalets/x-editable

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/vitalets-x-editable).**

6,505 stars · 1,680 forks · JavaScript · MIT

## Links

- GitHub: https://github.com/vitalets/x-editable
- Homepage: http://vitalets.github.io/x-editable
- awesome-repositories: https://awesome-repositories.com/repository/vitalets-x-editable.md

## Description

x-editable is a jQuery in-place editing library that converts static content into editable fields. It functions as an inline content editor, allowing updates to be made directly on a webpage without the need for page navigation.

The library includes a customizable input renderer that supports diverse formats such as text fields, date pickers, and rich text editors. It also features a client-side input validator to verify edited values against specific rules before changes are committed.

The toolkit integrates with UI frameworks including Bootstrap and jQuery UI. It provides configurable interaction triggers, such as single or double clicks, to activate the editing mode.

## Tags

### User Interface & Experience

- [In-Place Editing Inputs](https://awesome-repositories.com/f/user-interface-experience/in-place-editing-inputs.md) — Converts static content into editable fields using inline or popup modes to update information without page navigation. ([source](https://github.com/vitalets/x-editable/blob/master/package.json))
- [Input Validation Rules](https://awesome-repositories.com/f/user-interface-experience/form-and-input-management/form-validation/input-validation-rules.md) — Verifies edited values against client and server rules to ensure data correctness before committing changes. ([source](http://vitalets.github.io/x-editable))
- [Input Component Renderers](https://awesome-repositories.com/f/user-interface-experience/input-component-renderers.md) — Offers a set of diverse editable formats including text fields, date pickers and rich text editors.
- [Input Type Definitions](https://awesome-repositories.com/f/user-interface-experience/input-field-enhancements/input-field-initializers/styled-input-fields/input-type-definitions.md) — Supports a variety of input formats including text fields, date pickers, and rich text editors. ([source](http://vitalets.github.io/x-editable))
- [Inline Editors](https://awesome-repositories.com/f/user-interface-experience/ui-components/text-editors/inline-editors.md) — Implements a UI pattern that replaces static text with input fields for updates without page navigation.
- [Interaction Trigger Configurations](https://awesome-repositories.com/f/user-interface-experience/interaction-trigger-configurations.md) — Allows users to define how an editable element activates, such as through single clicks or double clicks. ([source](http://vitalets.github.io/x-editable))

### Web Development

- [Client-Side Input Validators](https://awesome-repositories.com/f/web-development/client-side-input-validators.md) — Checks user entries against specific rules immediately after editing to ensure data correctness before server transmission.
- [jQuery Plugins](https://awesome-repositories.com/f/web-development/jquery-plugins.md) — Adds interactive input fields and date pickers to existing web pages as a jQuery plugin.
- [Asynchronous State Synchronizations](https://awesome-repositories.com/f/web-development/asynchronous-state-synchronizations.md) — Provides asynchronous synchronization of edited values to a remote server using AJAX requests.
- [Pre-Commit Input Callbacks](https://awesome-repositories.com/f/web-development/response-validation/validation-failure-callbacks/pre-commit-input-callbacks.md) — Implements callback-based logic to verify user input before committing changes to the data source.

### Software Engineering & Architecture

- [Interaction Triggers](https://awesome-repositories.com/f/software-engineering-architecture/event-driven-triggers/interaction-triggers.md) — Monitors user clicks or double-clicks to trigger the transition from read-only text to editable fields.

### Part of an Awesome List

- [UI Frameworks](https://awesome-repositories.com/f/awesome-lists/devtools/ui-frameworks.md) — In-place editing for various frameworks.