Permalink
Browse files

New: Inlineeditor.Textarea, for editing large amounts of text inline

  • Loading branch information...
1 parent 960a5b3 commit 100188614a04a3e4b86be80a9a78a4cb083b35cd @reednj committed Sep 11, 2011
Showing with 95 additions and 1 deletion.
  1. +77 −0 Source/InlineEditor.Textarea.js
  2. +9 −1 Source/InlineEditor.css
  3. +9 −0 Test/simpletest.html
@@ -0,0 +1,77 @@
+/*
+---
+description: InlineEditor.Textarea - Simple Edit-inPlace AJAX dropdown list control
+
+license: MIT-style
+
+authors:
+- Nathan Reed
+
+requires:
+- core/1.2.4: [Class, Event, Element, Selectors, JSON, Request]
+- /InlineEditor
+
+provides: InlineEditor.Textarea
+
+...
+*/
+InlineEditor.Textarea = new Class({
+ Extends: InlineEditor,
+
+ initialize: function(elem, options) {
+ this.element = $(elem);
+ this.options = options || {};
+
+ this.parent(this.element, this.options);
+ this.edit_link.innerHTML = this.current_text;
+ },
+
+ _create_form: function() {
+ return $e('form', {
+ 'events':{'submit': function() {this.save_edit(); return false;}.bind(this)},
+ 'children': [
+ $e('div', {'children': [
+ this.edit_input = this._create_input()
+ ]}),
+
+ $e('div', {'children': [
+
+ this.save_button = $e('input', {
+ 'type':'submit',
+ 'value':this._save_button_msg
+ }),
+
+ this.cancel_button = $e('input', {
+ 'type':'button',
+ 'value':this._cancel_button_msg,
+ 'events':{'click':this.cancel_edit.bind(this)}
+ }),
+
+ this.error_span = $e('span', {'class':'ine-error'})
+ ]})
+ ]
+ });
+ },
+
+ _create_input: function() {
+ return $e('textarea', {
+ 'events': {
+ 'keydown': function(e) {
+ // detect the escape key, and use it to cancel the edit
+ if(e.key == 'esc') {
+ this.cancel_edit();
+ }
+ }.bind(this),
+ 'blur': function(e) {
+ // when in hide_buttons mode, we want to automatically cancel
+ // if the user clicks off the control.
+ if(this.options.hide_buttons){
+ this.cancel_edit();
+ }
+ }.bind(this)
+ }
+ });
+ }
+
+
+});
View
@@ -30,8 +30,16 @@
margin-left: 4px;
}
+.ine-root textarea {
+ font-family: inherit;
+ font-size: 1em;
+
+ width: 512px;
+ height: 96px;
+}
+
.ine-error {
font-size: 0.8em;
font-weight: bold;
color: red;
-}
+}
View
@@ -12,6 +12,7 @@
<script src='../Source/InlineEditor.js' type='text/javascript'></script>
<script src='../Source/InlineEditor.Combo.js' type='text/javascript'></script>
+<script src='../Source/InlineEditor.Textarea.js' type='text/javascript'></script>
<style type='text/css'>
#t-body {
@@ -77,6 +78,12 @@
method: 'POST',
data_id: '12'
});
+
+ new InlineEditor.Textarea('ta-edit', {
+ url: 'api/edittest.php',
+ method: 'POST',
+ data_id: '12'
+ });
}
}
@@ -139,6 +146,8 @@
<div id='jsonpost'>hello, world</div>
+<div id='ta-edit'>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum</div>
+
</div>
</body>

0 comments on commit 1001886

Please sign in to comment.