Databases
StackOverflow2013
Postsdbo
POWhy using the "safe" filter in jinja creates nested elements
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POWhy using the "safe" filter in jinja creates nested elements
    primarykey
    data
    text
    <p>I have a python dictionary called "asides". The values of this dict are html snippets loaded from my database and I want to inject them into a jinja template.</p> <p>The below is the jinja snippet:</p> <pre><code>&lt;div class="small-3 large-3 columns"&gt; {% for k in asides.keys() %} &lt;div id={{k}} class="aside"&gt;{{asides[k]|safe}}&lt;/div&gt; {% endfor %} &lt;/div&gt; </code></pre> <p>This creates nested divs. Say my dict has ids 1 and 2, this will do the following:</p> <pre><code>&lt;div class="small-3 large-3 columns"&gt; &lt;div id=1 class="aside"&gt;some html here &lt;div id=2 class="aside"&gt;some html here &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p>If I remove the safe filter, it behaves normally creating non nested divs.</p> <p>I would like to know why the safe filter does this and how to avoid it (as I don't want nested divs).</p> <hr> <p>All right, following the suggestion in the comments I realized where the issue was. I am going to document it here as it's a funny business in my opinion.</p> <p>So, in app.py (using Flask):</p> <pre><code>from flask import Flask, render_template app = Flask(__name__) app.debug = True @app.route('/') def index(): d = {'1':'&lt;p&gt;Test 1&lt;/p', '2':'&lt;p&gt;Test 2&lt;/p&gt;'} return render_template('index.html', d=d) if __name__=='__main__': app.run() </code></pre> <p>Note how the html of the first element in d is not correct. The closing p tag is missing a ">".</p> <p>Then in the template</p> <pre><code>&lt;html&gt; &lt;body&gt; &lt;div&gt; {% for k in d %} &lt;div class={{k}}&gt;{{d[k]|safe}}&lt;/div&gt; {% endfor %} &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>This will nest the second div inside the first div.</p> <p>I think the question is still open as it would be interesting to know why this happens.</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PTQuestion
    1. USkfk
    1. USkfk
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. POWhy using the "safe" filter in jinja creates nested elements
      1. This table or related slice is empty.
      1. VTUpMod
    1. COI cannot duplicate your problem. I have copied you template verbatim and created a small python script to instantiate the template and render it. Can you share actual working code that produces the output you're seeing?
      singulars
      1. POWhy using the "safe" filter in jinja creates nested elements
      1. USjcdyer
    2. COI pushed a temporary git here: https://github.com/kfk/vistula_article. If safe is removed from the index.html filter, it will not nest the divs, otherwise it will.
      singulars
      1. POWhy using the "safe" filter in jinja creates nested elements
      1. USkfk
    3. COGood practice in asking questions on the internet is to reduce your problem to the smallest piece of working code you can that demonstrates your problem. Preferably I don't have time to scour your entire codebase for the problem. Also, creating a temporary commit that you intend to delete later makes this post useless for anyone who find it later looking for answers to the same problem. Please edit your question with actual code that can be run to demonstrate your problem, preferably in under twenty lines or so.
      singulars
      1. POWhy using the "safe" filter in jinja creates nested elements
      1. USjcdyer
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload