CKEditor 4
Sun, 02/07/2010 - 01:40
#1
cuzzmunger
cuzzmunger's picture
Joined: 07/02/2010
Posts: 7

ckeditor is rendering code to the page

Hi all,

I have implemented the editor in my admin/edit page and when editing it works fine I can insert pics & change text to bold or whatever, but when I submit it & go to the page I edited all it gives me is code.

Im very new to php & desperatley need some help.

here is what I get if I type hello & colour it red 16pt & make it bold

eg.
<p>
<span style="color: #f00"><span style="font-size: 16px"><strong><br />
Hello</strong></span></span></p>
Top
Wed, 02/17/2010 - 14:29
zjerryj
zjerryj's picture
Joined: 17/02/2010
Posts: 5

Re: ckeditor is rendering code to the page

Check the source code of the edited page, is "<" represented by "&lt;"? If it is, it means you have probably applied htmlencode() function to the output HTML, which will turn all special characters like <, >, & to html entities. Also check the database, for you may have used the htmlencode() function when saving the data.
Top
Wed, 02/17/2010 - 23:06
cuzzmunger
cuzzmunger's picture
Joined: 07/02/2010
Posts: 7

Re: ckeditor is rendering code to the page

Hi thanks for your reply.....Im new to php and i think i know what you mean but still a bit lost....

I have 2 pages, an EDIT page & a page index page.... I will post both here...could you tell me where to put the code you mentioned

<?php
session_start();

include_once "admin_check.php";
$editor_data = $_POST[ 'editor1' ];
?>
<?php
$pid = ereg_replace("[^0-9]", "", $_POST['pid']); // filter everything but numbers for security
// Query the body section for the proper page
include_once "../scripts/connect_to_mysql.php";
$sqlCommand = "SELECT pagetitle, linklabel, editor1 FROM pages WHERE id='$pid' LIMIT 1";
$query = mysqli_query($myConnection, $sqlCommand) or die (mysqli_error());
while ($row = mysqli_fetch_array($query)) {
$pagetitle = $row["pagetitle"];
$linklabel = $row["linklabel"];
$editor1 = $row["editor1"];
//$editor1 = str_replace("<br />", "", $editor1);
}
mysqli_free_result($query);
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="/ckeditor/ckeditor.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Editing Page</title>
<script type="text/javascript">

<script type="text/javascript">
CKEDITOR.replace( 'editor1' );



function validate_form ( ) {
valid = true;
if ( document.form.pagetitle.value == "" ) {
alert ( "Please enter the page title." );
valid = false;
} else if ( document.form.linklabel.value == "" ) {
alert ( "Please enter info for the link label." );
valid = false;
} else if ( document.form.editor1.value == "" ) {
alert ( "Please enter some info into the page body." );
valid = false;
}
return valid;
}
</script>
<style type="text/css">
<!--
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
}
-->
</style></head>

<body>
<table width="100%" border="0" cellpadding="8">
<tr>
<td><h3>Editing Existing Page&nbsp;&nbsp;&bull;&nbsp;&nbsp; <a href="index.php">Admin Home</a> &nbsp;&nbsp;&bull;&nbsp;&nbsp;<a href="../" target="_blank">View Live Website</a></h3></td>
</tr>
<tr>
<td><?php echo $error_message; ?><br /></td>
</tr>
<tr>
<td>

<table width="100%" border="0" cellpadding="5">
<form id="form" name="form" method="post" action="page_edit_parse.php" onsubmit="return validate_form ( );">
<tr>
<td width="12%" align="right" bgcolor="#F5E4A9">Page Full Title</td>
<td width="88%" bgcolor="#F5E4A9"><input name="pagetitle" type="text" id="pagetitle" size="80" maxlength="64" value="<?php echo $pagetitle; ?>" /></td>
</tr>
<tr>
<td align="right" bgcolor="#D7EECC">Link Label</td>
<td bgcolor="#D7EECC"><input name="linklabel" type="text" id="linklabel" maxlength="24" value="<?php echo $linklabel; ?>" />
(What the link to this page will display as)</td>
</tr>
<tr>
<td align="right" valign="top" bgcolor="#DAEAFA">Page Body</td>
<td bgcolor="#DAEAFA"><textarea name="editor1" id="editor1"><?php echo $editor1; ?></textarea><script type="text/javascript">
window.onload = function()
{
CKEDITOR.replace( 'editor1' );
};
</script></td>
</tr>
<tr>
<td>&nbsp;</td>
<td>
<input name="pid" type="hidden" value="<?php echo $pid; ?>" />
<input type="submit" name="button" id="button" value="Submit Page Edit" /></td>
</tr>
</form>
</table>


