我需要它,所以额外的信息弹出点击,否则是隐藏的。我试过使用show()和hide(),但我不确定我在做什么。谢谢大家,Kieran
视图:
<table class="table table-striped">
<thead>
<tr><th>Last name</th><th>First name</th><th>Practice</th><th>County</th><th>Email</th><th></th></tr>
</thead>
<tbody>
<?php foreach ($health_professional as $hp): ?>
<tr>
<td><?php echo $hp['last_name'] ?></td>
<td><?php echo $hp['first_name'] ?></td>
<td><?php echo $hp['practice'] ?></td>
<td><?php echo $hp['county'] ?></td>
<td><?php echo $hp['email'] ?></td>
<td><a class="btn btn-info" href="hp/view/<?php echo $hp['hpid'];?>">Expand</a></td>
</tr>
<thead>
<tr><th>Permission to send info?</th><th>Registered</th><th>Attendance</th><th>Date of last update</th></tr>
</thead>
<tr id ="trid">
<td><?php echo $hp['send_info']; ?></td>
<td><?php echo $registration_count; ?></td>
<td><?php echo $attendance_count; ?></td>
<td><?php echo $hp['send_info_last_update']; ?></td>
</tr>
<?php endforeach ?>
</tbody>
</table>
你会遇到的一个问题是:
<tr id="trid">
不是唯一的id。由于每个$health_professional都有一个关联的id,因此可以将其更改为:
<tr id="tr-<?php echo $hp['hpid'];?>" class="hidden">
现在你有了唯一的id和一个泛型类,像这样设置你的链接:
<td><a class="expand" data="<?php echo $hp['hpid'];?>">Expand</a></td>
在javascript中你可以调用
$(document).ready(function(){
$('.expand').click(function () {
var id = $(this).attr('data');
$('#tr-' + id).show();
});
});
和在css中:
.hidden{display:none;}
下面是一个硬编码的例子(除了糟糕的样式):
http://jsfiddle.net/4qbFQ/我看不出你在哪里提供了你的按钮的代码,但你可以简单地输入:
onclick="$('#extra_info_div_id').toggle();"
按钮代码
我是这样做的。
<script type="text/javascript">
$(document).ready(function(){
$('#trid').hide();
$('#expand').click(function(){
$('#trid').show();
});
});
</script>
...
<td><a class="btn btn-info" id="expand" href="javascript:;">Expand</a></td>