javascript next line(\n) on the string not working - javascript

Hi this does not make sense I am trying to get put \n to break my sentence but it seems not working ,my code below
"Address:"+location.addressLine1 + " " + location.addressLine2 +"\n "+"Store Name:\n"+ location.storeName +" "+"Geofence:\n"+ location.maxGeofence+" "+"City:\n"+location.city
my goal is to have all the rows in new line ,Like below
Address:xxxxxxx
Store Name:xxxxxx
Gofence:xxxxxx
City:xxxxxxx
but I keep on getting
Address:xxxxxxx Store Name:xxxxxx Gofence:xxxxxx City:xxxxxxx

Either use <br/> in HTML or, if you wish to keep using \n, use the nl2br function from php.js :
function nl2br (str, is_xhtml) {
var breakTag = (is_xhtml || typeof is_xhtml === 'undefined') ? '<br />' : '<br>';
return (str + '').replace(/([^>\r\n]?)(\r\n|\n\r|\r|\n)/g, '$1' + breakTag + '$2');
}
This will convert every \n to a <br/>

Instead of using \n, use <br/>
<br /> is HTML element for a line break. <br /> allows to show up as a new line when HTML is rendered in a browser.

In html \n has no effect. Replace it with <br/> or place your code inside <pre> tags.
br - will make a new line inside HTML
pre - code inside will be formated as it was inside a text file (it will understood \n), but you will have to style it.

Here is solution for newline
"Address:"+location.addressLine1 + " " + location.addressLine2 +"<br>"+"Store Name:<br>"+ location.storeName +" "+"Geofence:<br>"+ location.maxGeofence+" "+"City:<br>"+location.city
Note : \n is work only php not in Html so \n will not work here.

Related

How to replace \n with <br> in JSON string?

