Tuesday, May 27, 2014

Using the SharePoint RichTextBox

Through the course of my own development projects, I had a need to for a rich textbox, for which SharePoint does support OOTB. However, here is the catch - if you wish to employ it, I discovered through rigorous research that manual calls to SharePoint javascript libraries are necessary to invoke needed features, such as full HTML support within the rich textbox. After piecing together all the different namespaces and javascript libraries \ functions from several different informative sites, I arrived at the following working solution. Two functions (With a parameter) are needed that are referenced in the ...\layouts\forms.js library; CreateRichEdit(id), and IsSafeHrefAlert().

CreateRichEdit along with the below script will render out the text box and toolbars, based on the RichTextMode speficied in the InputFormTextBox. IsSafeHrefAlert will ensure that any hyperlinks or pictures inserted via the toolbars will function properly, if used in the way I've documented below that forces the result to be TRUE.

Hope it helps!

______________________________

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<%@ Page Language="C#" %>
<%@ Register Tagprefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> <%@ Register Tagprefix="Utilities" Namespace="Microsoft.SharePoint.Utilities" Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> <%@ Import Namespace="Microsoft.SharePoint" %> <%@ Assembly Name="Microsoft.Web.CommandUI, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Import Namespace="Microsoft.SharePoint.ApplicationPages" %>


<html dir="ltr" xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">
<meta name="WebPartPageExpansion" content="full" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled 1</title>
<SharePoint:CssLink runat="server" Version="4"/>
                <SharePoint:DelegateControl runat="server" ControlId="AdditionalPageHead" AllowMultipleControls="true"/>
<SharePoint:SPShortcutIcon runat="server" IconUrl="http://fcbc-sp3/images/Icon3.ico"/>
               
                <SharePoint:SPPageManager runat="server"/>
                <SharePoint:SPHelpPageComponent Visible="false" runat="server"/>


<script type="text/javascript">

function CreateRichEdit(id) {

if (browseris.ie5up && browseris.win32 && !IsAccessibilityFeatureEnabled()) {

g_aToolBarButtons = null;

g_fRTEFirstTimeGenerateCalled = true;

RTE_ConvertTextAreaToRichEdit(id, true, true, "", "1033", null, null, null, null, null, "Compatible", "\u002f", null, null, null, null);

RTE_TextAreaWindow_OnLoad(id);

}

else {

document.write("&nbsp;<br><SPAN class=ms-formdescription><a href='javascript:HelpWindowKey(\"nsrichtext\")'>Click for help about adding basic HTML formatting.</a></SPAN>&nbsp;<br>");

};

}
   var id = "<%= txtmsg.ClientID %>";
  

function IsSafeHrefAlert()
{
return true;
}
   
</script>
</head>

<body  >

<form id="form1" runat="server">
  <asp:ScriptManager id="ScriptManager" runat="server" EnablePageMethods="false" EnablePartialRendering="true" EnableScriptGlobalization="false" EnableScriptLocalization="true" />
<SharePoint:InputFormTextBox ID="txtmsg" runat="server" Rows="20" Columns="50" TextMode="MultiLine"
                RichText="true" RichTextMode="FullHtml" />
                </form>

</body>

</html>

No comments:

Post a Comment