View Full Version : Dynamically populate rich text editor

08-18-2011, 06:27 PM
I'm using Kevin Roth's Cross-Browser Rich Text Editor JS component. Below is a demo.php script showing how it's created in JS.

I got it working fine but I now want to dynamically add new text to the component in my php script. I know how to setup the php part to initiate the new text load event but I can't figure out how to actually get the new text into the RTE component inside a JS function.

I tried this JS function but it didn't load in the new text in:

function pre_canned_message_click()
rte1.html = 'New string';

In the demo.php below the RTE component is loaded the same way rte1.html = but in the JS function it doesn't work. I don't know what I'm missing here.

Thanks for any help...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

echo var_dump($_POST);

// Cross-Browser Rich Text Editor
// Written by Kevin Roth (http://www.kevinroth.com/rte/)
// License: http://creativecommons.org/licenses/by/2.5/
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<title>Cross-Browser Rich Text Editor (RTE)</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<meta name="keywords" content="cross-browser rich text editor, rte, textarea, htmlarea, content management, cms, blog, internet explorer, firefox, safari, opera, netscape, konqueror" />
<meta name="description" content="The cross-browser rich-text editor (RTE) is based on the designMode() functionality introduced in Internet Explorer 5, and implemented in Mozilla 1.3+ using the Mozilla Rich Text Editing API." />
<meta name="author" content="Kevin Roth" />
<meta name="ROBOTS" content="ALL" />
<!-- html2xhtml.js written by Jacob Lee <letsgolee@lycos.co.kr> //-->
<script language="JavaScript" type="text/javascript" src="../cbrte/html2xhtml.min.js"></script>
<script language="JavaScript" type="text/javascript" src="../cbrte/richtext_compressed.js"></script>

<h2>Cross-Browser Rich Text Editor (RTE) Demo</h2>
<p>For more information, visit the <a href="http://www.kevinroth.com/rte/">Cross-Browser Rich Text Editor (RTE) home page</a>.</p>

<!-- START Demo Code -->
<form name="RTEDemo" action="demo.php" method="post" onsubmit="return submitForm();">
<script language="JavaScript" type="text/javascript">
function submitForm() {
//make sure hidden and iframe values are in sync for all rtes before submitting form

return true;

//Usage: initRTE(imagesPath, includesPath, cssFile, genXHTML, encHTML)
initRTE("../cbrte/images/", "../cbrte/", "", true);
<noscript><p><b>Javascript must be enabled to use this form.</b></p></noscript>

<script language="JavaScript" type="text/javascript">
//build new richTextEditor
var rte1 = new richTextEditor('rte1');
//format content for preloading
if (!(isset($_POST["rte1"]))) {
$content = "here's the " . chr(13) . "\"preloaded <b>content</b>\"";
$content = rteSafe($content);
} else {
//retrieve posted value
$content = rteSafe($_POST["rte1"]);
rte1.html = '<?=$content;?>';
//rte1.toggleSrc = false;
<p><input type="submit" name="submit" value="Submit" /></p>
function rteSafe($strText) {
//returns safe code for preloading in the RTE
$tmpString = $strText;

//convert all types of single quotes
$tmpString = str_replace(chr(145), chr(39), $tmpString);
$tmpString = str_replace(chr(146), chr(39), $tmpString);
$tmpString = str_replace("'", "'", $tmpString);

//convert all types of double quotes
$tmpString = str_replace(chr(147), chr(34), $tmpString);
$tmpString = str_replace(chr(148), chr(34), $tmpString);
// $tmpString = str_replace("\"", "\"", $tmpString);

//replace carriage returns & line feeds
$tmpString = str_replace(chr(10), " ", $tmpString);
$tmpString = str_replace(chr(13), " ", $tmpString);

return $tmpString;
<!-- END Demo Code -->