Copied from StackOveflow.com question: http://stackoverflow.com/questions/18262740/how-do-i-show-prompt-text-in-ckeditor-on-blur-without-resetting-focus
I have prompt text (default text, placeholder text, whatever you want to call it) and if the editor is empty when the user removes focus, I want to display the prompt text.
I tried using setData but that puts focus back in the text area, which is not what I want. I tried adding a callback and the internal param:
blurHandler: function(event) { if(this.isMessage() && this.editor.getSnapshot() === "") { this.editor.setData(this.options.promptText, function() { this.editor.getCommand('post').setState(CKEDITOR.TRISTATE_DISABLED); this.editor.ui.create('Post').setState(CKEDITOR.TRISTATE_DISABLED); }, true); $(this.editor.document.$).find('body').addClass('promptText'); } }
But it still puts focus in the editor.
I also tried using insertHtml, registering disableAfterPromptTextInsert as a listener for the insertHtml event:
blurHandler: function(event) { if(this.model.isMessage() && this.editor.getSnapshot() === "") { this.editor.insertHtml(this.options.promptText); } }, disableAfterPromtTextInsert: function(event) { if(event.data.dataValue === this.options.promptText) { this.editor.getCommand(this.config.enterCommand).setState(CKEDITOR.TRISTATE_DISABLED); this.editor.ui.create(this.config.enterButton).setState(CKEDITOR.TRISTATE_DISABLED); $(this.editor.document.$).find('body').addClass('promptText'); } }
Focus (or the cursor at any rate) is back in the editor after inserting the promt text. Is there any way to insert the text without setting focus?
You can use this plugin and
You can use this plugin and add a placeholder attribute to your textarea: http://ckeditor.com/addon/confighelper