将 id 传递给模态

Question

我有一些产品 table，

<td id="detail_maintenance_{{result.id}}" data-detail="" width="25px">
    <span id = "maintenaceDetail" data-maintenaceDetail="{{ result.id }}">
        {{result.id}}
        <i class="icon-search icon_loupe"></i>
    </span>
</td>

我想在单击按钮图标搜索时打开一个信息 = idModal 的模式，结果 id 显示我想要的 ID，但我正在尝试打开一个具有相应 ID 的模式（对不起我的英语）这就是我用 jQuery 打开模式的方式：

$('#modifierlaMnt').click(function () {
    ModifMaintenance();
    $('#validerLaMnt').show();
});

问题是模态已打开但我无法修改信息，因为所有模态都有相同的信息，这就是为什么我想打开模态 id = {{result.id}} 但我没有'知道怎么处理了。

Answer 1

将数据属性maintenaceDetail移动到您要点击的元素，之后您可以为元素分配一个点击事件并轻松访问数据属性，例如

$(function() {
  $(document).on('click', 'i.icon-search', function() {
    console.log($(this).data('maintenacedetail'));
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tr>
    <td id="detail_maintenance_{{result.id}}" data-detail="" width="25px">
      <span>
        foo <i class="icon-search icon_loupe" data-maintenacedetail="foo">O</i>
      </span>
    </td>
  </tr>
  <tr>
    <td id="detail_maintenance_{{result.id}}" data-detail="" width="25px">
      <span>
        bar <i class="icon-search icon_loupe" data-maintenacedetail="bar">O</i>
      </span>
    </td>
  </tr>
  <tr>
    <td id="detail_maintenance_{{result.id}}" data-detail="" width="25px">
      <span>
        foobar <i class="icon-search icon_loupe" data-maintenacedetail="foobar">O</i>
      </span>
    </td>
  </tr>
  <tr>
    <td id="detail_maintenance_{{result.id}}" data-detail="" width="25px">
      <span>
        42 <i class="icon-search icon_loupe" data-maintenacedetail="42">O</i>
      </span>
    </td>
  </tr>  
</table>

将 id 传递给模态

Pass an id to a modal

jquery

modal-dialog