CODEWITHSUNDEEP
htmldjangodjango-templatesnewlinetemplatetags
Prajwal Kulkarni
Prajwal Kulkarni

Reputation: 1695

New line not rendering from template tag in HTML

I have a set of information to be rendered on my webpage using django template tags.

 {% for product in sales %}

      <div>
        <span>Customer:{{product.to_user}}</span><br>
        <span>{{product.time}}</span><br>
        <p class="message">{{product.message}}</p>
      </div>

      {% endfor %}

The {{product.message}} template tag contains information separated by new line('\n'). But, newlines are not rendered in HTML, the information is displayed in a single line omitting to obey '\n'. I tried capturing the information from the <p> tag and replacing \n, with <br>, and again setting the text in the same <p> tag. But it doesn't seem to work.
This was my approach, as stated above.

$(document).ready(function(){

      let renderedText = $(".message").text()

      //alert(renderedText)
      final_txt = renderedText.replace(/\n/g,"<br>")

      $(".message").val(final_txt)
       
    })

What changes or addition should I make, in order to get this working? Thanks in advance.

Upvotes: 5

Views: 1722

Answers (2)

Rakshit Maini
Rakshit Maini

Reputation: 69

In order to have the line information you can use pre tag to keep track of empty spaces and new line.

let message = `Lorem ipsum text Lorem ipsum text Lorem ipsum text.
Lorem ipsum textLorem ipsum text

Lorem ipsum textLorem ipsum textLorem ipsum textLorem ipsum textLorem ipsum textLorem ipsum textLorem ipsum textLorem ipsum textLorem ipsum text`;
<div><pre>{message}</pre></div>

Upvotes: 1

Benbb96
Benbb96

Reputation: 2263

Use the template filter linebreaksbr like so :

<p class="message">{{ product.message|linebreaksbr }}</p>

Upvotes: 6

Related Questions