Replacing £ character from html textarea using javascript - javascript

I'm currently developing a simple web app using html with JavaScript, and I'm trying to do a simple string.replace call on a string received from a html textarea like so;
var contents = document.getElementById("contents").value;
var alteredText = contents.replace(/£/g, "poundsign");
The problem is that when a £ sign is included in the string, the replace call can't find it. I've looked at the code via the console and it seems that anytime there's a $ sign in JavaScript it adds a "Â" to the £ symbol, so
string.replace(/£/g, "poundsign");
as it was written in the js file becomes the following while running:
string.replace(/£/g, "poundsign");
while £ in var contents remains simply £ (putting £ into the textarea causes the replace call to work correctly). Is there a way to stop the  being added in the js file, or to add it to the html file before .replace is called?
The  is added anytime £ appears in the js file as far as I can see, and I haven't been able to get it to match up with the html without the user adding the  to the html themselves.

// replace pound string by empty string
var mystr = '£';
mystr = mystr.replace(/£/g,'poundsign');
alert(mystr);

Thanks to #David Guan for the link, that put me on the right track, and to everyone else that commented.
The issue was resolved when I used the Unicode number in the .replace call rather than the character, it was able to then match the £ sign correctly without the  also being inserted.

Related

How to change the encoding of a CSV file to ISO-8859-1 (ISO-Latin-1)

I have searched for way too long, to solve my existing Problem.
So, there is a Software, that can only read csv-files with ISO-8859-1 (ISO-Latin-1) encoding. And If tried alost everything I can find on the web, but nothing worked. I don´t want to change the Text, I want to change the encoding.
I´ve tried working with this lib: https://github.com/inexorabletash/text-encoding Library and the PapaParse Library and much more. But they are just converting the Text so there are weird symbols replace ä,ö,ü and other characters.
The characters in the csv file itself has characters which are not part of the character set which you're encoding into. You might find that the end of lines have a character which does not exist in the character set you want to use. If you open the csv file in a basic text editor or at the dos prompt use Type myFile.csv you will be able to see which charaters there are in a most basic format. Then stip them out and you should have a file that can be converted. Always work on a copy of the original. The easiest way would be to search and replace in a text editor where you replace the unwanted characters with nothing. not even a space. Keep in mind that if the character is part of the csv construct - eg .. a delimiter - then you would want to replace that with the latin equivalent character.
I found it myself, but thank you anyway.
In js :
const uint8array = new TextEncoder(
'windows-1252',
{NONSTANDARD_allowLegacyEncoding: true}
).encode(csv_data);
const blob = new Blob([uint8array])
(For those, who searched the question: csv_data is an String, containing the values from the read csv-file. Make sure to ad ; behind every value to move to the next column and a /n to move to the next line.)
In HTML :
<script>
window.TextEncoder = window.TextDecoder = null;
</script>
<script src="encoding-indexes.js"></script>
<script src="encoding.js"></script>
And you have to download encoding.js and encoding-indexes.js from https://github.com/inexorabletash/text-encoding

Line breaks are counted as 2 characters in a contenteditable div [duplicate]

