我的表格有 2 列,personID
和 Name
.第一列是隐藏的。我还添加了一个隐藏的输入字段。我这样做是因为每当我刷新页面时,我都能在一瞬间看到它的值。
我其实用的是datatable。如果单击表体,我想显示 personID。我的问题是我无法显示 personID。
<div class="row table-responsive">
<table class="table table-bordered table-striped table-condensed" id="table_data">
<thead class="header">
<tr class="well">
<th></th>
<th>Person Name</th>
</tr>
</thead>
<tbody>
<?php if($result != NULL){?>
<?php foreach($result as $row){ ?>
<tr>
<td> <input type="hidden" name="personID" id="personID" value="<?php echo $row->personID;?>" />
</td>
<td ><?php echo $row->lname.", ".$row->fname." ".$row->mname;?></td>
<?php }}?>
</tbody>
</table><!-- END Table-->
</div><!-- END table-responsive-->
JavaScript 代码:
var table = $('#table_data').DataTable({
"bLengthChange": false,
"columnDefs": [
{
"targets": [ 0],
"visible": false,
"searchable": false
}
]
});
$('#table_data tbody').on( 'click', 'tr', function () {
if ( $(this).hasClass('active') ) {
$(this).removeClass('active');
}
else {
$(this).addClass('active');
var d = $('input[type=hidden]', $(this).find("td:first")).val();
alert(d);
}
} );
我已经尝试过以下方法:
我在这里得到了一个未定义的结果:
var d = $(this).parent('td').find('input[type="hidden"]').val();
var d = $('input[type=hidden]', $(this).find("td:first")).val();
警报没有出现在这里:
var d=document.getElementById('personID').value;
它给了我这个结果,<input name="personID" id="personID" value="19" type="hidden">
,当我尝试这个时:
var d= $(this).parents('tr').find('input[type="hidden"]').val();
请帮帮我..
最佳答案
要准确地看出哪里出了问题有点困难。有时您指的是代码片段中名称为“personID”的隐藏输入,有时是“guestID”。如果您的实际代码中存在这种差异,显然会导致问题。
如果您确定呈现的 HTML 符合您的预期(使用 personID 作为隐藏输入的名称),那么以下应该有效:
$('#table_data tbody').on('click', 'tr', function () {
var $tr = $(this);
if ($tr.hasClass('active')) {
$tr.removeClass('active');
} else {
$tr.addClass('active');
// Use the input's name to find it within the <tr>
var d = $tr.find('input[name=personID]').val();
alert(d);
}
});
示例:JSFiddle
那么,只为隐藏的输入设置一个完整的表格列似乎有点过分了。您可以简单地将隐藏的输入与人名放在同一列中 - 或者甚至将其存储为 data attribute在表格行本身。此外,在您的 PHP 循环中,您为所有隐藏输入提供了相同的“personID”ID,这在技术上是不正确的 - HTML 文档中的所有 ID 值都应该是唯一的。
关于javascript - 在数据表的隐藏列中获取 input[type=hidden] 的值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28916875/