My new blog present here.

Featured Post

Insights into Sitecore Search: A Definitive Introduction

A key component of digital experience management is effective information retrieval. A simplified approach is required for websites, applications, and platforms containing a lot of material so that consumers can easily get the data they require. This need is met by Sitecore, a well-known name in the field of digital experience platforms (DXPs), which provides powerful and comprehensive search functionality. We will travel into the realm of Sitecore Search in this article, learning about its capabilities, architecture , and the enormous value it offers both developers and end users. Introduction to Sitecore Search    A headless content discovery platform powered by AI , Sitecore Search enables you to build predictive and custom search experiences across various content sources. To extract and index you

SharePoint Rich Text Box (InputFormTextBox) Control

Use of Rich Text Box (InputFormTextBox) Control in SharePoint:


Objective:

In this article, I am going to explain use of RichTextField (InputFormTextBox) control in SharePoint.

Requirement:

Take an example of one requirement: We need to create newsletter on the basis of user input. The user input can be a normal text or html format text.

Resolution:

In this scenario, we can use SharePoint Rich Text Box (InputFormTextBox) control in a custom webpart/usercontrol. Check the screen shot below:





Ways of using SharePoint Rich Text Box (InputFormTextBox) control:

1. The following code illustrates how to use SharePoint Rich Text Box (InputFormTextBox) control in user control:

i. Add the required directive at the top of the ascx page (if you're using a web user control):


<%@ Register Assembly="Microsoft.SharePoint, Version=12.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" Namespace="Microsoft.SharePoint.WebControls" TagPrefix="AmitKumarSPControls" %>


ii. For creating instance of SharePoint Rich Text Box (InputFormTextBox) control in your ascx (if you're using a web user control):










2. You can also create this type of control completely in code:

i. This is available under Microsoft.SharePoint.WebControls namespace (if you're using a custom web part):



InputFormTextBox richMessage = new InputFormTextBox();
richMessage.RichText = true;
richMessage.RichTextMode = SPRichTextMode.FullHtml;


You may also use following useful properties:


richMessage.AllowHyperlink = true;
richMessage.TextMode = TextBoxMode.MultiLine;
richMessage.Wrap = true;
richMessage.Rows = 10;
richMessage.Width = System.Web.UI.WebControls.Unit.Percentage(100);



There are a number of properties/attributes that you can set:

•ID: control id.
•Text: the string within the control.
•ErrorMessage: you can define a custom error message that will be displayed when an error occurs.
•ErrorMessageLabelControl: you can specify a control id of a control on the page in which the error message will be rendered.
•TextMode: accepts a value of type TextBoxMode. Possible values are MultiLine, SingleLine and Password. The default is SingleLine.
•Columns: indicates the width of the text box.
•Rows: indicates the number of rows that will be displayed. This is only applied if the TextMode property is set to MultiLine.
•RichText: indicates if a normal text box or a rich text box will be displayed. The default value is false. The text box will only be rendered as a rich text box if the TextMode property is set to MultiLine.
•RichTextBoxMode: accepts a value of type SPRichTextMode. Possible values are Compatible, FullHtml and HtmlAsXml. The default value is Compatible. this property only applies if the RichText property is set to true.
•AllowHyperlink: this property only applies if the RichtText property is set to true. The necessary controls to insert hyperlinks and images will be added to the tools pane.
•Direction: This orders the controls in the tools pane from left to right or from right to left. The value is of type ContentDirection having values NotSet, LeftToRight, RightToLeft. The default value is NotSet. This property only applies if the RichText property is set to true.





Example:

The following code illustrates how to use SharePoint Rich Text Box (InputFormTextBox) control in user control. In this example, I am also validating, value in SharePoint Rich Text Box (InputFormTextBox) control is empty or not using JavaScript.

RichTextBoxControl.ascx Code:



<%@ Control Language="C#" AutoEventWireup="true" CodeFile="RichTextBoxControl.ascx.cs" Inherits="RichTextBoxControl" %>
<%@ Register Assembly="Microsoft.SharePoint, Version=12.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c"
Namespace="Microsoft.SharePoint.WebControls" TagPrefix="AmitKumarSPControls" %>



















 
Rich Text Box Control




















Enter Text:*






RichText="true" RichTextMode="FullHTML" Rows="21" Style='height: 270px; width: 700px;'
TextMode="MultiLine" Width="700px">






 


 







RichTextBoxControl.ascx.cs Code:




using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Text;
using Microsoft.SharePoint;

public partial class RichTextBoxControl : System.Web.UI.UserControl
{

#region Render Controls and Handle Controls Event


#region Handle Page Load Event
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
SetAttibutes();
}
}
#endregion

#region Handle Display Button Click Event
protected void btnDisplay_Click(object sender, EventArgs e)
{
if (!string.IsNullOrEmpty(txtNotes.Text))
{
SetMessage(txtNotes.Text.Trim(), lblMessage);
}

}
#endregion


#endregion

#region Helper

#region set controls attributes
private void SetAttibutes()
{
//Add JS to the Display button
btnDisplay.Attributes.Add("OnClick", "return TextBoxMessageCheck('" + txtNotes.ID + "','" + txtNotes.ClientID + "');");
//


}
#endregion

#region Show message on the screen
///
/// This method makes the lblMessage object visible to the page and set its Text property to the message provided.
///

/// The string value assigned to the Text property of the lblMessage object.
private void SetMessage(string message, Label lblMessage)
{
if (lblMessage != null)
{
lblMessage.Visible = true;
lblMessage.Text = message;
}
else
{
Page.Response.Write(message);
}
}
#endregion

#endregion
}






You can deploy custom user control in SharePoint with the help of SonofSmartPart Web part.


References for this article:

http://msdn2.microsoft.com/en-us/library/microsoft.sharepoint.webcontrols.inputformtextbox.aspx

http://smartpart.codeplex.com/releases/view/10697

Comments

Balu said…
Does this work with Chrome and Firefox? I have issues of not loading formatting toolbar in all the browsers except IE.
Amit Kumar said…
This validation JS work with all browser.
Rohit Blog said…

I have created a webpart using inputformtextbox. But when I click the image button, I doesn’t show the browse option for the image.

Any property setting is there?

Thanks in advance,
Girish said…
How to upload video to richtextbox editor?
Girish said…
Thanks a lot..
I was looking for this item.
I need to add a custom toolbar for uploading video to this custom rich text editor such that video can be played inside the richtext editor itself
How can it be done?
Pls help me...
Anonymous said…
Hi ,

I have one urgent requirement with input form texbox ,

first
1) Is there way to freeze the toolbar of text box (rich text box) for example when i scroll down the tool bar ( font ,formating control etc) disappear hence if i want to bold anything i have to scroll up again

2) on right click can i show tool bar options for formating the way we have in word

We are working on WSS3.0

Please help

thanks in advance

Popular posts from this blog

Sitecore GraphQL Queries

Twenty 20 Masti:

Sitecore Experience Edge GraphQL Queries