In-place Editing Javascript Library - X-editable
File Size: | 3.01 MB |
---|---|
Views Total: | 16279 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
X-editable is a javascript library inspired by bootstrap-editable plugin that invokes in-place editing feature to any element of your page. It works with bootstrap, jquery-ui, jquery only and includes both popup and inline modes.
Installation:
# NPM $ npm install X-editable --save # Bower $ bower install X-editable --save
How to use it:
1. Decide which core library you want to use.
2. Inlcude X-editable.js and X-editable CSS
<link href="bootstrap-editable/css/bootstrap-editable.css" rel="stylesheet"> <script src="bootstrap-editable/js/bootstrap-editable.js"></script>
3. Markup elements with additional data-* attributes
<a href="#" id="username" data-type="text" data-pk="1" data-url="/post" data-original-title="Enter username">superuser</a>
4. Call the function with options
//turn to inline mode $.fn.editable.defaults.mode = 'inline'; // popup default $('#username').editable({ type: 'text', pk: 1, // primary key (record id) url: '/post', // Send ajax request with new value on /post title: 'Enter username' });
Changelog:
2019-03-28
- Fixed: HTML5 inputs: the input element's type ('email') does not support selection (line 665)
- Fixed: select2 not working in Chrome 73
- Implement the activate() method so the editor will receive focus
2017-12-25
- v1.5.3
2017-01-24
- FIXED: maxYear
2017-01-15
- fix misspelling of useful
This awesome jQuery plugin is developed by vitalets. For more Advanced Usages, please check the demo page or visit the official website.