CKEDITOR ajax posts

Question

I have looked far and wide, and I cannot find any answers. I am trying to make an admin page using ajax so when the client updates information in the CKEDITOR it doesn't have to take him to a new page. Getting data from input fields are easy enough using the .val() function, but because textareas are not updated on the fly, I can't use that same function. Heres as far as I got:

// this replaces all textarea tags into CKEDITORS

<script type="text/javascript"> 
    CKEDITOR.replaceAll();
</script>

//this attempts to grab all data from inputs and textareas

$(function() {
        $("#submit").click(function() {
            var newsTitle = $("#newsTitle").val();
            var editNews = CKEDITOR.instances.editNews.getData();
            var contactTitle = $("#contactTitle").val();
            var editContact = CKEDITOR.instances.editContact.getData();
            var linksTitle = $("#linksTitle").val();
            var editLinks = CKEDITOR.instances.editLinks.getData();

                $.ajax({
                   type: "POST",
                   url: "update.php",
                   data: 'newsTitle='+newsTitle+'&editNews='+editNews+'&contactTitle='+contactTitle+'&editContact='+editContact+'&linksTitle='+linksTitle+'&editLinks='+editLinks,
                   cache: false,
                   success: function(){
                        updated();
                    }

                 });    

            return false;
        });
    });

the getData() function seemed like it would work because I tested it with alerts and it was grabbing the data from the editors, but once I would try and update, it wouldn't work...

any ideas?

Answer 1

Tage a look at the CKEditor function/adaptor for jQuery

http://docs.cksource.com/CKEditor_3.x/Developers_Guide/jQuery_Adapter

Because setting and retrieving the editor data is a common operation, the jQuery Adapter also provides the dedicated val() method:

// Get the editor data.
var data = $( 'textarea.editor' ).val();
// Set the editor data.
$( 'textarea.editor' ).val( 'my new content' );