Encode HTML before POST - html

I have the following script, which encodes some of the value it receives propertly, but it does not seem to encode double quotes.
How do I encode the full value properly before posting?
function htmlEncode(value){
return $('<div/>').text(value).html();
}
The above script give me this:
<p>Test&nbsp; <span style="color: #ffffff"><strong><span style="background-color: #ff0000">1+1+1=3</span></strong></span></p>
I need it to give me this:
<p>Test&nbsp; <span style="color: #ffffff"><strong><span style="background-color: #ff0000">1+1+1=3</span></strong></span></p>
EDIT: Followup question:
Encoded HTML in database back to page

You shouldn't try to encode things with JavaScript.
You should encode it serverside.
Anything that can be done with JavaScript can be undone.
It is valid to encode it in JavaScript if you also check that it was encoded on the server, but keep in mind: JavaScript can be disabled.

What George says is true.
But, if you have to encode strings client-side, I'd suggest you use JavaScript's encodeURIComponent().

I had a similar problem. I simply used the replace method in javascript. Here's a nice article to read: http://www.w3schools.com/jsref/jsref_replace.asp
Basically what the replace method does is it swaps or replaces the character it founds with what you indicate as replacement character(s).
So this:
var str=' " That " ';
str = str.replace(/"/g,'"');
Once you log this into the console of your browser, you will get something like
" That "
And this:
var str=' " That " ';
str = str.replace(/"/g,'blahblahblah');
Once you log this into the console of your browser, you will get something like
blahblahblah That blahblahblah

You can use this module in js, without requiring jQuery:
htmlencode

You can re-use functions from php.js project - htmlentities and get_html_translation_table

Use escape(str) at client side
and
HttpUtility.UrlDecode(str, System.Text.Encoding.Default); at server side
it worked for me.

Related

how to enter < br > from database

I'm entering text in my html from a database. Usually when I enter <br> it works fine but for some reason I'm getting lt;brgt; when I try to do this in a section using fullcalendar. I also tried \n but that didn't work either. Is there a way to add the < br > to the database to get it to work
On version 5.5.1 you can use this
eventContent: function(eventInfo) {
return { html: eventInfo.event.title }
}
if your title has a that will be taken care of.
Databases usually (not sure which DB you are using) do not automatically convert or escape special characters.
So I guess somewhere in your code you are encoding the special characters before inserting them into the DB. So now you have to decode those after retrieving them from the DB.
If you are using Java then you can use StringEscapeUtils's escapeHtml4 unescapeHtml4 functions to encode and decode.
If you are using PHP then you can use htmlspecialchars and htmlspecialchars_decode to do the same.
For fullcalendar, you will have to use the eventRender to do so. Try this hack
eventRender: function (event, element) {
element.find('.fc-title').html(event.title);
}

encode/decodeURI for URLs with quotes

I'm having trouble displaying links to URLs with quotes in them and can't figure out a solution despite a load of examples on stackoverflow! Here's the exact string I'm storing in my database (shows Adelaide Antartica)
https://www.google.com/maps/place/67%C2%B007'27.3%22S+68%C2%B008'56.0%22W/#-67.1447827,-68.3886741,71373m/data=!3m1!1e3!4m5!3m4!1s0x0:0x0!8m2!3d-67.124258!4d-68.148903
When I just try putting that into a href it links to...
https://www.google.com/maps/place/67%C2%B007 (i.e. breaks at the first single quote)
But I try using href="encodeURI(theLink)" or href="encodeURIComponent(theLink)" it links to the same thing (I even tried the decode options in case I was thinking about it the wrong way and had the same problem).
Does anyone have a recommendation on the best way to proceed here? I even tried the deprecated "escape" function which also won't work for me. Thanks for any thoughts at all!
(p.s. funnily enough as I'm writing this I see that even Stack Overflow's link is broken in exactly the same way - maybe it's not even possible?!)
EDIT: As requested by Clemzd - I'm using d3 to construct the links, so doing this...
anElement.append("text").html("<a href='" + myData[i].url + "'> a link name </a>");
Works great on everything but links with a single quote regardless of whether I do encodeURI(myData[i].url) or not
You use single quotes to delimit the value of the href attribute, so that value cannot contain unescaped single quotes. That's an issue with HTML markup encoding, not URL encoding.
You can either reverse your use of single and double quotes (encoded URLs cannot contain double quotes, but they can contain single quotes) or replace the single quotes in the URL with a character entity like '. URL encoding by %27 would also work, but that's not a standard encoding that encodeURIComponent does.
There are many ways to solve your issue. All you need to know is if your input may contains ' then you have to escape this character. Otherwise you will get something like anElement.append("text").html("<a href='" + https://www.google.com/maps/place/'link + "'> a link name </a>"); That can't be parsed because of the '.
If you are sure that your link will never contains " then change your code and use " instead as a concatenaion operator.
If not, you can escape ' in server side or client side. For example in client side you can do :
function escapeJavascript(input){
return input.replace(/\\n/g, "\\n")
.replace(/\\'/g, "\\'")
.replace(/\\"/g, '\\"')
.replace(/\\&/g, "\\&")
.replace(/\\r/g, "\\r")
.replace(/\\t/g, "\\t")
.replace(/\\b/g, "\\b")
.replace(/\\f/g, "\\f");
}
And then use it like this: anElement.append("text").html("<a href='" + escapeJavascript(myData[i].url) + "'> a link name </a>");

Encode hidden form field value

What method should I use to encode hidden a form field value? Assume that I am storing text like this:
This is a "really" long string with 'quotes' and special characters (~!##$%^&*()_+{}), which might have a random quote (") in the middle of it, making the HTML invalid.
We are using ASP.net to set the value:
<input type="hidden" value="<%= Model.UnencodedTextData %>" name="askingForTrouble" />
I believe if we HTML encoded it, it would solve the problem, but this form will be posted to another application, which we do not have control over. So will the receiving application (Marketo) automatically know how to decode this?
Thank you.
Marketo developer evangelist here. Before posting to Marketo, it is best to use HTML URL encoding for special characters. For example, the JavaScript code sample below would URL encode "&" and "%" characters.
function htmlEscape(str) {
return String(str)
.replace(/&/g, '%26')
.replace(/%/g, '%20');
}

string interpreted incorrectly in angularjs

I have a string in golang as follows.
discount = "("+discount+"% off)"
when passed to html via angularjs it is displayed as follows
(10 %o(MISSING)ff)
Any idea why it is happening?
Thanks in advance.
Something in your HTML rendering process is passing the string through go's fmt.Sprintf or similar. Try escaping the % by doubling it:
discount = "("+discount+"%% off)"
See http://play.golang.org/p/S_GEJXSfnD for a live example.
Looks like you need to escape the string. Try to use this module: http://golang.org/pkg/html/

Cleaning up text: from ALLCAPS to <em>allcaps</em>

I need to clean up some text for html that used ALLCAPS instead of italics. So I'd like to take something that looks like this:
Here is an artificial EXAMPLE of a piece of TEXT that
uses allcaps as a way of EMPHASIZING words.
And convert it into this:
Here is an artificial <em>example</em> of a piece of <em>text</em> that
uses allcaps as a way of <em>emphasizing</em> words.
I'm tagging this with regex and notepad++, but (as you can probably tell) I don't know the first thing about how to use them.
There're no such possibilities with Notepad++ regex engine.
You can run a script that do the job, in Perl for example:
perl -pi.back -e "s#\b([A-Z]+)\b#'<em>'.lc($1).'</em>'/eg" yourfile.html
yourfile.html will be saved in yourfile.html.back
As far as I konw the regex engine of Notepad++ is not advanced enough to do this.
I would advice to use a programming language to accomplish this, in PHP for example you could do this:
echo preg_replace_callback('/([A-Z]{2,})/', create_function('$s', 'return "<em>".strtolower($s[0])."</em>";'), $s);
Be sure to exclude the legitim first capital letter of a single word in the regex.
AFAIK you cannot change casing in the Find\Replace mechanism of Notepad++.
If all you need is the <em> tag insertion you can do the following:
In the Find box type (\s+)([A-Z]+)(\s+), abd in the Replace type \1<em>\2</em>\3.
You can try some of the TextFX tools maybe in the TextFX Characters sub-menu.
Here is how to do this using JavaScript's string replace method:
var capfix = function (x) {
var emout = function (y) {
y = y.charAt(0) + "<em>" + y.toLowerCase() + "</em>" + y.charAt(y.length - 1);
};
return x.replace(/\s[A-Z]\s/g, emout);
};
To execute just call:
capfix(yourData);
This assumes that "yourData" is just a variable that represents your data as a string. If you wanted to use a web tool then "yourData" could represent the value from some input control, as in the following:
var yourData = document.getElementById("myinput").value;
alert(capfix(yourData));
To make that work just put an id attribute on your web tool input such as:
<textarea id="myinput"></textarea>