Django template rendering HTML parameter as text
Question
I created a Django template that requires parameters from a Django view. One of the parameters is a bit of html that displays a gantt chart. Instead of rendering the parameter as proper html, it is rendering it as text.
Why is it treating the parameter contents as text instead of recognizing the <script> and <div> tags?
The html in the parameter I'm passing to the Django view looks like this:
<script language="Javascript" type="text/javascript">
window.onload = function() {
var MyVar = [
{label: "Label-less", times:[{"starting_time":1420228800000,"ending_time":1420257600000}, {"starting_time":1420264800000, "ending_time":1420293600000}, ]},
];
function drawtimeline_MyVar() {
var chart = d3.timeline()
.showBorder()
.stack() // toggles graph stacking
...
*(code removed here for size purposes)*
...
var svg = d3.select("#DIV_MyVar").append("svg").attr("width", 1000)
.datum(MyVar).call(chart);
}
//Call the function
drawtimeline_MyVar();
}
</script>
<div>
<h3>Mehe</h3>
<div id="DIV_MyVar"></div>
</div>
<div id="DIV_MyVar_hover" class="hoverDiv">
<div class="coloredDiv"></div>
<table border=1 cellpadding=10>
<tr>
<td>
<p>Task ID: </p><div id="name"></div>
</td>
</tr>
</table>
</div>
And the parameter, comm_request , is used at the bottom of the template like this:
<html>
<head>
<title>Search Results</title>
<meta charset="utf-8">
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script language="Javascript" type="text/javascript" src="./Review/d3-timeline-master/src/d3-timeline.js"></script>
<script type="text/javascript">
{{ JSLIB }}
</script>
<STYLE type="text/css">
.axis path,
.axis line {
fill: none;
stroke: black;
shape-rendering: crispEdges;
}
.axis text {
font-family: sans-serif;
font-size: 10px;
</STYLE>
</head>
<body>
<div class="container">
<div class="page-header">
<h1>
<p class="text-center">Much Results</p>
</h1>
</div>
</div>
<div class="container">
<h3><p class="text-center">Charts</p></h3>
</div>
<div class="container">
<h4 class="text-center">
Gantt Chart
</h4>
</div>
{{ comm_requests }}
</body>
</html>
3 answers
solution1
2 ACCPTED 2015-05-28 19:49:17
在模板中，您可以使用safe过滤器。
{{ variable_with_html_tag_value | safe }}
solution2
1 2015-05-28 19:48:00
您需要将html标记为安全，可能使用django.utils.safestring.mark_safe并将参数作为变量传递将解决您的问题。
solution3
0 2016-01-11 17:59:25
Take a look at the documentation of safe filter . This is required to mark the string safe , that is safe to print as is without escaping any HTML. Note that when autoescape is set to off, safe filter has no effect. With autoescape you can do what you need as follows:
{% autoescape off %}
{{ body }}
{% endautoescape %}
This turns off automatically escaping of HTML, so that the contents of the variable body are output as is.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.