Creating and working with Survey in SharePoint - Part 2

Hi All,

Here I am back with some more interesting stuff in survey list. In previous post we discussed about the advantages of survey list. But it is not true in every case. It has got many other limitations as well. Here in this article, we are going to discuss about one basic difficulty about survey.

I would first suggest you to read Creating and working with Survey in SharePoint - Part 1 of the series.

For further reading read Creating and working with Survey in SharePoint - Part 3

Creating and working with Survey in SharePoint - Part 4

Creating and working with Survey in SharePoint - Part 5

If you want to have some HTML in survey’s question, then we cannot insert that. Sometimes we may require making some font bold, something italic and we want to underline something. We need to increase the font size, we may require to add hyperlink in question, then we cannot do it.

So anyways we have to overcome this problem anyhow. So here is a way how you can insert HTML in the question of survey.

First make a note of one very important point, you have to repeat these steps for each and every page that you have for the survey. Means if you have branching question then you get more than one page to respond.

Before getting actually in to this, you first need to understand that how we will replace the normal text with HTML text.

Ok, let us go back to our first question. Open the question and add the following words before and after Department.



See the effect of this change on questions. We can clearly read startitalic and enditalic in first question.



We have added these words and we will replace this word with startitalic with <i> and enditalic </i> in content editor web part. You can use whatever word that you want, we only need to replace those words in the web apart. Let us see how we will do this now.

Go ahead and add one content editor web part below the questions. Edit the page and add the content editor web part.

Click on modify shared web part, click on source editor and write the code as shown in below.

<script language="JavaScript">
var ClassName;
ClassName = 'ms-formlabel';

var elements = new Array();

var elements = document.getElementsByTagName('td');

for(var e=0;e<elements.length;e++)
{
if(elements[e].className == ClassName)
{

elements[e].innerHTML = elements[e].innerHTML.replace('startitalic','<i>');

elements[e].innerHTML = elements[e].innerHTML.replace('enditalic','</i>');


}

}

</script>

Let us have a look on this above code. Here what we have done is that we have first taken out ms-formlable class as questions belong to this class in SharePoint architecture. We then take all ID because all questions are in TD tag and then we find our forcefully entered two words and replace them with proper HTML tag and there you go. See the effect of the above code.



Let us go ahead and change our third question. Make the following change in it.



Now again go ahead and change the existing editor web part with following addition with above code.

elements[e].innerHTML = elements[e].innerHTML.replace('linebreak','<br/>');

elements[e].innerHTML = elements[e].innerHTML.replace('startunderline','<u>');

elements[e].innerHTML = elements[e].innerHTML.replace('endunderline','</u>');

The effect of the above code is shown below. We have also broken question in two lines.



Now let us go and create hyperlink in the same question. Here is a trick to add hyperlink to the question. Let us say for example we want to have a hyperlink on “like” word and that should take to the Home page link and it should open in new page. In addition to this, it should be of bigger size than other words.

So here is a simple answer of the tuff question. Add just one more line to your content editor web part.

elements[e].innerHTML = elements[e].innerHTML.replace('like','<a href="/sites/Test/default.aspx" target="_blank" style ="font-size:14pt" >like</a>');

and see the effect of above code.



I hope that now you have the clear picture. All it takes is the knowledge of HTML and you can insert anything, almost anything with HTML in the questions.

I will soon come up with part 3. keep reading it.