How to render html with django?

Question

Hi i am practicing Django and Python

And i encounter with parse HTML problem, i saved some html through admin page, and i tried to render,but it rendered as string!

This is my part of template

description <- columns is my problem

other columns are rendered well

{% block content %}
<div class="article-detail">
    <div class="article">
        <img src="{{ article.thumb.url }}" />
        <h2>{{ article.title }}</h2>
        <p>{{ article.date }}</p>
        <div>
{{ article.description }}
        </div>
    </div>
</div>

{% endblock %}

And this is my model

from tinymce import HTMLField

class Article(models.Model):
    title = models.CharField(max_length=100)
    slug = models.SlugField()
    body = models.TextField()
    description = HTMLField('Content', blank=True)
    body = models.TextField()
    date = models.DateTimeField(auto_now_add=True)
    thumb = models.ImageField(default='default.png', blank=True)
    ...

This part of my view

def article_detail(request, slug):
    article = Article.objects.get(slug=slug)
    return render(request, 'articles/article_detail.html', {'article': article})

I tried to use javascript

{% block content %}
<div class="article-detail">
    <div class="article">
        <img src="{{ article.thumb.url }}" />
        <h2>{{ article.title }}</h2>
        <p>{{ article.date }}</p>
    </div>
</div>

<script>
    var article = "<div>{{ article.description }}</div>"
    console.log(article);
    document.write(article);
</script>
{% endblock %}

I hoped this work but
But i got JS syntax Error
console dosen't show anything
Why? If it transformed to string, it should work....

And what is best way to render it ?

And i am sorry for my poor English

I don't think django has an HTML field. Why don't you just use a regular charField or TextField for the description? — spaceSentinel, Jun 21 '20 at 07:29

score 1 · Answer 1 · answered Jun 21 '20 at 07:50

By default, Django auto-escapes output from the template variables in order to avoid Cross-site scripting. If you want to render unescaped string then you can either use safe filter or autoescape template block as follows:

{{ var|safe }}

OR

{% autoescape off %}
    {{ var }}
{% endautoescape %}

score 1 · Accepted Answer · answered Jun 21 '20 at 07:53

Django's templating engine does escaping automatically, so you don't really need to escape.

If you add template filter "safe" like {{article.description|safe}} then you do need to worry about things like html injection, because "safe" marks the string as such and it means that it won't be escaped.

There is also an {% autoescape on %}...{% endautoescape %} template tag, where "on" can be changed to "off", if necessary. By default it's on and the tag is not needed.

Other template engines may not be escaping by default, Jinja2 is one of them.

score 0 · Answer 3 · answered Jun 21 '20 at 07:35

0

Add the safe filter to your html template var. Django automatically escapes html to prevent html injection. You can ‘turn this off’ by adding |safe. For example:

<div> {{ article.description|safe }} </div>

answered Jun 21 '20 at 07:35

Vincent

1,494
12
26

score 0 · Answer 4 · answered Jun 21 '20 at 07:37

The Django template processors are escaping the HTML syntax inside your model.I think you need to include this header tag in order to make your tinyMCE app work. It is some javascript code which probably renders the HTMLField.

<head>
    ...
    {{ form.media }}
</head>

Reference

How to render html with django?

description <- columns is my problem

4 Answers4