How to add data to CKEditor using JQuery

Everytime a page loads I need to load text into the CK Editor using JQuery, in order to get data from CK Editor I use

var editor_data = CKEDITOR.instances['editor1'].getData();

now is there a similar function I could use to put the data back into the editor?

I'm using ajax to set the data like this

$.ajax({
  type: "POST",
  url: "/inc/ajax/basic.php?menu_id="+menu_id+"&info=3",
  success: function(msg){

    CKEDITOR.instances['editor1'].setData(msg);
  }
});

What am I doing wrong

Try this:

CKEDITOR.instances['editor1'].setData(html)

Where 'html' is a string containing content to edit.

Because its not an array then just replace the instance like this

CKEDITOR.instances.editor1.setData(html)

Vaibhav Jain

you should use data, and method for sending query string like this:

$(document).ready(function()
{
  var querystring="menu_id="+menu_id+"&info=3";
  $.ajax({
  method: "POST",
  url: "/inc/ajax/basic.php",
  data:querystring,
  success: function(msg)
   {
     CKEDITOR.instances['editor1'].setData(msg);
   }
  });
});

var jqxhr = $.get( "file.php", function(data) {
CKEDITOR.instances.idOftextAreaName.setData( data );
    alert( "success" );
  })
.done(function() {
    //alert( "second success" );
})
.fail(function() {
    alert( "error" );
})
.always(function() {
   // alert( "finished" );
});

var editor = CKEDITOR.instances.help_ldesc;         
editor.setData(''); 
$.ajax({
url: urlstr, // Url to which the request is send
type: "POST",             // Type of request to be send, called as method
data:{action:"ex_form"}, // Data sent to server, a set of key/value pairs (i.e. form fields and values)
contentType: false,       // The content type used when sending data to the server.
cache:false,             // To unable request pages to be cached
processData:false,        // To send DOMDocument or non processed data file it is set to false
success: function(data)   // A function to be called if request succeeds
{
    //alert(data);
    var data1=data.split("~`");
    $('#help_id').val(data1[0]);
    $('#help_title').val(data1[1]);
    $('#help_sdesc').val(data1[2]);                 

    editor.setData(''+data1[3]);    
    var edata = editor.getData();
    alert(edata);
}
});

Use this code its works for me and (help_ldesc) is my textarea name.

Happy Patel

CKEDITOR.instances['<%=ckEditor.ClientID%>'].setData(value);

From my experience using inside a function sometimes doesn't work properly. I'll suggest to use in:

    $(document).ready(function () {
    ...
    // instance, using default configuration.
    CKEDITOR.replace('editor1');
    //set data
    CKEDITOR.instances['editor1'].setData(data);
    ...
    });

来源：https://stackoverflow.com/questions/2108354/how-to-add-data-to-ckeditor-using-jquery

标签

jquery

ckeditor