Learn how to a build a cloud-first strategyRegister Now


Encoding in JavaScript problem

Posted on 2011-10-31
Medium Priority
Last Modified: 2012-05-12

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

Question by:jonatec
  • 3
  • 3
LVL 35

Expert Comment

by:Robert Schutt
ID: 37057396
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


Author Comment

ID: 37057426
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,

LVL 35

Accepted Solution

Robert Schutt earned 2000 total points
ID: 37057555
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?
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!


Author Comment

ID: 37057626

Yes, certainly:

Fred's new scheme contains a single quote.


has many
line breaks.

LVL 35

Assisted Solution

by:Robert Schutt
Robert Schutt earned 2000 total points
ID: 37057662
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>");

Author Closing Comment

ID: 37057859
Excellent thanks !

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

When the s#!t hits the fan, you don’t have time to look up who’s on call, draft emails, call collaborators, or send text messages. An instant chat window is definitely the way to go, especially one like HipChat. HipChat is a true business app. An…
Q&A with Course Creator, Mark Lassoff, on the importance of HTML5 in the career of a modern-day developer.
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.
Any person in technology especially those working for big companies should at least know about the basics of web accessibility. Believe it or not there are even laws in place that require businesses to provide such means for the disabled and aging p…
Suggested Courses

810 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question