How to use django template tags in .js file ??

[Ayush Bisht]

while doing great stuff with django I have found some clumsy behaviour of 
django in handling .js file. Is there a way to effectively integrate all 
the stuff of <script> </script> in a separate file and effectively used it 
with rest of the html code. 

for example : 

// *file.html 
..........................................................................*

    <div class = "like">
              <div class="like-inner-flex-1">
                <form action = "{% url 'blog_likes' object.slug %}" 
method="POST" id="likes-form">
                {% csrf_token %}
                <button type="submit" role = "checkbox" class="like-btn" 
id="like-{{object.pk}}"></button>
                </form>
              </div>
              <div class="like-inner-flex-2">
                <p id = "likes">{{ object.total_likes }}</p>
              </div>
            </div>




//  *file.js file*  
..................................................................................

$("#likes-form").submit(function (e)
{  e.preventDefault();
  var serializedData = $(this).serializeArray();
  $.ajax({
      type: 'POST',
      url: '{% url 'blog_likes' object.slug  %}',
      data: serializedData,
      success: function (response) {
        var like_count = JSON.parse(response["like"]);
        like_flag = JSON.parse(response["flag"]);
        
        console.log(like_flag);
      
        if(like_flag == 0){      
        $(".like-inner-flex-1").toggleClass('like-animate');       
      }else
      $(".like-inner-flex-1").toggleClass('like-animate'); 
      
      if(like_flag){
          $('.like-btn').css({"background-color": "#d629801a" , "outline": 
"none"});
        $('.like-inner-flex-1').css({"background-position": "right",  "filter": 
"grayscale(0%)"});

        } else {
        $('.like-btn').css({"background-color": "transparent", "outline": 
"none"});
        $('.like-inner-flex-1').css({"background-position": "right",  "filter": 
"grayscale(100%)"});

        }

        $("#likes").text(`${like_count}`);
        }})
    })

..........................................................

if I use above script inside the same html file then it works, but in above 
case its not working ?? If there is any work around to do this thing , then 
please suggest me .

Thank you.......

 


-- 
You received this message because you are subscribed to the Google Groups 
"Django users" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to django-users+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/django-users/fbb6ae3c-2632-4183-9336-fb6bad5dfe0en%40googlegroups.com.