Как я могу повторно запустить цикл Django For Loop внутри HTML Div с помощью Javascript по событию Click

У меня есть HTML div следующего вида,

<div  class="coment-area ">
            
            <ul class="we-comet">
              {% for j in comment %}
              <div  id="delete_comment{{j.id}}" class="mt-3">
                {% if j.post_id.id == i.id %}
                
                <li >
               
                      <div class="comet-avatar">
                        {% if j.user_id.User_Image %}
                          <img class="card-img-top" style=" vertical-align: middle;width: 50px;height: 50px;border-radius: 50%;" src= {{ j.user_id.User_Image.url }} alt="">
                        {% else %}
                       <img class="card-img-top" style=" vertical-align: middle;width: 60px;height: 60px;border-radius: 50%;" src="static\images\resources\no-profile.jpg">
                       {% endif %}
                      </div>

Внутри него находится цикл For Loop, который выполняется при первой загрузке страницы.

Ниже этого цикла For Loop находится кнопка Comments Button

    <div >
                                <button type="submit" onclick="comment_save(event,{{i.id}})"  class= "my-2 ml-2 px-2 py-1 btn-info  active hover:bg-gray-400 rounded ">Comment</button>
                            </div>
                            
                        </div>    
                    </li>
                </ul>
            </div>

При нажатии на кнопку Комментарии вызывается функция на Javascript, которая определена ниже,

function comment_save(event,post_id)
            
            {   
                var comment_value=$("#comment_value"+post_id).val();    
                

                var user_id=$("#comment_user_id"+post_id).val()
                
                postdata={
                    "comment_value":comment_value,
                    "user_id":user_id,
                    "post_id":post_id
                }
                SendDataToServer("readmore",postdata,function()
                {
                    alert()
                }) 
                
                $("#comment_value"+post_id).val(" ")
                <! --- document.location.reload().. Something here that refresh that for loop --->
                
                
                
            }

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

Язык шаблонов Django Templating Language выполняется на стороне сервера. Это означает, что клиент (браузер, запускающий Javascript) не имеет к нему никакого доступа.

Некоторые из ваших вариантов:

  • Сделайте все на задней стороне: Перерисовать шаблон (что вы сказали, что не хотите делать).
  • Сделайте все front-end: Вы могли бы заставить функцию представления возвращать данные, используемые в цикле шаблона, и повторно реализовать их во front-end (но это делает оригинальный цикл шаблона бессмысленным).
  • .
  • Гибрид: Верните данные только для нового комментария в вашем ответе и добавьте его в список с помощью Javascript.
  • .
Вернуться на верх