Webapi returns custom text string with 13 and 10 characters for line. If I show this custom text in html, I do not see line breaks (if I use <pre> tag, then line breaks are shown).
What should be modified in html or css to show linebreaks? I cannot modify webapi.
I am using knockout data binding to insert values from webapi into html.
<p data-bind="text: $data.CustomTxt"></p>
Use css property "white-space: pre-line":
Sequences of whitespace will collapse into a single whitespace. Text will wrap when necessary, and on line breaks
Related
I have a Many2many field and would like to make a new line after each item.
When trying with other separators like : ',', '/', ... that's work. The problem was only with '\n'. I even tried with '
'
Here is my code:
<span t-esc="'\n'.join(map(lambda x: x.name, move.myfield_ids))"/>
Any help, please ? What's wrong?
Thanks.
Spaces, tabs or line breaks (white spaces) are largely ignored, whitespace in between words is treated as a single character, and whitespace at the start and end of elements and outside elements is ignored.
Whitespace character processing can be summarized as follows:
All spaces and tabs immediately before and after a line break are ignored
All tab characters are handled as space characters
Line breaks are converted to spaces
Any space immediately following another space (even across two separate inline elements) is ignored
Sequences of spaces at the beginning and end of a line are removed
1. Use the CSS white-space property to set how white space inside an element is handled
Example: Using pre-wrap value
<span style="white-space: pre-wrap;" t-esc="'\n'.join(map(lambda x: x.name, move.myfield_ids))"/>
2. You can get the same result using the raw directive, which behaves the same as esc but does not HTML-escape its output. It can be useful to display separately constructed markup (e.g. from functions) or already sanitized user-provided markup.
Example: Using <br/>
<span t-raw="'<br/>'.join(map(lambda x: x.name, move.myfield_ids))"/>
Why does:
<pre style="background:red">
line 1
</pre>
render the same as:
<pre style="background:red">line 1</pre>
The first has two more line breaks, but it seems the browser ignores them. What's the rule for this?
If a text node begins with white space (space, new line) it will be ignored by HTML parsers. Encoding the new line into a proper HTML entity forces the parser to acknowledge it.
== carriage return
use this instead:
<pre style="background:red">
line 1</pre>
The pre tag will keep all formatting inbetween, but not at the beginning
See https://stackoverflow.com/a/15529725/6852641 for more
I've taken multiline input with textarea html tag eg:
line 1
line 2 with <tags> and # and <b> bold </b>
line 3
but how can I later display this?
If I use:
#Html.DisplayFor(m => m.MultilineText2)
it handles the special characters fine, but not the linebreak
If I use:
#Html.Raw(Model.MultilineText2.Replace(Environment.NewLine, "<br/>"))
it handles the linebreak, but not the special chars.
I just want the result to appear exactly as the user entered it (exactly as you see it in the example above)
If I understand correctly, what you want is to encode everything else except the linebreakers. But you don't need to care about that. Since there's a standard way by white-space :
pre-line
Sequences of white space are collapsed. Lines are broken at newline characters, at , and as necessary to fill line boxes.
So, simply adding a white-space: pre-line will work:
<span style="white-space: pre-line">#Html.DisplayFor(m => m.MultilineText2)</span>
the generated html will be :
<span style="white-space: pre-line">line 1
line 2 with <tags> and @ and <b> bold </b>
line 3</span>
Just use #Html.TextAreaFor(m => m.fieldName)
It seems not,as they are showing up as cleartext.
I am trying to format a rather large tootlip by inserting <p> and <br>, but, as I say, Chrome treats them as text.
What am I allowed to put into such a tooltip? Anything other than a single string?
Since \n seems to be ignored, is there any way to get a line break into such a string?
You can add symbol for a new line:
(\r) or
(\n) to your title.
test
Another option is to find some JavaScript tooltip library.
If you feed them actual line breaks, they will work.
<span title="Two
Liner">Hover here</span>
However, if you need more complex HTML inside, I'd suggest qTip or Bootstrap's tooltips
I want to make newline (CR and LF) characters visible in a textarea field of an HTML form, as you can do in some text editors and IDEs. The user needs to be able to edit the text to insert newlines as well (i.e. create paragraph breaks), which should also show dynamically. Is there a way to do this?
TIA....
Steve
The only way to do this is to print out your own marker characters before/after each line break, using javascript.
The character reference for the pilcrow (¶) character is ¶.