PHP/jQuery - jQuery 插件 + PHP Foreach 只返回一个工作结果？ | Twitter Bootstrap 的 X-Editable

Question

有一个名为 X-Editable 的插件，我将它集成到 Bootstrap 中以单击更改 Ajax 请求。我已经全部设置好了，并且设置好了，但我的问题是我在一个 foreach 循环中使用它来从我的数据库中回显我的用户，但它只是使第一行可编辑。 screen

这是我的 PHP Foreach，

<?php foreach($rows as $row):  $userid = $row['id'];  ?> 
<tr> 
<td><?php echo $row['id']; ?></td> 
<td><?php echo htmlentities($row['username']); ?></td> 
<td><a href="#" id="username" data-type="text" data-pk="1" data-url="/post"><?php echo   htmlentities($row['email']); ?>     </a></td>
<td><?php echo preg_replace('/([0-9]+\.[0-9]+\.[0-9]+)\.[0-9]+/', '\\1.**',$row['ip']); ?></td> 
<td><?php echo htmlentities($row['timestamp'); ?></td>

<?php endforeach; ?> 

这是我如何使 id “用户名”可编辑，

<script type="text/javascript">
$('#username').editable();
</script>

插件的文档可以在here找到

对不起，如果我缺乏信息，但我认为这是一个非常普遍的问题，为什么插件只使第一个结果可编辑？

Answer 1

ID 必须是唯一的，将 id="username" 更改为 class="username"，然后这样做

$('.username').editable(); 

或者做

<?php echo "username-".$userid; ?>

然后

$('[id^=username]').editable();