手风琴 table 一个 js
Accordion table an js
我有这段代码可以让我从 sql 数据库中获取数据。
代码Table:
<table id="id_tabella" class="fold-table" align="center">
<thead>
<tr>
<th style="">Id</th>
<th>OrderCode</th>
<th>Partner</th>
<th>NrProdotti</th>
<th>Totale</th>
<th>Stato</th>
</tr>
</thead>
<tbody>
<?php
while( $result = sqlsrv_fetch_array($run_query,SQLSRV_FETCH_ASSOC))
{
if($result) {
?>
<tr id="<?php echo $result['Id']; ?>" class="view">
<td style=""><?php echo $result['Id']; ?></td>
<td><?php echo $result['OrderCode']; ?></td>
<td><img align="middle" src="<?php echo $result['Img']?>" width="10%"></td>
<td><?php echo $result['NrProdotti']; ?></td>
<td><?php echo $result['TotaleOrdine']; ?></td>
<td>
<form method="POST" action="">
<input name = "idOrdine" value="<?php echo $result['Id'] ?>" type="submit">
</form>
</td>
</tr>
<tr class="fold">
<td colspan="6">
<div class="fold-content">
<h3>DETTAGLIO ORDINE</h3>
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
<table>
<thead>
<tr>
<th>Dettaglio Ordine:</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<?php
$data = json_decode($result['JsonOrdine'], true);
foreach($data['products'] as $key=>$val){
echo '<b>'.$val['name'].' * '.$val['quantity'].'</b><br>';
foreach($val['attributes'] as $keys=>$value){
echo $value['name'].' * '.$value['quantity'].'<br>';
}
}
?>
</td>
</tr>
</tbody>
</table>
</div>
</td>
</tr><?php } } sqlsrv_free_stmt($run_query);?>
</tbody>
我无法获取页面底部的 js 脚本以使用代码:
alert(ultimo);
代码JS:
<script>
$(document).ready(function(){
setInterval(newNoti, 5000);
function newNoti(){
//var ultimo = $('#id_tabella tr').last().attr("Id");
var ultimo = $('#id_tabella tr').last().attr("Id");
alert(ultimo);
$.ajax({
type: "post",
url: "o_accoda.php",
data: {'last_id': ultimo},
success:function(resp){
if(resp != ""){
$("#audio")[0].play();
$('#c_id_tabella').append(resp);
var rowCount = $('#c_id_tabella').find('tr').length-1;
//$("#id_tabella").append(resp);
//var rowCount = $('#id_tabella').find('tr').length-1;
$('#demo').html("ORDINI IN ARRIVO: " + rowCount);
}
},
error:function(){
alert('Some problem occured, please try again.');
}
})
}
});
</script>
它 returns 我“未定义”
我已经将你 PHP 转换为 HTML 只是为了测试。
检查此代码段。我已经选择了红色行。
但必须找到正确的行:
$('#id_tabella tr.view').last()
var lastRow = $('#id_tabella tr').last();
lastRow.css('background','red'); // TEST which row we found
var ultimo = lastRow.attr("Id");
console.log(ultimo);
// Now make a correction
lastRow = $('#id_tabella tr.view').last();
ultimo = lastRow.attr("Id");
console.log(ultimo); // Now Good!
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="id_tabella" class="fold-table" align="center" style="margin-bottom:40px">
<thead>
<tr>
<th style="">Id</th>
<th>OrderCode</th>
<th>Partner</th>
<th>NrProdotti</th>
<th>Totale</th>
<th>Stato</th>
</tr>
</thead>
<tbody>
<tr id="id1" class="view">
<td style="">id1</td>
<td>OrderCode</td>
<td><img align="middle" src="#" width="10%"></td>
<td>NrProdotti</td>
<td>TotaleOrdine</td>
<td>
<form method="POST" action="">
<input name="idOrdine" value="id1" type="submit">
</form>
</td>
</tr>
<tr class="fold">
<td colspan="6">
<div class="fold-content">
<h3>DETTAGLIO ORDINE</h3>
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
<table>
<thead>
<tr>
<th>Dettaglio Ordine:</th>
</tr>
</thead>
<tbody>
<tr>
<td>XXX
</td>
</tr>
</tbody>
</table>
</div>
</td>
</tr>
</tbody>
所以在您的代码中,您发现“最后”行实际上是这一行:
<td>
<?php
$data = json_decode($result['JsonOrdine'], true);
foreach($data['products'] as $key=>$val){
echo '<b>'.$val['name'].' * '.$val['quantity'].'</b><br>';
foreach($val['attributes'] as $keys=>$value){
echo $value['name'].' * '.$value['quantity'].'<br>';
}
}
?>
</td>
因此请尝试将您的搜索更改为:
var ultimo = $('#id_tabella tr.view').last().attr("Id");
我有这段代码可以让我从 sql 数据库中获取数据。
代码Table:
<table id="id_tabella" class="fold-table" align="center">
<thead>
<tr>
<th style="">Id</th>
<th>OrderCode</th>
<th>Partner</th>
<th>NrProdotti</th>
<th>Totale</th>
<th>Stato</th>
</tr>
</thead>
<tbody>
<?php
while( $result = sqlsrv_fetch_array($run_query,SQLSRV_FETCH_ASSOC))
{
if($result) {
?>
<tr id="<?php echo $result['Id']; ?>" class="view">
<td style=""><?php echo $result['Id']; ?></td>
<td><?php echo $result['OrderCode']; ?></td>
<td><img align="middle" src="<?php echo $result['Img']?>" width="10%"></td>
<td><?php echo $result['NrProdotti']; ?></td>
<td><?php echo $result['TotaleOrdine']; ?></td>
<td>
<form method="POST" action="">
<input name = "idOrdine" value="<?php echo $result['Id'] ?>" type="submit">
</form>
</td>
</tr>
<tr class="fold">
<td colspan="6">
<div class="fold-content">
<h3>DETTAGLIO ORDINE</h3>
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
<table>
<thead>
<tr>
<th>Dettaglio Ordine:</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<?php
$data = json_decode($result['JsonOrdine'], true);
foreach($data['products'] as $key=>$val){
echo '<b>'.$val['name'].' * '.$val['quantity'].'</b><br>';
foreach($val['attributes'] as $keys=>$value){
echo $value['name'].' * '.$value['quantity'].'<br>';
}
}
?>
</td>
</tr>
</tbody>
</table>
</div>
</td>
</tr><?php } } sqlsrv_free_stmt($run_query);?>
</tbody>
我无法获取页面底部的 js 脚本以使用代码:
alert(ultimo);
代码JS:
<script>
$(document).ready(function(){
setInterval(newNoti, 5000);
function newNoti(){
//var ultimo = $('#id_tabella tr').last().attr("Id");
var ultimo = $('#id_tabella tr').last().attr("Id");
alert(ultimo);
$.ajax({
type: "post",
url: "o_accoda.php",
data: {'last_id': ultimo},
success:function(resp){
if(resp != ""){
$("#audio")[0].play();
$('#c_id_tabella').append(resp);
var rowCount = $('#c_id_tabella').find('tr').length-1;
//$("#id_tabella").append(resp);
//var rowCount = $('#id_tabella').find('tr').length-1;
$('#demo').html("ORDINI IN ARRIVO: " + rowCount);
}
},
error:function(){
alert('Some problem occured, please try again.');
}
})
}
});
</script>
它 returns 我“未定义”
我已经将你 PHP 转换为 HTML 只是为了测试。
检查此代码段。我已经选择了红色行。
但必须找到正确的行:
$('#id_tabella tr.view').last()
var lastRow = $('#id_tabella tr').last();
lastRow.css('background','red'); // TEST which row we found
var ultimo = lastRow.attr("Id");
console.log(ultimo);
// Now make a correction
lastRow = $('#id_tabella tr.view').last();
ultimo = lastRow.attr("Id");
console.log(ultimo); // Now Good!
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="id_tabella" class="fold-table" align="center" style="margin-bottom:40px">
<thead>
<tr>
<th style="">Id</th>
<th>OrderCode</th>
<th>Partner</th>
<th>NrProdotti</th>
<th>Totale</th>
<th>Stato</th>
</tr>
</thead>
<tbody>
<tr id="id1" class="view">
<td style="">id1</td>
<td>OrderCode</td>
<td><img align="middle" src="#" width="10%"></td>
<td>NrProdotti</td>
<td>TotaleOrdine</td>
<td>
<form method="POST" action="">
<input name="idOrdine" value="id1" type="submit">
</form>
</td>
</tr>
<tr class="fold">
<td colspan="6">
<div class="fold-content">
<h3>DETTAGLIO ORDINE</h3>
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
<table>
<thead>
<tr>
<th>Dettaglio Ordine:</th>
</tr>
</thead>
<tbody>
<tr>
<td>XXX
</td>
</tr>
</tbody>
</table>
</div>
</td>
</tr>
</tbody>
所以在您的代码中,您发现“最后”行实际上是这一行:
<td>
<?php
$data = json_decode($result['JsonOrdine'], true);
foreach($data['products'] as $key=>$val){
echo '<b>'.$val['name'].' * '.$val['quantity'].'</b><br>';
foreach($val['attributes'] as $keys=>$value){
echo $value['name'].' * '.$value['quantity'].'<br>';
}
}
?>
</td>
因此请尝试将您的搜索更改为:
var ultimo = $('#id_tabella tr.view').last().attr("Id");