Django : How to give parameters to {% url %} tag in javascript function which will be used in FOR loop?

Question

I try to make a button with a javascript "location.href" property in Django ListView templates.

{% for item in object_list %} 
   <div class="clear_float"> 
    <h2><a href = "{% url 'photo:album_detail' item.id %}">{{ item.title }}</a></h2>
    &emsp;<b><i>{{ item.description }}</i></b> 
    <p style="display:inline" class="editbutton">
    <b><button onclick="photoAdd()">Add Photo</button></b>
    {% if item.author == request.user %}
    <b><button onclick="albumEdit()">Edit</button></b>
    <b><button onclick="albumDelete()">Delete</button></b>
    {% endif %}
    </p>
    </div>
{% endfor %}

And albumEdit() and albumDelete() is coded like below.

function albumEdit(){
    location.href="{% url 'photo:album_edit' object.id %}";
}
function albumDelete(){
    location.href="{% url 'photo:album_delete' object.id %}";
}

{% url 'photo:album_edit' object.id %} returns "photo/object.id/edit/"

The problem is, I guess, the ListView returns object_list so the javascript function is used in FOR loop with item object. I tried replacing object.id with item.id but it didn't work.

So I also tried another way to give a argument to javascript function like below.

<b><button onclick="albumEdit({% url 'photo:album_update' item.id %})">Edit</button></b>

and javascript

function albumEdit(arg){
    var address = arg;
    location.href=encodeURI(address);
}

Cuz I don't know much about javascript, it also didn't work. I will be grateful for any advice and help.

Thank you :D

I fixed it with input javascript code to the onclick attribute like <b><button onclick="location.href='{% url 'photo:album_edit' item.id %}'">Edit(</button></b> — Izabel Cybulska
– Izabel Cybulska, Commented Apr 17, 2017 at 10:44

Izabel Cybulska · Accepted Answer · 2017-04-17 10:55:18Z

1

I fixed it with input javascript code to the onclick attribute like

<b><button onclick="location.href='{% url 'photo:album_edit' item.id %}'">Edit</button></b>

answered Apr 17, 2017 at 10:55

Izabel Cybulska

236 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

XaviP · Accepted Answer · 2017-04-17 10:27:09Z

0

You can pass a parameter in your js onclick function:

<button onclick="albumEdit({{ url 'photo:album_edit' item.id }})">Edit</button>

and use it to make the redirection:

function albumEdit(href_url){
    location.href=href_url;
}

edited Apr 17, 2017 at 10:27

answered Apr 17, 2017 at 9:48

XaviP

1881 gold badge2 silver badges8 bronze badges

6 Comments

Izabel Cybulska Over a year ago

Thanks for your comment :) I tried your way but photo:album_edit requires an argument 'id' so it returned "NoReverseMatch Error with no arguments not found". Also, the url format is /photo/id/edit, so photo/edit/id/ couldn't be matched.

XaviP Over a year ago

Edited to make it closer to your requirements, but I think it's similiar to one of the options you've pointed.

Izabel Cybulska Over a year ago

Thank your for your time! I'm afraid your way didn't work for me but it helped me and now I fixed my problem.

XaviP Over a year ago

Yes, it seems a more optimized solution!

XaviP Over a year ago

And you can make your comment as an answer and mark it as the good answer to your question.

|

Collectives™ on Stack Overflow

Django : How to give parameters to {% url %} tag in javascript function which will be used in FOR loop?

2 Answers 2

Comments

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related