• Jobs
  • About Us
  • professionals
    • Home
    • Jobs
    • Courses and challenges
    • Questions
    • Teachers
  • business
    • Home
    • Post vacancy
    • Our process
    • Pricing
    • Assessments
    • Payroll
    • Blog
    • Sales
    • Salary Calculator

0

142
Views
How can I re-run a Django For Loop inside a HTML Div using Javascript on Click Event

I have a HTML div like this,

<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>

Inside of it is a For Loop that is executed when the page is first loaded.

Below this For Loop is a 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>

Whenever this button of Comments is clicked, a function in Javascript is called which is defined below,

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 --->
                
                
                
            }

What I want is this that whenever the button is clicked, it re-executes that for Loop inside my main div without having to refresh the page. I have been trying to do this for two days but could not find any solution to this. Can anyone help me in doing this?

almost 3 years ago · Juan Pablo Isaza
1 answers
Answer question

0

The Django Templating Language is executed server-side. That means the client (browser, running Javascript) has no access to it whatsoever.

Some of your options are:

  • Do everything back-end: Re-render the template (which you said don't want to do).
  • Do everything front-end: You could have your view function return the data used in your template loop and re-implement it in your front-end (but that makes the original template loop kind of pointless).
  • Hybrid: Return the data for only the new comment in your response and add it to the list with Javascript.
almost 3 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Our process Sales
Legal
Terms and conditions Privacy policy
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recommend me some offers
I have an error