Class: SC.InlineTextFieldView
Extends
SC.TextFieldView.
The inline text editor is used to display an editable area for controls that are not always editable such as label views and source list views.
You generally will not use the inline editor directly but instead will
invoke beginEditing
() and endEditing
() on the views you are
editing. If you would like to use the inline editor for your own views,
you can do that also by using the editing API described here.
Using the Inline Editor in Your Own Views
To use the inlineEditor
on a custom view you should mixin SC.InlineEditable
on
it. SC.InlineTextFieldView
is the default editor so you do not need to do any
other setup. The class methods beginEditing
, commitEditing
, and discardEditing
still exist for backwards compatibility but should not be used on new views.
MyProject.MyView = SC.View.extend(SC.InlineEditable, {
});
Starting the Editor
The inline editor works by positioning itself over the top of your view with the same offset, width, and font information.
To start it simply call beginEditing
on your view.
myView.beginEditing();
By default, if the inline editor is currently in use elsewhere, it will automatically
close itself over there and begin editing for your view instead. This behavior
is defined by the inlineEditorDelegate
of your view, and can be changed by using
one other than the default.
Customizing the editor
The editor has several parameters that can be used to customize it to your
needs. These options should be set on the editor passed to your delegate's (or
view's) inlineEditorWillBeginEditing
method:
exampleFrame
-- The editors initial frame in viewport coordinates.value
-- Initial value of the edit field.exampleElement
-- A DOM element to use when copying styles.multiline
-- IfYES
then the hitting return will add to the value instead of exiting the inline editor.commitOnBlur
-- IfYES
then blurring will commit the value, otherwise it will discard the current value. Defaults to YES.validator
-- Validator to be attached to the field.
For backwards compatibility, calling the class method beginEditing
with an
options hash will translate the values in the hash to the correct settings on
the editor.
Committing or Discarding Changes
Normally the editor will automatically commit or discard its changes
whenever the user exits the edit mode by pressing enter, escape, or clicking
elsewhere on the page. If you need to force the editor to end editing, you can
do so by calling commitEditing
() or discardEditing
():
myView.commitEditing();
myView.discardEditing();
Both methods will try to end the editing context and will call the
relevant delegate methods on the inlineEditorDelegate
set on your view.
Note that it is possible an editor may not be able to commit editing
changes because either the delegate disallowed it or because its validator
failed. In this case commitEditing
() will return NO
. If you want to
end editing anyway, you can discard the editing changes instead by calling
discardEditing
(). This method will generally succeed unless your delegate
refuses it as well.
Defined in: inline_text_field.js
- Since:
- SproutCore 1.0
Field Summary
- Fields borrowed from SC.TextFieldView:
- allowsErrorAsValue, applyImmediately, autoCapitalize, autoComplete, autoCorrect, autoResizePadding, commitOnBlur, defaultTabbingEnabled, focused, formattedHint, hint, hintOnFocus, isBrowserFocusable, isContextMenuEnabled, isEditable, isEditing, isTextField, leftAccessoryView, localize, maxLength, rightAccessoryView, selection, shouldRenderBorder, spellCheckEnabled, supportsAutoResize, type, useHintOverlay
- Fields borrowed from SC.View:
- acceptsMultitouch, ariaHidden, ariaRole, attributeBindings, autoMixins, backgroundColor, childViewLayout, childViewLayoutOptions, childViews, childViewsNeedLayout, classNameBindings, classNames, concatenatedProperties, createdByParent, designMode, displayProperties, enabledState, firstKeyView, hasLayout, hasTouch, hasVisibility, isBuildingIn, isBuildingOut, isChildViewLayoutLive, isEnabled, isFixedHeight, isFixedPosition, isFixedSize, isFixedWidth, isKeyResponder, isTextSelectable, isView, isVisible, lastKeyView, layerLocationNeedsUpdate, layerNeedsUpdate, modeAdjust, nextKeyView, page, pane, parentView, previousKeyView, renderDelegateName, shouldInheritCursor, shouldInheritEnabled, tagName, themeName, toolTip, touchBoundary, transitionAdjust, transitionAdjustOptions, transitionHide, transitionHideOptions, transitionIn, transitionInOptions, transitionOut, transitionOutOptions, transitionShow, transitionShowOptions, useStaticLayout
- Fields borrowed from SC.Responder:
- hasFirstResponder, isFirstResponder, responderContext
- Fields borrowed from SC.Object:
- isDestroyed, isObject, nextProperty, object, property, target, toInvalidate
- Fields borrowed from SC.Observable:
- isObservable
- Fields borrowed from SC.Control:
- controlSize, errorLabel, fieldKey, fieldLabel, isActive, isControl, isSelected
Instance Methods
- beginEditing(original, label)
- blurEditor(evt)
- cancel()
- isTextArea()
- positionOverTargetView(target, exampleFrame, elem, _oldExampleFrame, _oldElem)
- touchStart(e)
- updateStyle(exampleElement)
Field Detail
layoutThe default size of the inline text field is 0 x 0 so that when it is appended, but before it is positioned it doesn't fill the parent view entirely.
This is important, because if the parent view layer allows overflow,
we could inadvertently alter the scrollTop
or scrollLeft
properties
of the layer.
Instance Method Detail
- Parameters:
- original
- label
Invoked whenever the editor loses (or should lose) first responder status to commit or discard editing.
- Parameters:
- evt
- Returns:
- Boolean
- Returns:
- Boolean
- Parameters:
- target
- exampleFrame
- elem
- _oldExampleFrame
- _oldElem
- Parameters:
- e
- Parameters:
- exampleElement