diff --git a/skins/base/views/atoms/EditableText.js b/skins/base/views/atoms/EditableText.js index a8f55814..07bdc911 100644 --- a/skins/base/views/atoms/EditableText.js +++ b/skins/base/views/atoms/EditableText.js @@ -43,14 +43,22 @@ module.exports = React.createClass({ }, onFinish: function(ev) { - this.setValue(ev.target.value); + if (ev.target.value) { + this.setValue(ev.target.value); + } else { + this.cancelEdit(); + } }, render: function() { var editable_el; if (this.state.phase == this.Phases.Display) { - editable_el =
{this.state.value}
; + if (this.state.value) { + editable_el =
{this.state.value}
; + } else { + editable_el =
{this.props.placeHolder}
; + } } else if (this.state.phase == this.Phases.Edit) { editable_el = (
diff --git a/src/controllers/atoms/EditableText.js b/src/controllers/atoms/EditableText.js index ac469736..a3145606 100644 --- a/src/controllers/atoms/EditableText.js +++ b/src/controllers/atoms/EditableText.js @@ -22,6 +22,7 @@ module.exports = { propTypes: { onValueChanged: React.PropTypes.func, initalValue: React.PropTypes.string, + placeHolder: React.PropTypes.string, }, Phases: { @@ -33,6 +34,7 @@ module.exports = { return { onValueChanged: function() {}, initalValue: '', + placeHolder: 'Click to set', }; },