Edición en línea
Componente de edición en línea con clic para editar, con estilos de texto, área de texto y selector. Soporta guardado automático al perder el foco, PATCH opcional al servidor y atajos de teclado. Enter para guardar (texto/selector), Ctrl+Enter para guardar (área de texto), Escape para cancelar.
Texto
Edición de texto en línea de una sola línea
_inline_edit.html.erb
███ ███████ ███████ ██████ ███ ████ ████ █████████████ █████ ████████████ ██████ ██ ██████ ██████████ ██
████ █████████████████████████████
███████████████████████████████ ███ ███
████████████████████████████████████████ ████████████ ███
█████████████████████
█████ █████████████████████████████████
█████████████████████████████████████
█████████████████████ ████ ████ ██████████ ██████████████████ ███████████████████████ ██████████████ ███████████████ █████████████████ ████████████ ███ ███████████████ ███████████████████ ███████ ██ ████████████ ████
███ ██████████████ ██ ███████████ ██
███████
inline_edit_controller.js
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ ███████████ █████████ ████████
██████ ██████ █ █
████ ███████
███████████ █ █████ ████████ ████████ ████ █
█
█████████ █
inline_edit_text_component.html.erb
████ █████████████████████████████
███████████████████████████████ ████ ███
████████████████████████████████████████ █████████████ ███
█████████████████████
█████ █████████████████████████████████
█████████████████████████████████████
██████████ ███████████████ ████
███ ████████████ ██
███████
████ ████████████████████████████████ ███████████████
inline_edit_text_component.rb
█ ██████████████████████ ████
█████ ███████████████████████ █ ███████████████████
███ █████████████████ ██████ ███ ████ ████ █████████████ █████ ████████████ ██████ ██ ██████ ████████
█████ █ ████
██████ █ █████
████ █ ███
█████████████ █ ████████████
████████████ █ ███████████
██████████████ █ █████████████ ██ ██
inline_edit_controller.js
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ ███████████ █████████ ████████
██████ ██████ █ █
████ ███████
███████████ █ █████ ████████ ████████ ████ █
█
█████████ █
\xC1rea de texto
Edición de texto en línea multilínea
_inline_edit.html.erb
███ ███████ ███████ ██████ ███ ████ ████ █████████████ █████ ████████████ ██████ ██ ██████ ██████████ ██
████ █████████████████████████████
███████████████████████████████ ███ ███
████████████████████████████████████████ ████████████ ███
███████████████████ ████████
█████ █████████████████████████████████
█████████████████████████████████████
█████████████████████ █████ ████ ████ ██████████ ██████████████████ ███████████████████████ ██████████████ ███████████████ █████████████████ ████████████ ███████████████████ ███ ███████████████ ███████████████████ ███████ ██ ████████████ ████
███ ██████████████ ██ ███████████ ██
███████
inline_edit_controller.js
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ ███████████ █████████ ████████
██████ ██████ █ █
████ ███████
███████████ █ █████ ████████ ████████ ████ █
█
█████████ █
inline_edit_textarea_component.rb
█ ██████████████████████ ████
█████ ███████████████████████████ █ ███████████████████
███ █████████████████ ██████ ███ ████ ████ █████████████ █████ ████████████ ██████ ██ ██████ ████████
█████ █ ████
██████ █ █████
████ █ ███
█████████████ █ ████████████
████████████ █ ███████████
██████████████ █ █████████████ ██ ██
inline_edit_textarea_component.html.erb
████ █████████████████████████████
███████████████████████████████ ████ ███
████████████████████████████████████████ █████████████ ███
███████████████████ ████████
█████ █████████████████████████████████
█████████████████████████████████████
██████████ ███████████████ ████
███ ████████████ ██
███████
████ ████████████████████████████████ ███████████████
inline_edit_controller.js
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ ███████████ █████████ ████████
██████ ██████ █ █
████ ███████
███████████ █ █████ ████████ ████████ ████ █
█
█████████ █
Selector
Edición en línea con lista desplegable
_inline_edit.html.erb
███ ███████ ███████ ██████ ███ ████ ████ █████████████ █████ ████████████ ██████ ██ ██████ ████████ ███ ████████ ██
██
███████████████ █ ████████████ █ ███ ██████████████ ██ ██████████ █
█████████████ █ ███████████████ █ ███████████████████████ █ ███
██
████ █████████████████████████████
███████████████████████████████ ███ ███
████████████████████████████████████████ ████████████ ███
█████████████████████
█████ █████████████████████████████████
inline_edit_controller.js
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ ███████████ █████████ ████████
██████ ██████ █ █
████ ███████
███████████ █ █████ ████████ ████████ ████ █
█
█████████ █
inline_edit_select_component.html.erb
████ █████████████████████████████
███████████████████████████████ ████ ███
████████████████████████████████████████ █████████████ ███
█████████████████████
█████ █████████████████████████████████
█████████████████████████████████████
██████████ ███████████████ ████
███ ████████████ ██
████ ██████████ ███ ██████████████ ████████████████████ ███████████ █████████████████████ ██████████ █ ██ ████
█████ ██████████████████████ ███████████████████████ ████████████████ ██████ ████ ██████ ██
inline_edit_select_component.rb
█ ██████████████████████ ████
█████ █████████████████████████ █ ███████████████████
███ █████████████████ █████████ ██████ ███ ████ ████ █████████████ █████ ████████████ ██████ ██ ██████ ████████
█████ █ ████
████████ █ ███████
██████ █ █████
████ █ ███
█████████████ █ ████████████
████████████ █ ███████████
inline_edit_controller.js
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ ███████████ █████████ ████████
██████ ██████ █ █
████ ███████
███████████ █ █████ ████████ ████████ ████ █
█
█████████ █
Registro de Cambios
- Initial release with text, textarea, and select styles
Obtener Acceso Completo
Desbloquea el código fuente de este componente y todos los demás. Un solo pago para acceso de por vida.
Obtener Acceso