</td>
</tr>
</table>
</body>
</html>

INDEX PAGE
<?php
session_start();


require_once "scripts/connect_to_mysql.php";
// Determine which page ID to use in our query below ---------------------------------------------------------------------------------------
if (!$_GET['pid']) {
$pageid = '1';
} else {
$pageid = ereg_replace("[^0-9]", "", $_GET['pid']); // filter everything but numbers for security
}
// Query the body section for the proper page
$sqlCommand = "SELECT editor1 FROM pages WHERE id='$pageid' LIMIT 1";
$query = mysqli_query($myConnection, $sqlCommand) or die (mysqli_error());
while ($row = mysqli_fetch_array($query)) {
$body = $row["editor1"];
}
mysqli_free_result($query);
//---------------------------------------------------------------------------------------------------------------------------------------------------------------
// Query the module data for display ---------------------------------------------------------------------------------------------------------------
$sqlCommand = "SELECT modulebody FROM modules WHERE showing='1' AND name='footer' LIMIT 1";
$query = mysqli_query($myConnection, $sqlCommand) or die (mysqli_error());
while ($row = mysqli_fetch_array($query)) {
$footer = $row["modulebody"];
}
mysqli_free_result($query);
//---------------------------------------------------------------------------------------------------------------------------------------------------------------
// Query the module data for display ---------------------------------------------------------------------------------------------------------------
$sqlCommand = "SELECT modulebody FROM modules WHERE showing='1' AND name='custom1' LIMIT 1";
$query = mysqli_query($myConnection, $sqlCommand) or die (mysqli_error());
while ($row = mysqli_fetch_array($query)) {
$custom1 = $row["modulebody"];
}
mysqli_free_result($query);
//---------------------------------------------------------------------------------------------------------------------------------------------------------------
// Build Main Navigation menu and gather page data here -----------------------------------------------------------------------------
$sqlCommand = "SELECT id, linklabel FROM pages WHERE showing='1' ORDER BY id ASC";
$query = mysqli_query($myConnection, $sqlCommand) or die (mysqli_error());

$menuDisplay = '';
while ($row = mysqli_fetch_array($query)) {
$pid = $row["id"];
$linklabel = $row["linklabel"];

$menuDisplay .= '<a href="index.php?pid=' . $pid . '">' . $linklabel . '</a><br />';

}
mysqli_free_result($query);
//---------------------------------------------------------------------------------------------------------------------------------------------------------------
//mysqli_close($myConnection);
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CKSOURCE</title>
<style type="text/css">
<!--
body,td,th {
font-family: Verdana, Geneva, sans-serif;
font-size: 12px;
color: #666;
}
body {
background-image: url();
background-repeat: repeat-x;
color:#FFF;
}
a:link {
color: #333;
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #333;
}
a:hover {
text-decoration: underline;
color: #666;
}
a:active {
text-decoration:none;
color: #333;
}
-->
</style></head>

<body>
<table width="980" border="0" align="center" cellpadding="6">
<tr>
<td align="center"><table width="100%" border="0" cellpadding="8">
<tr>
<td colspan="2"><table width="100%" border="0">
<tr>
<td width="46%"><a href="index.php"><img src="style/logo.png" alt="My Magic Site Logo" width="360" height="80" border="0" /></a></td>
<td width="54%" valign="top"><?php echo $custom1; ?></td>
</tr>
</table>
</td>
</tr>
<tr>
<td width="14%" valign="top" bgcolor="#FFCC33" style="border:#6B450C thin solid; line-height:1.5em;">
<?php echo $menuDisplay; ?>
</td>
<td width="86%" valign="top" bgcolor="#FFCC33" style="border:#6B450C thin solid;">
<div style="width:auto; height:400px; overflow: auto;"><?php echo $body; ?></div>
</td>
</tr>
<tr>
<td colspan="2" bgcolor="#FFCC33" style="border:#6B450C thin solid;"><?php echo $footer; ?> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
</tr>
</table></td>
</tr>
</table>
<div align="center"><a href="administrator">Admin</a></div><br />
</body>
</html>

Top
Thu, 02/18/2010 - 08:34
zjerryj
zjerryj's picture
Joined: 17/02/2010
Posts: 5

