2013-10-14 2 views
5

У меня возникла проблема при попытке отобразить html-фрагмент кода, созданный в представлении django. Вот что происходит.Django: Передача HTML-строки в шаблон

На мой взгляд, я пытаюсь передать шаблону кучу описаний книг, которые я скрою/покажу в соответствии с действием пользователя. Эти описания хранятся в html-файлах на сервере.

def my_view() 
    #loop through the list of books, read their corresponding a html file, and parse it to fill in the book details 
    #code, code, code... 
    #take the resulting string, append it on books description array, log it and send it to template 
    logger.debug(books_description["Clockwork orange"]) 
    return render_to_response("my_template.html", {'bd': books_description}, context_thingy) 

Пока все хорошо. Мои журналы показать HTML строку точно так, как и должно быть:

<div id="modal_book_name">Clockwork orange</div> 
<div id="modal_book_genre">Dystopian fiction</div> 
<br> 
<div id="modal_book_desc">yadayadayadayada</div> 

Теперь, так как я не хочу содержание кладя о на моем HTML коде, я прочитал описание книги в яваскрипта переменную как так:

books_description = {}; 
{% for book, book_desc in bd.items %} 
     books_description["{{ book }}"] = "{{ book_desc|escapenewline }}" 
{% endfor %} 

escapenewline - это фильтр, который помещает \ в конец каждой строки, чтобы javascript мог правильно интерпретировать весь контент строки.

Наконец, когда пользователь хочет ознакомиться с описанием в какой-либо книге, он просто нажимает на него, а модальный отображается с описанием книги. для этого у меня есть:

console.log(books_description[book_name]); 
    $("#modal_info").html(books_description[book_name]); 

Опять же, все, кажется, хорошо с этим console.log:

<div id="modal_book_name">Clockwork orange</div><div id="modal_book_genre">Dystopian fiction</div><br><div id="modal_book_desc">yadayadayadayada</div> 

К сожалению, когда я открываю страницу, modal_info ДИВ пуст. Когда я открываю инструменты разработчика в браузере и проверить HTML этого Div вот что я вижу:

<div id="modal_info"> 
     "<div id="modal_book_name">Clockwork orange</div><div id="modal_book_genre">Dystopian fiction</div><br><div id="modal_book_desc">yadayadayadayada</div>" 
</div> 

Проблемы в этих кавычках. Как они появились там? Как я могу избавиться от них и почему они были там в первую очередь?

Заранее спасибо. Если что-то неясно, не стесняйтесь спрашивать, и я это проясню.

UPDATE: Ну, получается, что modal_info ДИВ не был пуст в конце концов .. текст был только тот же цвет в качестве фона. Извиняюсь, это было глупо. Но проблема сохраняется. Где я должен видеть:

Clockwork Orange 
Dystopian fiction 

yadayadayadayada 

Я вижу вместо буквального HTML:

<div id="modal_book_name">Clockwork orange</div><div id="modal_book_genre">Dystopian fiction</div><br><div id="modal_book_desc">yadayadayadayada</div> 

Я пытался разобрать строку в HTML с помощью функции parseHTML:

var book_desc = $.parseHTML(books_description[book_name]); 
    $("#modal_info").html(book_desc); 

, но результаты одинаковы. Любая идея, как заставить браузер интерпретировать строку как html-код, а не как литеральную строку

ответ

9

Проблема решена. Не так драматично, как я думал. Так получилось, что Джанго было преобразование HTML маркеры, такие как «<» и «>» до «& LT» и «& GT»

Это привело к правильному выходу на странице, но неспособность создать соответствующие объекты DOM ,

исправление:

{% autoescape off %} 
    {% for book, book_desc in bd.items %} 
     books_description["{{ book }}"] = "{{ book_desc|escapenewline }}" 
    {% endfor %} 
{% endautoescape %} 

Взял меня некоторое время. Если кто-то попадается на аналогичный вопрос здесь какая-то Intel на autoescaping

autoescape filter

Смежные вопросы