Passing Django Template Vars to JS

32 views
Skip to first unread message

Simon Connah

unread,
Jun 10, 2018, 11:20:05 AM6/10/18
to django...@googlegroups.com
I know that the standard way to do this is to create a script tag with
a global JS variable in your Django template before you import your
other JS files but that won't work for my current situation.

I have an article detail view which is a single model instance. But I
also have a list of comment objects that have a Foreign Key to the
article (because that is the article that is being commented on).

I need to pass the comment_id to the JS files that I am loading. If
you want to see the code I am using then you can see it here:

https://gitlab.com/glamorous-systems/seductive/blob/master/blog/templates/blog/article_detail.html

I thought I'd use an onclick event on the Like / Dislike button to
call a JS function which then passes that value to this JS file:

https://gitlab.com/glamorous-systems/seductive/blob/master/blog/static/js/pass_comment_id.js

and then I'd just call the return_comment_id() function from my other
JS files to get the comment_id of the specific comment the user
clicked the Like / Dislike button for. I think the problem is that my
jQuery AJAX selectors are also looking for a click event, so they
happen in a strange order, but I'm not sure.

I'm totally lost on what I should be doing here. Any help would be
very much appreciated :).

Vijay Khemlani

unread,
Jun 10, 2018, 9:04:25 PM6/10/18
to django...@googlegroups.com
I'm not sure why your code does not work (maybe there is a "race condition" between the JS click handlers), but that global variable is a bad idea in general.

You can add the comment ID as an attribute to your button, like

<button class="btn btn-info" id="like_comment_button" data-comment-id="{{ comment.id }}">

and in your event handler obtain the comment id

$("#like_comment_button").click(function (event) {
   var comment_id = event.target.getAttribute('data-comment-id')
   // Call AJAX
})

That way you don't need the global variable or the other click handler

Finally, it's a bad idea to have multiple elements with the same ID (all comments will have a button with ID "like_comment_button") so it's better to add it as a class rather than an id.

Regards





--
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...@googlegroups.com.
To post to this group, send email to django...@googlegroups.com.
Visit this group at https://groups.google.com/group/django-users.
To view this discussion on the web visit https://groups.google.com/d/msgid/django-users/CADNsu1OksTqc2crvX%3DK%3D_Kf_Xz1fCfABTRV-q48htRUikiAtXA%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.

Simon Connah

unread,
Jun 11, 2018, 2:12:41 PM6/11/18
to django...@googlegroups.com
Hi Vijay,

Thank you very much for the reply and sorry for the late reply.

You are completely right about not having multiple elements with the
same ID. I completely forgot that an ID was meant to be unique on a
page. I'll change it to a class.

I like the idea of the custom attribute. I'll do that then.

Simon.
> To view this discussion on the web visit https://groups.google.com/d/msgid/django-users/CALn3ei0ZneJzKAbSyN958_1RCaS7kjQY6VszQb8a%3D-Mxgod-GQ%40mail.gmail.com.

Melvyn Sopacua

unread,
Jun 11, 2018, 3:08:48 PM6/11/18
to django...@googlegroups.com

On maandag 11 juni 2018 20:11:36 CEST Simon Connah wrote:

 

> I like the idea of the custom attribute. I'll do that then.

 

The common way is to use a data- attribute.

--

Melvyn Sopacua

Reply all
Reply to author
Forward
0 new messages