In ur aspx page add the following,
<asp:Panel ID="pnlContentMgmt" runat="server" Width="570px">
<table cellspacing="0" cellpadding="0">
<tr height="5">
<td>
</td>
</tr>
</table>
<table id="tblEdit" runat="server" style="width: 720px; border-collapse: collapse;
height: 300px" bordercolor="#000000" cellspacing="0" cellpadding="0" width="500"
align="left" bgcolor="#A4A3A1" border="1">
<tr>
<td height="25">
<table height="18" cellspacing="1" cellpadding="0" border="0">
<tr>
<td>
<img height="21" src="Images/TextEditor/VertLine.jpg" width="10" align="absmiddle">
</td>
<td>
<div onmouseup="button_up(this);" class="cbtn" onmousedown="button_down(this);" onmouseover="button_over(this);"
onclick="cmdExec('cut')" onmouseout="button_out(this);">
<img height="19" alt="Cut" hspace="1" src="Images/TextEditor/Cut.gif" width="20"
align="absMiddle" vspace="1">
</div>
</td>
<td>
<div onmouseup="button_up(this);" class="cbtn" onmousedown="button_down(this);" onmouseover="button_over(this);"
onclick="cmdExec('copy')" onmouseout="button_out(this);">
<img height="19" alt="Copy" hspace="1" src="Images/TextEditor/Copy.gif" width="20"
align="absMiddle" vspace="1">
</div>
</td>
<td>
<div onmouseup="button_up(this);" class="cbtn" onmousedown="button_down(this);" onmouseover="button_over(this);"
onclick="cmdExec('paste')" onmouseout="button_out(this);">
<img height="19" alt="Paste" hspace="1" src="Images/TextEditor/Paste.gif" width="20"
align="absMiddle" vspace="1">
</div>
</td>
<td>
<img height="21" src="Images/TextEditor/VertLine.jpg" width="10" align="absmiddle">
</td>
<td>
<div onmouseup="button_up(this);" class="cbtn" onmousedown="button_down(this);" onmouseover="button_over(this);"
onclick="cmdExec('createLink')" onmouseout="button_out(this);">
<img height="19" alt="Link" hspace="2" src="Images/TextEditor/Link.gif" width="20"
align="absMiddle" vspace="1">
</div>
</td>
<td>
<div onmouseup="button_up(this);" class="cbtn" onmousedown="button_down(this);" onmouseover="button_over(this);"
onclick="cmdExec('Unlink')" onmouseout="button_out(this);">
<img height="19" alt="Unlink" hspace="2" src="Images/TextEditor/unlink.gif" width="20"
align="absMiddle" vspace="1">
</div>
</td>
<td>
<div onmouseup="button_up(this);" class="cbtn" onmousedown="button_down(this);" onmouseover="button_over(this);"
onclick="cmdExec('RemoveFormat')" onmouseout="button_out(this);">
<img height="19" alt="Remove Format" hspace="2" src="Images/TextEditor/UnSelect.gif"
width="20" align="absMiddle" vspace="1">
</div>
</td>
<!--<td>
<div onmouseup="button_up(this);" class="cbtn" onmousedown="button_down(this);" onmouseover="button_over(this);"
onclick="setImage()" onmouseout="button_out(this);">
<img height="19" alt="Insert Image" hspace="2" src="Images/TextEditor/InsertImage.gif"
width="20" align="absMiddle" vspace="1">
</div>
</td>-->
<td>
<img height="21" src="Images/TextEditor/VertLine.jpg" width="10" align="absmiddle">
</td>
<td>
<div onmouseup="button_up(this);" class="cbtn" onmousedown="button_down(this);" onmouseover="button_over(this);"
onclick="cmdExec('bold')" onmouseout="button_out(this);">
<img height="19" alt="Bold" hspace="1" src="Images/TextEditor/Bold.gif" width="20"
align="absMiddle" vspace="1">
</div>
</td>
<td>
<div onmouseup="button_up(this);" class="cbtn" onmousedown="button_down(this);" onmouseover="button_over(this);"
onclick="cmdExec('italic')" onmouseout="button_out(this);">
<img height="19" alt="Italic" hspace="1" src="Images/TextEditor/Italic.gif" width="20"
align="absMiddle" vspace="1">
</div>
</td>
<td>
<div onmouseup="button_up(this);" class="cbtn" onmousedown="button_down(this);" onmouseover="button_over(this);"
onclick="cmdExec('underline')" onmouseout="button_out(this);">
<img height="19" alt="Underline" hspace="1" src="Images/TextEditor/Under.gif" width="20"
align="absMiddle" vspace="1">
</div>
</td>
<td>
<img height="21" src="Images/TextEditor/VertLine.jpg" width="10" align="absmiddle"></td>
<td>
<div onmouseup="button_up(this);" class="cbtn" onmousedown="button_down(this);" onmouseover="button_over(this);"
onclick="cmdExec('justifyleft')" onmouseout="button_out(this);">
<img height="19" alt="Justify Left" hspace="1" src="Images/TextEditor/Left.gif" width="20"
align="absMiddle" vspace="1">
</div>
</td>
<td>
<div onmouseup="button_up(this);" class="cbtn" onmousedown="button_down(this);" onmouseover="button_over(this);"
onclick="cmdExec('justifycenter')" onmouseout="button_out(this);">
<img height="19" alt="Center" hspace="1" src="Images/TextEditor/Center.gif" width="20"
align="absMiddle" vspace="1">
</div>
</td>
<td>
<div onmouseup="button_up(this);" class="cbtn" onmousedown="button_down(this);" onmouseover="button_over(this);"
onclick="cmdExec('justifyright')" onmouseout="button_out(this);">
<img height="19" alt="Justify Right" hspace="1" src="Images/TextEditor/Right.gif"
width="20" align="absMiddle" vspace="1">
</div>
</td>
<td>
<img height="21" src="Images/TextEditor/VertLine.jpg" width="10" align="absmiddle"></td>
<td>
<div onmouseup="button_up(this);" class="cbtn" onmousedown="button_down(this);" onmouseover="button_over(this);"
onclick="cmdExec('insertorderedlist')" onmouseout="button_out(this);">
<img height="19" alt="Ordered List" hspace="2" src="Images/TextEditor/numlist.GIF"
width="20" align="absMiddle" vspace="1">
</div>
</td>
<td>
<div onmouseup="button_up(this);" class="cbtn" onmousedown="button_down(this);" onmouseover="button_over(this);"
onclick="cmdExec('insertunorderedlist')" onmouseout="button_out(this);">
<img height="19" alt="Unordered List" hspace="2" src="Images/TextEditor/bullist.GIF"
width="20" align="absMiddle" vspace="1">
</div>
</td>
<td>
<img height="21" src="Images/TextEditor/VertLine.jpg" width="10" align="absmiddle"></td>
<td>
<div onmouseup="button_up(this);" class="cbtn" onmousedown="button_down(this);" onmouseover="button_over(this);"
onclick="foreColor()" onmouseout="button_out(this);">
<img id="BtnColor" height="19" alt="Forecolor" hspace="2" src="Images/TextEditor/fgcolor.gif"
width="20" align="absMiddle" vspace="1"></div>
</td>
<td>
<img height="21" src="Images/TextEditor/VertLine.jpg" width="10" align="absmiddle">
</td>
<td>
<div onmouseup="button_up(this);" class="cbtn" onmousedown="button_down(this);" onmouseover="button_over(this);"
onclick="cmdExec('undo')" onmouseout="button_out(this);">
<img height="19" alt="Undo" hspace="2" src="Images/TextEditor/Undo.gif" width="20"
align="absMiddle" vspace="1">
</div>
</td>
<td>
<div onmouseup="button_up(this);" class="cbtn" onmousedown="button_down(this);" onmouseover="button_over(this);"
onclick="cmdExec('redo')" onmouseout="button_out(this);">
<img height="19" alt="Redo" hspace="2" src="Images/TextEditor/Redo.gif" width="20"
align="absMiddle" vspace="1">
</div>
</td>
<td>
<img height="21" src="Images/TextEditor/VertLine.jpg" width="10" align="absmiddle">
</td>
<td>
<div onmouseup="button_up(this);" class="cbtn" onmousedown="button_down(this);" onmouseover="button_over(this);"
onclick="cmdExec('outdent')" onmouseout="button_out(this);">
<img height="19" alt="Outdent" hspace="2" src="Images/TextEditor/outtdent.gif" width="20"
align="absMiddle" vspace="1">
</div>
</td>
<td>
<div onmouseup="button_up(this);" class="cbtn" onmousedown="button_down(this);" onmouseover="button_over(this);"
onclick="cmdExec('indent')" onmouseout="button_out(this);">
<img height="19" alt="Indent" hspace="2" src="Images/TextEditor/inindent.gif" width="20"
align="absMiddle" vspace="1">
</div>
</td>
<td>
<img height="21" src="Images/TextEditor/VertLine.jpg" width="10" align="absmiddle">
</td>
<td>
<div onmouseup="button_up(this);" class="cbtn" onmousedown="button_down(this);" onmouseover="button_over(this);"
onclick="cmdExec('superscript')" onmouseout="button_out(this);">
<img height="19" alt="Superscript" hspace="2" src="Images/TextEditor/Superscript.gif"
width="20" align="absMiddle" vspace="1">
</div>
</td>
<td>
<div onmouseup="button_up(this);" class="cbtn" onmousedown="button_down(this);" onmouseover="button_over(this);"
onclick="cmdExec('subscript')" onmouseout="button_out(this);">
<img height="19" alt="Subscript" hspace="2" src="Images/TextEditor/Subscript.gif"
width="20" align="absMiddle" vspace="1">
</div>
</td>
<td>
<div onmouseup="button_up(this);" class="cbtn" onmousedown="button_down(this);" onmouseover="button_over(this);"
onclick="cmdExec('InsertHorizontalRule')" onmouseout="button_out(this);">
<img height="19" alt="Horizontal Rule" hspace="2" src="Images/TextEditor/InsertHorizontalRule.gif"
width="20" align="absMiddle" vspace="1">
</div>
</td>
<td>
<img height="21" src="Images/TextEditor/VertLine.jpg" width="10" align="absmiddle">
</td>
</tr>
<tr>
<td>
<img height="21" src="Images/TextEditor/VertLine.jpg" width="10" align="absmiddle">
</td>
<td colspan="3">
<select style="width :80px;" onchange="cmdExec('fontsize',this[this.selectedIndex].value);" name="selfontsize">
<option selected>Size</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select>
</td>
<td>
<img height="21" src="Images/TextEditor/VertLine.jpg" width="10" align="absmiddle">
</td>
<td colspan="8">
<select onchange="cmdExec('fontname',this[this.selectedIndex].value);" runat="server"
id="selfont" name="selfont">
</select>
</td>
<%-- <td>
<img height="21" src="Images/TextEditor/VertLine.jpg" width="10" align="absmiddle">
</td>--%>
</tr>
</table>
</td>
</tr>
<tr>
<td height="3">
</td>
</tr>
<tr>
<td id="mam" height="400" bgcolor="#FFFFFF">
<iframe frameborder="0" id="NewsBody_rich" runat="server" name="NewsBody_rich" src="MsgBody.htm"
width="100%" height="100%"></iframe>
</td>
</tr>
<tr>
<td valign="bottom" align="left" height="20">
<table height="35" cellspacing="0" cellpadding="0" width="100%" border="0">
<tr>
<td width="5">
<img src="images/blank.gif" width="1" /></td>
<td>
<a onclick="setMode(1,0);">
<img height="20" src="Images/TextEditor/Normal_on.jpg" width="51" name="Normalbut"></a></td>
<td width="10">
<img src="images/blank.gif" width="1" /></td>
<td width="50">
<a onclick="setMode(0,1,1,0);">
<img height="20" src="Images/TextEditor/HTML_off.jpg" width="44" name="HTMLbut"></a></td>
<td width="85%">
</td>
</tr>
</table>
</td>
</tr>
</table>
</asp:Panel>
and also the hidden control,
<input type="hidden" runat="server" id="hdnmsg" name="hdnmsg" />
and then add the following code in the script,
var type;
function button_over(eButton)
{
eButton.style.backgroundColor = "#8C8883";
eButton.style.borderColor = "darkblue darkblue darkblue darkblue";
}
function button_out(eButton)
{
eButton.style.backgroundColor = "#A4A3A1";
eButton.style.borderColor = "threedface";
}
function button_down(eButton)
{
eButton.style.backgroundColor = "#A4A3A1";
eButton.style.borderColor = "darkblue darkblue darkblue darkblue";
}
function button_up(eButton)
{
eButton.style.backgroundColor = "#A4A3A1";
eButton.style.borderColor = "darkblue darkblue darkblue darkblue";
eButton = null;
}
var isHTMLMode=false;
function cmdExec(cmd,opt)
{
if (isHTMLMode)
{
alert("Formatting happens only in Normal mode");
return;
}
NewsBody_rich.focus();
NewsBody_rich.document.execCommand(cmd,"",opt);
NewsBody_rich.focus();
} // end cmdExec
function ChangeImage (ImageName,FileName) {
document[ImageName].src = FileName;
}
var intHCount = 0;
var intNCount = 0;
function setMode(Nbut, Hbut)
{
var sTmp;
isHTMLMode = Hbut;
isNormalMode = Nbut;
if(Hbut == 1)
{
intHCount++;
intNCount = 0;
}
if(Nbut == 1)
{
intNCount++;
intHCount = 0;
}
if (isHTMLMode && intHCount == 1)
{
sTmp=NewsBody_rich.document.body.innerHTML;
if(GetBrowserType()=="isFF")
NewsBody_rich.document.body.textContent=sTmp;
else
NewsBody_rich.document.body.innerText=sTmp;
ChangeImage ('HTMLbut','images/TextEditor/HTML_on.jpg');
ChangeImage ('Normalbut','images/TextEditor/Normal_off.jpg'); return true;
}
if(isNormalMode && intNCount == 1)
{
if(GetBrowserType()=="isFF")
sTmp=NewsBody_rich.document.body.textContent;
else
sTmp=NewsBody_rich.document.body.innerText;
NewsBody_rich.document.body.innerHTML=sTmp;
ChangeImage ('HTMLbut','images/TextEditor/HTML_off.jpg');
ChangeImage ('Normalbut','images/TextEditor/Normal_on.jpg'); return true;
}
NewsBody_rich.focus();
} // end setMode
function createLink()
{
if (isHTMLMode){alert("Uncheck 'Edit HTML'");return;}
cmdExec("CreateLink");
} // end createLink
function foreColor()
{
var arr = showModalDialog("ColorPalette.htm","","font-family:Verdana; font-size:12; dialogWidth:18; dialogHeight:18" );
if (arr != null) cmdExec("ForeColor",arr);
}
/* function foreColor()
{
if (window.showModalDialog)
{
var dialogArguments = new Object();
var popwin = window.showModalDialog("ColorPalette.htm","", "dialogWidth=300px;dialogHeight=300px;dialogTop=30 0px;dialogLeft=350px;status=no;");
if(popwin != null)
{
cmdExec("ForeColor",popwin);
}
}
}*/
function setImage()
{
var imgSrc = " ";
var flag = 0;
while(imgSrc == " ")
{
imgSrc = prompt('Enter image location with image name ', '');
if (imgSrc == " ") alert("Enter the required URL");
if(imgSrc != "")
{
cmdExec('insertimage', imgSrc);
}
} // end while
} // end setImage
function ShowCM(t,headerText)
{
NewsBody_rich.document.designMode='On';
if (divContent.style.display=="block")
{
divContent.style.display="none";
}
else
{
divContent.style.display="block";
}
type=t;
spnHeader.innerText=headerText;
if(document.getElementById(type).value != '')
{
NewsBody_rich.document.body.innerHTML=document.get ElementById(type).value;
}
}
function fillTxt()
{
var State = new Object()
var aa;
document.getElementById("hdnmsg").innerText=NewsBo dy_rich.document.body.innerHTML;
}
function ClearIFrame()
{
NewsBody_rich.document.body.innerHTML ='';
divContent.style.display="none";
}
function DisableSave(bool)
{
document.Form1.btnSaveHead.style.display="none";
if(bool=='show')
{
if(document.Form1.btnSaveHead.style.display=="none ")
{
document.Form1.btnSaveHead.style.display="block";
}
else
{
document.Form1.btnSaveHead.style.display="none";
}
}
}
RichTextBox Control
