PDA

View Full Version : Ajax - Edit-in-place prob ( html )


Mixtoon
07-01-2008, 02:22 PM
Hi,

I have a code which helps me to edit a text and save it to database.

the files I have:

articles.html

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1256">
<script type="text/javascript" src="prototype.js"></script>

<script type="text/javascript">

function init()
{
Event.observe("edit", "click", function(e){ edit_in_place() });

Event.observe("save", "click", function(e){ save() });

Event.observe("cancel", "click", function(e){ cancel() });
}

function edit_in_place()
{
$("save_settings").style.display = "inline";

$("edit_settings").style.display = "none";

var article_title = '<input type="text" name="article_title" id="article_title"';
article_title += 'size="30" value="'+$("title").innerHTML+'" >';

$("title").innerHTML = article_title;



}

function save()
{
new Ajax.Request("articles.php",
{
method: "post",
postBody: "title="+$F("article_title")+
"&uid=1"+"&save="+$F("save"),
onComplete: show
}
);
}

function show(res)
{
$("title").innerHTML = $("article_title").value;
$("save_settings").style.display = "none";
$("edit_settings").style.display = "inline";
}

function cancel()
{
$("title").innerHTML = "Edit the article title here...";
$("save_settings").style.display = "none";
$("edit_settings").style.display = "inline";
}

</script>

</head>

<body onload="init()">
<div>Title:</div>
<span id="title">
Edit the article title here...
</span>

<span id="edit_settings">
<input type="button" id="edit" name="edit" value="edit" >
</span>

<span id="save_settings" style="display:none">
<input type="button" id="save" name="save" value="save">&nbsp;
<input type="button" id="cancel" name="cancel" value="cancel">
</span>
</body>

</html>



prototype.js





and articles.php which conatin the orders to save the text in the database.




the problem is I don't want any body to enter html code,


I mean if some one edit the text and write:

<b>test</b>

it should give him this:
<b>test</b>


and NOT:
test



so how to do that? :confused:

MoT3rror
07-01-2008, 07:38 PM
http://www.php.net/htmlspecialchars
Or
http://www.php.net/manual/en/function.htmlentities.php

Mixtoon
07-02-2008, 03:24 AM
Thanks MoT3rror,

but this is for the php file.

I need it for the javascript!

--------------- Added 1214975648 at 1214975648 ---------------

ok I know I should use escapeHTML()

but how to add that to this code?

<script type="text/javascript">

function init()
{
Event.observe("edit", "click", function(e){ edit_in_place() });

Event.observe("save", "click", function(e){ save() });

Event.observe("cancel", "click", function(e){ cancel() });
}

function edit_in_place()
{
$("save_settings").style.display = "inline";

$("edit_settings").style.display = "none";

var article_title = '<input type="text" name="article_title" id="article_title"';
article_title += 'size="30" value="'+$("title").innerHTML+'" >';

$("title").innerHTML = article_title;



}

function save()
{
new Ajax.Request("articles.php",
{
method: "post",
postBody: "title="+$F("article_title")+
"&uid=1"+"&save="+$F("save"),
onComplete: show
}
);
}

function show(res)
{
$("title").innerHTML = $("article_title").value;
$("save_settings").style.display = "none";
$("edit_settings").style.display = "inline";
}

function cancel()
{
$("title").innerHTML = "Edit the article title here...";
$("save_settings").style.display = "none";
$("edit_settings").style.display = "inline";
}

</script>

Dismounted
07-02-2008, 06:22 AM
You should ALWAYS sanitize data server-side. That means, you should run htmlspecialchars() in your PHP script. Sanitizing client-side (ie. with Javascript) can be easily bypassed.