使用Jquery在Flask模板中编码问题

时间:2018-03-02 20:26:37

标签: javascript jquery flask jinja2

我有两个模板,第一个简单地从数据库中提取数据并在页面上显示它们,第二个模板将相同的数据传递给提供布局和其他内容的jquery“tabulator”。 问题是显然相同的{{place.name}}在第一个上打印为Chips & Beers,在第二个上打印为Chips & Beers

这是第一个模板

<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" integrity="sha512-dTfge/zgoMYpP7QbHy4gWMEGsbsdZeCXz7irItjcC3sPUFtf0kuFbDz/ixG7ArTxmDjLXDmezHubeNikyKGVyQ==" crossorigin="anonymous">
    <title>Milano - Publist</title>
</head>

<body>

    <div class="container">
        <table>
            <tr>
                <th>NOME</th>
            </tr>
            {% for place in places %}
                <div class="row">
                    <tr>
                        <td>{{ place.name }}</td>

                    </tr>
                </div>
            {% endfor %}
        </table>
</body>

这个是带有jquery和制表符的模板。

<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" integrity="sha512-dTfge/zgoMYpP7QbHy4gWMEGsbsdZeCXz7irItjcC3sPUFtf0kuFbDz/ixG7ArTxmDjLXDmezHubeNikyKGVyQ==" crossorigin="anonymous">
    <link href="static/tabulator.min.css" rel="stylesheet">
    <title>Milano - Publist</title>
</head>

<body>

    <div class="container">
        <script type="text/javascript" src="static/jquery.js"></script>
        <script type="text/javascript" src="static/jquery-ui.min.js"></script>

        <script type="text/javascript" src="static/tabulator.min.js"></script>
        <div id="example-table"></div>
        <script type="text/javascript">

        var tabledata = [];
        {% for place in places %}
            var line = {}
            line.name = "{{ place.name }}"
            tabledata.push(line)
        {% endfor %}
            //load sample data into the table

            $("#example-table").tabulator({
            height:"100%", // set height of table (in CSS or here), this enables the Virtual DOM and improves render speed dramatically (can be any valid css height value)
            layout:"fitColumns", //fit columns to width of table (optional)
            columns:[ //Define Table Columns
                {title:"Nome", field:"name", width:150}
            ],
        });

         $("#example-table").tabulator("setData", tabledata);
        </script>

    </div><!-- /.container -->
</body>

我无法找到编码实际发生的位置。

1 个答案:

答案 0 :(得分:1)

根据文件:Formatting Data

  

注意:为了防止代码注入,任何用于显示文本(明文,文本区域,金钱,电子邮件,链接)的格式化程序都会首先清理数据,以防止任何可能有害的HTML或JavaScript进入表格,导致任何此类数据显示为其纯文本替代。如果您希望正确显示HTML,请使用html格式化程序,但请注意,如果您的数据可以由用户编辑,则可能允许恶意脚本注入。

您看到的是一个简单的HTML编码,它是为了您的应用程序的安全。您可以尝试使用formatter:"html"或自行准备自定义过滤器。