I found this script to create a simple rich text form
(http://programmabilities.com/xml/index.php?id=17):
<html>
<head>
<title>Rich Text Editor</title>
</head>
<body>
<script language= "JavaScript" type= "text/javascript" src=
"editor.js" >
//First lets initiate some variables
var isEditable= false;
var isIE;
var isGecko;
var isSafari;
var isKonqueror;
function initiateEditor() {
//check what browser is in use
var browser = navigator.userAgent.toLowerCase();
isIE = ((browser .indexOf("msie") != -1) && (browser
..indexOf("opera") == -1) && (browser .indexOf("webtv") == -1));
isGecko = (browser .indexOf("gecko") != -1);
isSafari = (browser .indexOf("safari") != -1);
isKonqueror = (browser.indexOf("konqueror") != -1);
//enable designMode if the browser is not safari or konqueror.
if (document.getElementById && document.designMode && !isSafari &&
!isKonqueror) {
isEditable= true;
}
}
//Javascript function dislpayEditor will create the textarea.
function displayEditor(editor, html, width, height) {
if(isEditable){
document.writeln('<iframe id="' + editor + '" name="' + editor
+ '" width="' + width + 'px" height="' + height + 'px"></iframe>');
//create a hidden field that will hold everything that is typed in the
textarea
document.writeln('<input type="hidden" id="hidden' + editor +
'" name="hidden' + editor + '" value="">');
//assign html (textarea value) to hiddeneditor
document.getElementById('hidden' + editor).value = html;
//call function designer
designer(editor, html);
}else{
document.writeln('<textarea name="' + editor + '" id="' + editor
+ '" cols="39" rows="10">' + html + '</textarea>');
}
}
//this is designer function that enables designMode and writes defalut
text to the text area
function designer(editor, html) {
var mainContent= "<html id=" + editor + "><head></head><body>" +
html + "</body></html>" ;
//assign the frame(textarea) to the edit variable using that frames id
var edit= document.getElementById(editor).contentWindow.docu ment;
//write the content to the textarea
edit.write(mainContent);
//enable the designMode
edit.designMode = "On" ;
document.getElementById(content).contentDocument.d esignMode = "on";
}
//To execute command we will use javascript function editorCommand.
function editorCommand(editor, command, option) {
// first we assign the content of the textarea to the variable
mainField
var mainField;
mainField = document.getElementById(editor).contentWindow;
// then we will use execCommand to execute the option on the textarea
making sure the textarea stays in focus
try {
mainField.focus();
mainField.document.execCommand(command, false, option);
mainField.focus();
} catch (e) { }
}
function updateEditor(editor) {
if (!isEditable) return;
//assign the value of the textarea to the hidden field.
var hiddenField = document.getElementById('hidden' + editor);
if (hiddenField.value == null) hiddenField.value = "";
hiddenField.value =
document.getElementById(editor).contentWindow.docu ment.body.innerHTML;
}
</script>
<table width="750">
<form action="form.asp" name="edit" method="POST" id="edit"
onsubmit="return submitForm();">
<tr>
<td> <a href= "javascript:editorCommand('content', 'bold', '')" ><img
src="bold.gif" width="25" height="24" alt="Bold" title="Bold"
border="0"></a> </td>
<td> <a href= "javascript:editorCommand('content', 'underline', '')"
<img src="underline.gif" width="25" height="24" alt="Underline" title="Underline" border="0"></a> </td>
<td> <a href= "javascript:editorCommand('content', 'italic', '')"<img src="italic.gif" width="25" height="24" alt="Italic" title="Italic" border="0"></a> </td>
<td> <a href= "javascript:editorCommand('content', 'justifyleft', '')"<img src="j_left.gif" width="25" height="24" alt="Align Left" title="Align Left" border="0"></a> </td>
<td> <a href= "javascript:editorCommand('content', 'justifycenter',
'')" ><img src="j_center.gif" width="25" height="24" alt="Align Center"
title="Align Center" border="0"></a> </td>
<td> <a href= "javascript:editorCommand('content', 'justifyright',
'')" ><img src="j_right.gif" width="25" height="24" alt="Align Right"
title="Align Right" border="0"></a> </td>
<td> <a href= "javascript:editorCommand('content', 'indent', '')"<img src="indent.gif" width="25" height="24" alt="Indent" title="Indent" border="0"></a> </td>
<td> <a href= "javascript:editorCommand('content', 'outdent', '')"<img src="outdent.gif" width="25" height="24" alt="Outdent" title="Outdent" border="0"></a> </td>
<td> <a href= "javascript:editorCommand('content', 'undo', '')" ><img
src="undo.gif" width="25" height="24" alt="Undo" title="Undo"
border="0"></a> </td>
<td> <a href= "javascript:editorCommand('content', 'redo', '')" ><img
src="redo.gif" width="25" height="24" alt="Redo" title="Redo"
border="0"></a> </td>
<td width="100%" align="levt">Shift+Enter for single line spacing</td>
</tr>
<tr>
<td colspan="12">
<script language="JavaScript" type="text/javascript">
<!--
function submitForm() {
updateEditor('content');
//alert("content = " + document.edit.hiddencontent.value);
return true;
}
initiateEditor();
//-->
</script>
<script language="JavaScript" type="text/javascript">
<!--
displayEditor('content', '', 600, 300);
//-->
</script>
</td>
</tr>
<tr><td colspan="12"> <input type="submit" name="Submit"
value="Submit"> </td></tr>
</form>
</table>
</body>
</html>
But it is giving me this error in the status bar of my IE:
Line: 48
Char: 4
Error: Object required
Code: 0
URL: http://bewebmaster.com/editorjs/
Can somebody please help me out on this?
Thanks
