jquery - 如何在表行中使用引导程序 x-editable？

Question

我想使用 bootstraps X-editable 插件。我在我的表中检索服务器端数据，我想在线编辑它们。如我所见，建议使用 X-editable 与 id 一起使用。有可能用多个数据处理这个吗？

文档：

<a href="#" id="username" data-type="text" data-pk="1" data-url="/post" data-title="Enter username">superuser</a>

$(document).ready(function() {
    $('#username').editable();
});

如果我有更多用户名怎么办？

Answer 1

<a href="#" id="username" data-type="text" data-pk="1" data-url="/post" data-title="Enter username">superuser</a>

改成

<a href="#" class="username">superuser</a>

和

$(document).ready(function() {
    $('#username').editable();
});

改成

$(document).ready(function() {
    $('.username').editable();
});

Answer 2

将id用于<table>：

<table id="user" class="table table-striped">
<tr><td>
<a href="#" id="username" data-type="text" data-pk="1" data-url="/post" data-title="Enter username">superuser</a>
</td></tr>
</table>

$(document).ready(function() {
    $('#user a').editable();
});

Answer 3

如果您有更多用户名，最好更改该名称。您可以设置可编辑的任何您想要的元素。只需制作一个选择器即可。您可以使用 data-* 属性来做到这一点。

伟大的，雨果佩德罗萨