Encoding in JavaScript problem


I am trying to achieve 2 things:

a) Encode or escape text from a <TEXTAREA tag to store in SQL Server, thereby allowing singles quotes etc., to be easiliy stored in the database with no problems.

b) Also, although the text is initially captured using a <TEXTAREA tag, with it's carriage returns etc. I need to return the text from the database but into another control other than a <TEXTARA, ie DIV, SPAN, LABEL, etc and still preserve paragraph breaks etc.

Please look at my code. I'm trying encodeURIComponent/decodeURIComponent but with no success. It seems the only way to replicate the original <TEXTAREA formatting is to re-display into another <TEXTAREA, which I don't won't do.

Is there a sensible way to achieve this ?


<html xmlns="http://www.w3.org/1999/xhtml" >
<title>Untitled Page</title>
<script type="text/javascript">

	function fnGo1() {

		var txtBox = document.getElementById("txtBox").value;
		var CodedText = encodeURIComponent(txtBox);
		document.getElementById("secOut").innerHTML = decodeURIComponent(CodedText);
		document.getElementById("lab1").innerHTML = decodeURIComponent(CodedText);
		document.getElementById("spnBox").innerHTML = decodeURIComponent(CodedText);
<input type="button" value=" go " onclick="fnGo1()" />
<p />
<textarea id='txtBox' cols='30' rows='10'></textarea>
<p />
DIV Result:<div id='secOut'></div>
<p />
LABEL Result:<label id='lab1'></label>
<p />
SPAN Result:<span id='spnBox'></span>


Open in new window

Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Robert SchuttSoftware EngineerCommented:
It's probably not the end-solution but as a start, have you tried using innerText instead of innerHTML? Do you need HTML tags in the text? If yes, are you aware of the danger?

You can also add this after decodeURIComponent(CodedText):

.replace("\n", "<br>")

Open in new window

jonatecAuthor Commented:
Hi. Well I'm open to suggestions, given what I'm trying to achieve.

I can replace the single quote before it hits the database, that's not a problem. I am trying to replicate a paragraph in the text created by the user when the text is initially keyed into a textarea,

Robert SchuttSoftware EngineerCommented:
Then I would say try that second option, for example:

document.getElementById("spnBox").innerHTML = decodeURIComponent(CodedText).replace("\n", "<"+"br>");

Open in new window

(I broke up the br tag because it seemed to break the code div in preview...)

Possibly other replacements are necessary, you could make a generic function containing any decoding you want for reusability, could you give an example of 'difficult' text you can expect in the textbox?

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

jonatecAuthor Commented:

Yes, certainly:

Fred's new scheme contains a single quote.


has many
line breaks.

Robert SchuttSoftware EngineerCommented:
The quote seems ok to me.

The multiple line-breaks can be done with a regular expression:

var decodedText = decodeURIComponent(CodedText).replace(/\n/g, "<br>");
jonatecAuthor Commented:
Excellent thanks !
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.