Javascript 如何在动态表中使用唯一id通过按钮传递数据

我正在使用django和bootstrap，我希望通过按钮传递数据，并显示bootstrap弹出模式上的数据，我希望在每个循环中x.bots数据的传递是唯一的，以便我可以访问bot title，bot id 在x.bots上使用另一个循环

 {% for x in data %}
    <td>{% if x.bots %}<a href="#myModal" class="btn btn-primary btn-sm" data-toggle="modal" data="x.bots"> Show Bots &nbsp;{{ x.bots|length }}{% endif %}</a></td>
{% endfor %}

{%x在数据%}
{%if x.bots%}
{%endfor%}

这是我的脚本文件

<script>
        $(document).on('show.bs.modal','#myModal', function (event) {
           var button = $(event.relatedTarget);
           var recipient = button.data(x.bots);
           var modal = $(this);
           modal.find('.modal-title').text('Bots Title');
           modal.find('.modal-body input').val(i);
        })
      </script>

$（document）.on（'show.bs.modal'，'#myModal'，函数（事件）{
var按钮=$（event.relatedTarget）；
var recipient=button.data（x.bots）；
var modal=$（本）；
modal.find（'.modal title'）.text（'Bots title'）；
modal.find（'.modal body input'）.val（i）；
})

---

但是我尝试了很多不同的方法，但是没有得到数据，在我看来，

var-modal=$（这个）不会生成元素，因为我看不到在任何地方定义的
此

可能将其更改为
var modal=$（'#myModal'）或
var model=event.target
？
更改此

 {% for x in data %}
<td>{% if x.bots %}<a href="#myModal" class="btn btn-primary btn-sm" data-toggle="modal" data="x.bots"> Show Bots &nbsp;{{ x.bots|length }}{% endif %}</a></td>{% endfor %}

{%x在数据%}
{%if x.bots%}{%endfor%}

对此,

{% for x in data %}
<td>{% if x.bots %}<a href="#myModal" class="btn btn-primary btn-sm" data-toggle="modal" data="x.bots"> Show Bots &nbsp;{{ x.bots|length }}</a>{% endif %}</td>{% endfor %}

{%x在数据%}
{%if x.bots%}{%endif%}{%endfor%}
您可以尝试这样的方法。使用onclick javascript函数并传递要使用的参数

    {% for x in data %}
        <td>{% if x.bots %}<a href="#myModal" class="btn btn-primary btn-sm" data-toggle="modal" data="x.bots"
                              onclick="myFunction({{ x.bots.title }} , {{ x.bots.id }})"> Show Bots &nbsp;
            {{ x.bots|length }}{% endif %}</a></td>
    {% endfor %}

    function myFunction(title, id) {
        //write code here
    }