setting a ckeditor instance value using jquery

Question

I have the following script in newedit.js file.

$(document).ready(function() {
    $("[id^=save]").click(function() {
        $("#scholarship-short_desc").val("test");
        alert($("#scholarship-short_desc").val());
        $("form").submit();
    });

    $("#scholarship-short_desc").ckeditor();
});

I also have the following entries in my html file. I'm using ckeditor 3.6.5.

<script src="/myapp/javascripts/ckeditor/ckeditor.js" type="text/javascript"></script>
<script src="/myapp/javascripts/ckeditor/adapters/jquery.js" type="text/javascript"></script>
<script src="/myapp/javascripts/scholarships/newedit.js" type="text/javascript"></script>

This displays the ckeditor correctly in my page. But when I try to set the textarea's value using a val function (as described here (ckeditor's jquery guide)), the value is not being set.

Any ideas? thanks! :)

where does form submit to? Unless you submit via ajax, page is likely being refreshed... browser default submit process — charlietfl
– charlietfl, Commented Nov 20, 2012 at 22:40
even if I remove the submit function (which I don't think has anything to do with my question), I get the same issue. — mrjayviper
– mrjayviper, Commented Nov 22, 2012 at 0:04
if save is a button in form, submit isn't doing anything that browser default isn't already doing...and will cause a page refresh. Look and see if it isn't being refreshed. You have to use ajax to avoid this — charlietfl
– charlietfl, Commented Nov 22, 2012 at 0:06
It seems were going offtopic here... ------------------------------- the alert in the 4th line display nothing even though I set the textarea's value. — mrjayviper
– mrjayviper, Commented Nov 22, 2012 at 6:39

oleq · Accepted Answer · 2012-11-22 22:31:32Z

3

CKEditor doesn't operate on your textarea but on synthetic contenteditable-enabled html page within an iframe. You can set new contents of the editor this way:

CKEDITOR.instances.yourInstanceName.setData( '<h1>Your HTML</h1>' );

If you really want to synchronize your editor with its textarea:

CKEDITOR.instances.yourInstanceName.updateElement();

This also happens automatically when you call:

CKEDITOR.instances.yourInstanceName.destroy()

You'll find yourInstanceName by browsing CKEDITOR.instances object or by reading textarea's id/name (depends on how you created your editor).

Happy coding! ;)

answered Nov 22, 2012 at 22:31

oleq

15.9k1 gold badge40 silver badges69 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

setting a ckeditor instance value using jquery

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related