Re: ckeditor is rendering code to the page

When reading the data, apply html_entity_decode() function to it.
e.g. in edit page: Change $editor1 = $row["editor1"]; to $editor1 = html_entity_decode($row["editor1"]);

Could you also paste the source code of page_edit_parse.php? I think you have applied htmlentities() function (Not htmlencode() I metioned above. I was wrong) to the submitted data before updating the database. If you have, just remove the htmlentities() function and then no more modification need to be made.
Top
Thu, 02/18/2010 - 09:40
cuzzmunger
cuzzmunger's picture
Joined: 07/02/2010
Posts: 7

Re: ckeditor is rendering code to the page

thanks heaps for your reply... here is the edit parse

/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
$pid = $_POST['pid'];
$pagetitle = $_POST['pagetitle'];
$linklabel = $_POST['linklabel'];
$editor1 = $_POST['editor1'];
// Filter Function -------------------------------------------------------------------
function filterFunction ($var) {
$var = nl2br(htmlspecialchars($var));
$var = eregi_replace("'", "&#39;", $var);
$var = eregi_replace("`", "&#39;", $var);
return $var;
}
$pagetitle = filterFunction($pagetitle);
$linklabel = filterFunction($linklabel);
$editor1 = filterFunction($editor1);
// End Filter Function --------------------------------------------------------------
include_once "../scripts/connect_to_mysql.php";
// Add the updated info into the database table
$query = mysqli_query($myConnection, "UPDATE pages SET pagetitle='$pagetitle', linklabel='$linklabel', editor1='$editor1', lastmodified='now()' WHERE id='$pid'") or die (mysqli_error($myConnection));

echo 'Operation Completed Successfully! <br /><br /><a href="index.php">Click Here</a>';
exit();
?>
Top
Thu, 02/18/2010 - 10:02
zjerryj
zjerryj's picture
Joined: 17/02/2010
Posts: 5

Re: ckeditor is rendering code to the page

Change $editor1 = filterFunction($editor1); to $editor1 = mysqli_real_escape_string($editor1);
Because filterFunction() applies htmlspecialchars() (similar to htmlentities()) to the data, which will convert <, >, ' to html entities. Remove it and problem will be solved. In additon, you should apply mysqli_real_escape_string() to the data so as to prevent SQL injection.
Top
Thu, 02/18/2010 - 10:11
cuzzmunger
cuzzmunger's picture
Joined: 07/02/2010
Posts: 7

Re: ckeditor is rendering code to the page

hi thanks again,

Now when I update I just get a blank page?

this is what I changed it to
<?php
/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
$pid = $_POST['pid'];
$pagetitle = $_POST['pagetitle'];
$linklabel = $_POST['linklabel'];
$editor1 = $_POST['editor1'];
// Filter Function -------------------------------------------------------------------
function filterFunction ($var) {
$var = nl2br(htmlspecialchars($var));
$var = eregi_replace("'", "&#39;", $var);
$var = eregi_replace("`", "&#39;", $var);
return $var;
}
$pagetitle = filterFunction($pagetitle);
$linklabel = filterFunction($linklabel);
$editor1 = mysqli_real_escape_string($editor1);
// End Filter Function --------------------------------------------------------------
include_once "../scripts/connect_to_mysql.php";
// Add the updated info into the database table
$query = mysqli_query($myConnection, "UPDATE pages SET pagetitle='$pagetitle', linklabel='$linklabel', editor1='$editor1', lastmodified='now()' WHERE id='$pid'") or die (mysqli_error($myConnection));

echo 'Operation Completed Successfully! <br /><br /><a href="index.php">Click Here</a>';
exit();
?>
Top
Thu, 02/18/2010 - 11:49
zjerryj
zjerryj's picture
Joined: 17/02/2010
Posts: 5

Re: ckeditor is rendering code to the page

I check the manual, and it should be this:
$editor1 = mysqli_real_escape_string($myConnection, $editor1);
Sorry, I'm not very familiar with mysqli.
Top
Thu, 02/18/2010 - 21:53
cuzzmunger
cuzzmunger's picture
Joined: 07/02/2010
Posts: 7

Re: ckeditor is rendering code to the page

thanks again but its still blank now, I have tried a few things but still no luck....

I could email the files to you if you wanted....Im so stuck
Top
Twitter Facebook Facebook Instagram Medium Linkedin GitHub Arrow down Phone Menu Close icon Check