Getting SharePoint Rich text field data using JavaScript

Hi All,

We all know that we can get a value of single line text field, drop downs, choice field value using jQuery very easily using jQuery.

However the same is not true in case of using multiline rich text field. When you try to apply same methods of jQuery, it fails to returns you the value.

Well, to get the same stuff done with multiline rich text field, we need to use the same technique but in some different way.

To demonstrate, add one column in your list which is multiline rich text field. And now on NewForm of that list, add one content editor web part. (I prefer take up the SharePoint discussion list which has default rich text field)

I have done the same using JavaScript even have not used jQuery file. I have added content editor web part and placed the following code in it. To demonstrate, I have replaced the onclick handlers of the page to our own handler which pops up the content of rich text field as alert.

<script type="text/javascript" language="javascript">
var objForm = document.forms[0];
var count;

window.onload = StartUpCustomScript;
function StartUpCustomScript() {
ChangeOkButtonOnclickEvent("Input", "SaveItem");
}

function ChangeOkButtonOnclickEvent(tagName, identifier) {
var len = identifier.length;
var tags = document.getElementsByTagName(tagName); /*find all Input type controls on page (ie. control with tag <Input/>)*/
for (var i = 0; i < tags.length; i++) {

var tempString = tags[i].name;

if (tempString.indexOf(identifier) == tempString.length - len) /*find any Input type controls on page has its name ending with 'SaveItem'*/
{
//alert(tempString);
if (tags[i].attributes["onclick"] != null) {
/*if found, replace it default onclick with our custom script*/

var func = tags[i].attributes["onclick"].value.replace("if (!PreSaveItem())", " return function1('" + tags[i].name + "');if (!PreSaveItem())");
/*remove its default onclick event*/
tags[i].onclick = null;
/*re-register its onlick event with new script*/
tags[i].attachEvent("onclick", new Function(func));
}
}
}
//return null;
}

function function1(z)
{
var textName = "ctl00_m_g_1a3ed0d9_ea62_4a4e_adc0_30d1184b5ad0_ctl00_ctl04_ctl01_ctl00_ctl00_ctl04_ctl00_ctl00_TextField";
var bodyText, spamWordText, clientWordText;
var rtClientCount=0;
var arrBodyText = new Array();
var arrSpamWordText = new Array();
count=0;
spamWordText="";
clientWordText="";

var docEditor = RTE_GetEditorDocument(textName);
var textRange=docEditor.body.createTextRange();
bodyText=textRange.htmlText;
alert(bodyText);
return true;
}
</script>

I n function1(z) we have taken rich text field control client ID, you can get the same by looking into the page view source.

var textName = "{rich field client ID}"

and when you add the above code to the content editor web part and then create New Item and click on Ok, and see what you get.



Clicking on OK button is replaced by our own code just to demonstrate how to fetch the value of rich text field in SharePoint. In real scenarios, this can be done in different ways.

Hope that this idea of how to fetch value of multiline rich text field will help many.