CODEWITHSUNDEEP
javascriptjqueryckeditor
John Evans Solachuk
John Evans Solachuk

Reputation: 2085

How do I add a placeholder attribute to an instance of CKEditor?

Right now, using Alfonso's plugin, I'm able to add the placeholder attribute in config.js. However, since I'm adding into config.js, that means all instances will have the same placeholder text, right?

Well, I don't want all instances of my ckeditor to have the same placeholder text because I also noticed he also said :

The value can be set in the configuration or as an attribute of the replaced element

I figured this means that we can put "Type something..." as placeholder text for ckeditor1 and "Blabla..." as placeholder text for ckeditor2. How do I do that? Or that's not what he meant?

I have tried several ways including 

    var ckeditor = CKEDITOR.replace('ckeditor1');
    ckeditor.placeholder = 'Type sometheing....';

and

    var config = [];
    config['placeholder'] = 'some value'; //or config = [{placeholder:'some value'}]
    CKEDITOR.replace("myeditor" , config );

inside that particular page but to no avail... I've also cleared my cache.

Upvotes: 5

Views: 20399

Answers (5)

Konstantin Gapeev
Konstantin Gapeev

Reputation: 1

The placeholdertext plugin seems to be a nice solution. Contrary to the ConfigHelper plugin, a placeholder text doesn't get into undo/redo history.

Upvotes: 0

Jen
Jen

Reputation: 11

Something quick that might be helpful for others. I struggled getting this plugin work as well. The reason was I was using an old version of the plugin. I downloaded it from here: https://ckeditor.com/cke4/addon/confighelper and that page might confuse others too.

Almost all of the plugins from CKEditor show the most recent version on the top of the download list. Also when clicking the "Download" button it typically downloads the newest version of the plugin. That is not the case with this plugin. "Download" gets the oldest version and the oldest version is also listed first in the list.

A "Gotcha" worth mentioning I think

Upvotes: 1

MJVDM
MJVDM

Reputation: 3963

The CKEditor object has an attribute called instances which stores all instances. To save an instance, you just add it to the instances hash.

var someDomElement = X;
CKEDITOR.replace(someDomElement);
CKEDITOR.instances[someDomElementId];

var someOtherDomElement = Y;
CKEDITOR.replace(someOtherDomElement);
CKEDITOR.instances[someOtherDomElementId];

Now you have two instances. You can now set or do anything to/with that instance with the standard API.

CKEDITOR.instances[someDomElementId].CKEDITOR_API()

Upvotes: 2

AlfonsoML
AlfonsoML

Reputation: 12690

By an attribute I meant:

<textarea name="editor" placeholder="Type here..."></textarea>

with regards to your other approaches, the configuration is an object, so this should work:

var config = {};
config.placeholder = 'some value'; 
CKEDITOR.replace("myeditor" , config );

Upvotes: 9

Mackan
Mackan

Reputation: 6271

According to Alfonso's site the correct way would be:

config['placeholder'] = 'some value';
CKEDITOR.replace("myeditor" , config );

Upvotes: -1

Related Questions