Привет, есть вот такой список в HTML
<ol>
<li>
<button id="auto_add_page" data-catid="1" data-title="Welcome to Python.org" data-url="https://www.python.org/" class="btn btn-mini btn-primary" type="button">Add</button>
<strong><a href="https://www.python.org/">Welcome to Python.org</a>
</strong>
</li>
<li>
<button id="auto_add_page" data-catid="1" data-title="Python (programming language) - Wikipedia, the free ..." data-url="http://en.wikipedia.org/wiki/Python_(programming_language)" class="btn btn-mini btn-primary" type="button">Add</button>
<strong><a href="http://en.wikipedia.org/wiki/Python_(programming_language)">Python (programming language) - Wikipedia, the free ...</a>
</strong>
</li>
<li>
<button id="auto_add_page" data-catid="1" data-title="Download Python | Python.org" data-url="https://www.python.org/download" class="btn btn-mini btn-primary" type="button">Add</button>
<strong><a href="https://www.python.org/download">Download Python | Python.org</a>
</strong>
</li>
</ol>
генерируется шаблонизатором, элементов <li> в списке может быть сколько угодно. В каждой строке есть кнопка с id=«auto_add_page» (я могу сделать идентификатор уникальный для каждой кнопки если нужно) и некоторой доп. информацией.
На каждую кнопку вашается JS обработчик, который делает GET запрос с информацией которая вытаскивается из соотвествующего батона (типо AJAX).
сейчас js функция выглядит так
$('#auto_add_page').click(function() {
var catid, title, url;
catid = $(this).attr("data-catid");
title = $(this).attr("data-title");
url = $(this).attr("data-url");
$.get('/rango/auto_add_page/',
{catid: catid, title: title, url: url},
function(data){
$('#pages').html(data);
});
});