Django - Обновить div как обычный текст после того, как я создаю пост, используя ajax

Question

В моем проекте есть модель Post.На моей домашней странице есть список всех записей и формы post_create.Я создаю пост, используя ajax view.Намерением было создать новый пост и обновить домашнюю страницу без обновления страницы.Вот код, views.py,

 def post_create_ajax(request):
   if request.is_ajax():
      if request.method == 'POST':
        title = request.POST.get('the_post')
        author = request.user
        post = Post(title=title, author=author)
        print(title)
        post.save()
        return JsonResponse({'title': title})

Сценарий,

$('#postform').submit(function(event){
   event.preventDefault();
   console.log('Working');
   create_post();
});

function create_post(){
   console.log('Create Post is working');
   var posttitle = $('#id_title').val();
   $.ajax({
      url: '/ajaxcreate/',
      type: "POST",
      data: {
          the_post: posttitle,
          csrfmiddlewaretoken: '{{ csrf_token }}',
      },
      dataType: 'json',
      success: function(data){
          $('#id_title').val('');
          console.log(data.title);
          $('#post_title_content').html(data.title);
       },
       error:function(){
          console.log('Error Occoured');
          alert('Error');
       },
   })
}

Эта часть отлично работает.Страница нового сообщения добавляется без обновления.

Вот проблема.После того, как я отправляю сообщение, новый заголовок, который добавляется, не является безопасным.

например, если я добавлю <b> This is a title </b>, новый div будет добавлен с Это заголовок , который вернется к обычному тексту <b> This is a title </b> только после того, как я обновлю страницу.

Итак, мой вопрос: как изменить мой сценарий, чтобы он обновлял div как обычный текст?

Изображения:

Добавлено новое сообщение, но не в виде простого текста,

После обновления он отображается в виде обычного текста,

Answer 1

Вы должны использовать .text вместо .html в этой строке

$('#post_title_content').html(data.title);

jQuery.html () обрабатывает строку как HTML, а jQuery.text () обрабатывает содержимое как текст

Answer 2

Вы должны использовать .text(data.title) вместо .html(data.title).Более подробная информация по этому другому вопросу .