I'm using CKEditor to created the portion of my CMS for the user to input content. My CMS is a bar/menu at the top with the sections of the site for the user to create, update, or delete an entry.
When the user selects an option I send the request for the form items to php using jquery AJAX $.post. The function returns the code and I use $('#loadCMS').html(data) to create the form without reloading the page. This work great and debugging always shows the correct code returned.
However, CKEditor only loads the first time an item is selected. It may load again but it's rare.
CKEditor is javascript that sits in the head and replaces specified textareas with the editor
<head>
...
<script type="text/javascript" src="/ckeditor/ckeditor.js"></script>
...
</head
what is loaded dynamically to call the editor
<textarea name="editor1"></textarea>
<script type="text/javascript">
CKEDITOR.replace( "editor1",
{
toolbar :
[
['Source'],
['Cut','Copy','Paste','PasteText','PasteFromWord','-', 'SpellChecker'],
['Undo','Redo','-','RemoveFormat'],
['Bold','Italic','Underline'],
['Subscript','Superscript'],
['NumberedList','BulletedList'],
['Link','Unlink'],
['Image','Flash','HorizontalRule','SpecialChar','Format'],
['Maximize', 'ShowBlocks','-','About']
],
width : '1000',
height : '300',
filebrowserBrowseUrl : '/ckfinder/ckfinder.html',
filebrowserImageBrowseUrl : '/ckfinder/ckfinder.html?Type=Images',
filebrowserFlashBrowseUrl : '/ckfinder/ckfinder.html?Type=Flash'
});
</script>
jquery
$('#portfolioCreate').click(function()
{
var detailsList = new Array('title','medium','original');
$.post('cms.php',{detailsList: detailsList,images:"imageOn",subimgNum:0,content1:"Comments"},
function(data)
{
$('#loadCMS').html(data);
$('#debug').val(data);
});
});
The forms are created dynamically every time. However, the textareas replaced by CKEditor does not always replace, it's just blank not even the textarea box shows. The first time a selection is made it works. If the user chooses to create a new blog entry the text area is replaced, if they then choose to update bio no text area is ever replaced even if they go back to create a new blog entry.
-----------------SOLUTION-------------------------
dynamic php
$key = md5(time().rand())
<textarea name="'.$key.'"></textarea>
<script type="text/javascript">
CKEDITOR.replace("'.$key'",
{
.....
});
<input type="hidden" value="'.$key.'" name="content1Key" />
</script>
php to pull from form
$content1Key = $_POST['content1Key'];
$content1 = $_Post[$content1Key];