I'm using regular textbox as a text input where the users wrties their comments. I then use JQuery and JSON to send data to the server and then insert it into the database.
When I want to display this text I use jQuery to download it prepare HTML and display it in the browser, but there are no new lines.
How can I keep any newlines entered by the user so that they are displayed in the browser?
EDIT:
The problem is that when I do alert $('.detailsCommentContent').val() I can see line breaks in the alert window, but when I then pass it as a GET argument:
insertComment.aspx?id=10&content= " + $('.detailsCommentContent').val() "
then in the url there are no signs of newLine :(
Just do like this answer: keep formatting entered in asp.net textbox (carriage return, new line, etc)
theStringYouWantToFormat.Replace(char.ConvertFromUtf32(13),"<br/>")
Before writing out the HTML using javascript to the page, make sure to replace all the newlines with <br /> tags. Here is a simple extension for string that will allow you to do it using javascript (source):
String.prototype.NewlineToBR = function() {
return this.replace( /\r\n|\r|\n/g, br || '');
}
Usage:
var htmlString = newlineString.NewlineToBR();
Then just insert the new string into you HTML.
where do you want to display the text? in a textarea or directly on the page?
if on the page you'll have to convert the newlines to <br/> tags when getting the text from the db and printing it to the page.
I beleive this is down to the encoding you are using. Difference between unicode and ascii or something similar. It's been a while since I worked on something like this but I think it boiled down to two options.
match up the encoding on save and on load (we found that we had ascii on one and unicode on another).
replace all new line character with an arbituary value when saving and swap it back when you load it.

Javascript - break in textarea but not in paragraph

I have a question:
I have a QR Code Scanner which gets a VCard. Im getting back the following String:
BEGIN:VCARD VERSION:2.1 FN:John Doe N:doe;john END:VCARD
The problem is the following: When putting this Information (via Javascript) in a textarea or just dump it to an alert winow, the information has breaks in between, looking like this:
BEGIN:VCARD
VERSION:2.1
FN:John Doe
.
.
.
But when putting this information into a paragraph (<p></p>), it has no breaks in it and it's just a plain string.
The question is now, can I put those breaks into the paragraph as well or can I insert another sign or anything else in between the attributes?
I thought about just splitting the string on blanks, but it's not working because e.g. FN itself contains blanks as wel...
Thanks for your help.
Edit:
Unfortunatelly, all 3 advices don't work..
What I have now is the following:
function writeqrcodecontent(){
var textfeld = document.getElementById("inhaltvonqrcode");
var wert = $.scriptcam.getBarCode();
//wert.split('\n').join('<br/>');
//wert.replace("\n", "<br>");
//wert.replace(/\n/g,'<br>');
textfeld.innerHTML = wert;
textfeld.style.display="block";
}
But as said, all three commented out lines do not work, everything is still displayed in one line.
The paragraph is defined with:
<p id="inhaltvonqrcode" style="display:none; clear:both;"></p
I understand your ideas but I don't understand why it's not working...
By the way, what I also tried is something like wert.split('\n').join('#'); to see, if it's really the break or it's just not working, but this doesn't work as well, so the text just seems to have no \n in it..
EDIT 2
It's working now, I neeeded to do both steps in one step, so not
var wert = $.scriptcam.getBarCode();
wert.split('\n').join('<br/>');
but
var wert = ($.scriptcam.getBarCode()).split('\n').join('<br/>');
Thanks for your help!
The string you get back likely contains newline characters \n. To get them to display with the newlines intact in HTML, you can either wrap everything returned with <pre></pre> in your HTML. Or split on newline \n and replace it with <br />.
text.split('\n').join('<br />')
text.replace(/\n/g,'<br>');
this line will replace all lines with <br />
Your barcode reader is reading the vCard with \n newline, however the pure html this newline is ignored.
in Javascript you can just use something like
someText.replace("\n", "<br>");
and it will do what you want. In php its the nl2br function

unescape in javascript not working when %26 ( & sign) is in value

I have the below code in my JSP. UI displays every character correctly other than "&".
<c:out value="<script>var escapedData=unescape('${column}');
$('div').html(escapedData);</script>" escapeXml="false" /> </div>
E.g. 1) working case
input = ni!er#
Value in my escapedData variable is ni%21er%40. Now when I put it in my div using
$('div').html(escapedData); then o/p on html is as expected
E.g. 2) Issue case
input = nice&
Value in my escapedData variable is nice%26. Now when I put it in my div using
$('div').html(escapedData); then also it displays below
$('#test20').html('nice%26');
However, when output is displayed in JSP, it just prints "nice". It truncates everything after &.
Any suggestions?
It looks like you have some misunderstandings what unescape(val)/escape(val) do and where you need them. And what you need to take attention of when you use .html().
HTML and URI have certain character that have special meanings. The most important ones are:
HTML: <, >, &
URI: /,?,%,&
If you want to use one of those characters in HTML or URI you need to escape them.
The escaping for URI and for HTML are different.
The functions unescape/escape (deprecated) and decodeURI/endcodeURI are for URI. But was you want is to escape your data into the HTML format.
There is no build-in function in_JS_ that does this but you could e.g. use the code of the answer to this question Can I escape html special chars in javascript?.
But as it seems that you use jQuery you could think of just using .text instead of .html as this will do the escaping for you.
An additional note:
I'm pretty sure that the var escapedData=unescape('${column}'); does not do anything. I assume that ${column} already is ni!er#/nice&.
So please check your source code. If var escapedData=unescape('${column}'); will look like var escapedData=unescape('ni!er#'); then you should remove the unescape otherwise you would not get the expected result if the ${column} contains something like e.g. %23.

Newline problem when writing to HTML using JavaScript

I'm using regular textbox as a text input where the users wrties their comments. I then use JQuery and JSON to send data to the server and then insert it into the database.
When I want to display this text I use jQuery to download it prepare HTML and display it in the browser, but there are no new lines.
How can I keep any newlines entered by the user so that they are displayed in the browser?
EDIT:
The problem is that when I do alert $('.detailsCommentContent').val() I can see line breaks in the alert window, but when I then pass it as a GET argument:
insertComment.aspx?id=10&content= " + $('.detailsCommentContent').val() "
then in the url there are no signs of newLine :(
Just do like this answer: keep formatting entered in asp.net textbox (carriage return, new line, etc)
theStringYouWantToFormat.Replace(char.ConvertFromUtf32(13),"<br/>")
Before writing out the HTML using javascript to the page, make sure to replace all the newlines with <br /> tags. Here is a simple extension for string that will allow you to do it using javascript (source):
String.prototype.NewlineToBR = function() {
return this.replace( /\r\n|\r|\n/g, br || '');
}
Usage:
var htmlString = newlineString.NewlineToBR();
Then just insert the new string into you HTML.
where do you want to display the text? in a textarea or directly on the page?
if on the page you'll have to convert the newlines to <br/> tags when getting the text from the db and printing it to the page.
I beleive this is down to the encoding you are using. Difference between unicode and ascii or something similar. It's been a while since I worked on something like this but I think it boiled down to two options.
match up the encoding on save and on load (we found that we had ascii on one and unicode on another).
replace all new line character with an arbituary value when saving and swap it back when you load it.

Categories