I'm getting the following raw string from a JSON file. I console.log it display fine.
"Hello, my name is Jane, from "IStaff" company.\r\n\r\n.We are interested in your service.\r\n\r\n.Please call me back "
When I rendering this string, there is no new lines.
the best way in my case is just add in css : white-space: pre-wrap;
If you insert that string into HTML, it will render by literally showing the \n and \r elements:
const string = 'Hello, my name is Jane, from "IStaff" company.\r\n\r\n.We are interested in your service.\r\n\r\n.Please call me back';
document.write(string);
You need to replace them with HTML <br> elements:
const string = 'Hello, my name is Jane, from "IStaff" company.\r\n\r\n.We are interested in your service.\r\n\r\n.Please call me back';
const renderString = string.replace(/(?:\r\n|\r|\n)/g, "<br>");
document.write(renderString);
Regex above from this answer.
I think this problem occurs when you use innerHTML, use <br/> instead of /r/n.
Example:
"Hello, my name is Jane, from 'IStaff' company.<br/> <br/> .We are interested in your service.<br/> <br/> .Please call me back "
"Hello, my name is Jane, from 'IStaff' company. .We are interested in your service. .Please call me back "
Whitespace characters like newlines do not render in HTML. You have to change the \n into <br>
function nl2br(str, is_xhtml) {
if (typeof str === 'undefined' || str === null) {
return '';
}
var breakTag = (is_xhtml || typeof is_xhtml === 'undefined') ? '<br />' : '<br>';
return (str + '').replace(/([^>\r\n]?)(\r\n|\n\r|\r|\n)/g, '$1' + breakTag + '$2');
}
dataReceveid = function(json) {
$("div").html(nl2br(json.str));
}
$(function() {
dataReceveid({
str: '"Hello, my name is Jane, from "IStaff" company.\r\n\r\n.We are interested in your service.\r\n\r\n.Please call me back "'
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div></div>
The browser doesn't know what does it means \r\n. The language the web browser know only is HTML and \r\n is not an HTML language word. To break the line in the browser you have to use HTML language tag <br /> so the browser can consider it and break the lines.
So the simple solution to your problem is replacing \r\n with <br /> HTML tag/element.

Can't insert line break in Ajax outputString

I have an Ajax script that outputs both the title and description of certain jobs based on user input. While I can get these displaying without issue, I can't seem to insert a line break between the title and description. I have the following:
outputString = savedData[i].firstName + ". Description: " + savedData[i].cardNumber;
var paragraph = $("<p />", {
text: outputString
});
$("#data").append(paragraph);
I have tried inserting a traditional br line break, as well as, \n and \r\n both in the quotation marks before description which just displays the text of the line break rather than breaking the line, and also outside of the quotation marks which breaks any output. How can I successfully implement a linebreak?
Cheers.
As you are providing the outputString string as text, the html <br/> is being displayed as text in the string. You should specify it in as html and use <br/> for line break:
outputString = dataJobs[i].title + ". <br/>Description: " + dataJobs[i].description;
var paragraph = $("<p />", {
html: outputString
});
$("#data").append(paragraph);
If you would like to add a <br/> specifically, then you can do the following:
// assuming that your dataJobs[i].title and dataJobs[i].description are defined
var paragraph = $("<p />");
paragraph
.append(dataJobs[i].title + '.')
.append('<br />')
.append("Description: " + dataJobs[i].description);
$("#data").append(paragraph);
You need to add a <br/> in a separate append call, but not as part of a string. Hope this helps.
In the code below as the P tag has display property set to block by default, so there is no need for using line break.
Setting Title and Description in two different P tags that will solve your problem
Try the following code.
outputString = "<p>Title: "+dataJobs[i].title+"</p><p>description: "+dataJobs[i].description+"</p>";
$("#data").append(outputString);
I think the "jQuery way" should look like this:
var $outputString = $( "<span>" + dataJobs[i].title + ".<br>Description: " + dataJobs[i].description + "</span>" );
$( "#data" ).append($outputString.wrap( "<p></p>" ));
outputString = dataJobs[i].title + ". Description: " + dataJobs[i].description + "<br/>";

\n or <br\> is not working in javascript

I am setting value of hiddenfield from code behind in vb.net
If(condition)
hdmodulename.Value =Dt_Module.DefaultView(0).Item("vModuleCode").ToString() +
"-" + Dt_Module.DefaultView(0).Item("vModuleName").ToString()
Else
hdmodulename.Value = hdmodulename.Value + "'\n'" + Dt_Module.DefaultView(0).Item("vModuleCode").ToString() + "-" + Dt_Module.DefaultView(0).Item("vModuleName").ToString()
End If
now alert in javascript
i code like below:
alert('You cannot select ' + document.getElementById('<%=hdmodulename.ClientID%>').value);
Output :
'\n' is printed inseted of new line
so what is the probem??
Thanks A ton in advance
As for web pages, break lines with <br> or <p></p> tags. You can also Use Environment.NewLine with VB.
For JS use \n' for the line break -
alert("some text\nmore text in a new line");
Please try with Environment.NewLine for VB.net
as below:
Dim value As String = "[First" + _
Environment.NewLine + _
"Second]"
will return
[First
Second]
Not a vb expert, but shouldn't it be "\n" instead of "'\n'"?
The one in the vb code have both double and single.

Add a "new line" in innerHTML

I am trying to create a table with images in first cell and information about the pic in second cell.
I need to add different information in one cell, like that:
cellTwo.innerHTML = arr_title[element] + arr_tags[element];
Is it possible to add a "new line" there?
I mean like that:
cellTwo.innerHTML = arr_title[element] + "/n" + arr_tags[element];
The simplest way is by adding a line break as html
cellTwo.innerHTML = arr_title[element] + "<br />" + arr_tags[element];
If you want your newlines to be treated literally, you could use the <pre> tag
cellTwo.innerHTML =
"<pre>" + arr_title[element] + "\n" + arr_tags[element] + "</pre>";
To round out your understanding:
Since it is html (innerHTML) it renders html and you can use any html you wish, so in this case simply add an good old fashioned <br>:
var test = document.getElementById('someElementId');
test.innerHTML = "The answer <br>to life, the universe, and everything...<br> is 42.";
If it were a string, such as in an alert box or text box etc. then /n would be correct:
alert('Never /n Forget your towel.');
Happy Coding!
- $cr1ptN!nj#
No, <br /> does not work in asp .net but you can instead write it like so
cellTwo.innerHTML = arr_title[element] + arr_tags[element]; arr_title[element] + "/n" + arr_tags[element];
Edit - alternative wrapped in code tags
cellTwo.innerHTML = arr_title[element] + arr_tags[element];
cellTwo.innerHTML += arr_title[element] + "/n" + arr_tags[element];
Semicolon ";" seems to act as line breaks
Remember the "+=" to assign multiple values to the string

Append a <br/> tag to a value inside a textarea jquery

How would you append a tag on a value inside a textarea, it only appends it after a keypress of SHIFT+ENTER,
here is my code to append on the text area and it does not work??
$('#textarea').append("<br/>"); i think there are still something lacking.
DEMO
Thank you. . .
Are you actually wanting to place the characters in the value?
​$("textarea").val(function(i,v){
return v + "<br/>";
});​​​​
Or simply add a new line?
​$("textarea").val(function(i,v){
return v + "\nfoo";
});​​​​​​​
Fiddle: http://jsfiddle.net/jonathansampson/SNeyy/
If you want to respond only to shift + enter:
$("textarea").on("keypress", function(e){
if ( e.which === 13 && e.shiftKey ) {
$(this).val(function(i,v){
return v + "<br/>"; // or return v + "\n"; (whatever you want)
});
}
});​​​​
Fiddle: http://jsfiddle.net/jonathansampson/SNeyy/1/
You are trying to change the value of the textarea. To add the string "<br/>" you have to use
$('#textarea').val($('#textarea').val() + '<br/>');
and to add a new line you have to use
$('#textarea').val($('#textarea').val() + "\n");
Textarea can have only a text node as its child. <textarea><br/></textarea> is incorrect usage. If you want to add the string "<br/>", the html code should be
<textarea><br/></textarea>
and to add a new line, the html code should be
<textarea>
</textarea>
In other words, you cannot use <textarea><br/></textarea>

Categories

Resources