Develop Reference

How to change each html table row accordian

I want to create a dynamic table which gets its all its entries coming from database. I know how to make a simple table accordian by this Twitter Bootstrap Use collapse.js on table cells [Almost Done] .
If I apply that technique it turns table rows into accordian but no matter which row i click it only expands first row.
Here is the code of my table getting data from database.
<div class="container">
<h2>All the Suggestions of HR</h2>
<div class="table-responsive">
<table id="myTable" width="100%" class="table table-striped display responsive nowrap table-hover">
<thead>
<tr>
<th scope="col">Status</th>
<th scope="col">Date</th>
<th scope="col">Time</th>
<th scope="col">Subject</th>
<th scope="col">Message</th>
<th scope="col">department</th>
<th scope="col">Actions</th>
</tr>
</thead>
<tbody>
<?php
$sql = "SELECT * FROM hr;";
$result = mysqli_query($conn , $sql);
$nr = mysqli_num_rows($result);
while($row = mysqli_fetch_assoc($result)) :
$id = $row['hr_id'];
?>
<tr>
<?php $timestamp = $row['timeSent'];
$date = date('d-m-Y',strtotime($timestamp));
$time = date('H:i:s',strtotime($timestamp));
$status = $row['isAnswered'];
?>
<td><?php if ($status == 'true') {
echo "Answerd";
}
else{
echo "Pending";
} ?></td>
<td><?php echo $date;?></td>
<td><?php echo $time;?></td>
<td><?php echo $row['subject'];?></td>
<td><?php echo $row['message'];?></td>
<td><?php
$cat = $row['category_id'];
if($cat == 1){
echo "Suggestion";
}
elseif ($cat == 2) {
echo "Claim";
}
else{
echo "Help";
}?></td>
</tr>
<?php endwhile; ?>
</tbody>
</table>
</div>
Whenever a row is clicked there is a content i want to show which is different for every row.

<?php
while($row = mysqli_fetch_assoc($result)) :
$id = $row['hr_id'];
?>
<tr data-toggle="collapse" data-target="#accordian_<?php echo $id; ?>" class="accordion-toggle">
<?php $timestamp = $row['timeSent'];
$date = date('d-m-Y',strtotime($timestamp));
$time = date('H:i:s',strtotime($timestamp));
$status = $row['isAnswered'];
?>
<td><?php echo $status == 'true' ? 'Answerd' : 'Pending'; ?></td>
<td><?php echo $date;?></td>
<td><?php echo $time;?></td>
<td><?php echo $row['subject'];?></td>
<td><?php echo $row['message'];?></td>
<td><?php
$cat = $row['category_id'];
if($cat == 1){
echo "Suggestion";
}
elseif ($cat == 2) {
echo "Claim";
}
else{
echo "Help";
}?></td>
</tr>
<tr >
<td colspan="6" class="hiddenRow">
<div class="accordian-body collapse" id="accordian_<?php echo $id; ?>"> Your Text here</div>
</td>
</tr>
<?php endwhile; ?>

PHP - Cart is not loading on the page

I have a website with a cart, the index file is as below:
<?php
session_start();
include_once 'product-action.php';
include_once 'cart.php';
$stmt = $conn->prepare("SELECT * FROM entertainment ORDER BY id ASC");
$stmt->execute();
$entertainment = $stmt->get_result();
echo '<table style="border: 1px solid #ddd;"><tr>';
if (!empty($entertainment)) {
foreach($entertainment as $product){
?>
<td style="border: 1px solid #ddd;">
<form method="post" action=""Location: " . "http://" . $_SERVER['HTTP_HOST'] . $location?action=add&id=<?php echo $product['id']; ?>">
<div class="product-image"><img src="<?php echo $product['image']; ?>" width="200" height="200"></div>
<div><strong><?php echo $product["title"]; ?></strong></div>
<div class="product-price"><?php echo "$".$product["offer_price"]; ?></div>
<div><input type="text" name="quantity" value="1" size="2" /><input type="submit" value="Add to cart" /></div>
</form>
</td>
<?php
}
}
echo '</tr></table>';
?>
The other 2 pages are as follows:
cart.php
<?php
if(!empty($_SESSION["cart_item"])){
$item_total = 0;
?>
<input type="button" value="Empty Cart">
<table cellpadding="10" cellspacing="1">
<tbody>
<tr>
<th><strong>Name</strong></th>
<th><strong>Quantity</strong></th>
<th><strong>Price</strong></th>
<th><strong>Action</strong></th>
</tr>
<?php
foreach ($_SESSION["cart_item"] as $item){
?>
<tr>
<td><strong><?php echo $item["product_title"]; ?></strong></td>
<td><?php echo $item["quantity"]; ?></td>
<td><?php echo "$".$item["price"]; ?></td>
<td>Remove Item</td>
</tr>
<?php
$item_total += ($item["price"]*$item["quantity"]);
}
?>
<tr>
<td colspan="3" align=right><strong>Total:</strong> <?php echo "$".$item_total; ?></td>
</tr>
</tbody>
</table>
<?php
}
?>
<?php
if(!empty($_SESSION["cart_item"])){
$item_total = 0;
?>
<input type="button" value="Empty Cart">
<table cellpadding="10" cellspacing="1">
<tbody>
<tr>
<th><strong>Name</strong></th>
<th><strong>Quantity</strong></th>
<th><strong>Price</strong></th>
<th><strong>Action</strong></th>
</tr>
<?php
foreach ($_SESSION["cart_item"] as $item){
?>
<tr>
<td><strong><?php echo $item["title"]; ?></strong></td>
<td><?php echo $item["quantity"]; ?></td>
<td><?php echo "$".$item["offer_price"]; ?></td>
<td>Remove Item</td>
</tr>
<?php
$item_total += ($item["offer_price"]*$item["quantity"]);
}
?>
<tr>
<td colspan="3" align=right><strong>Total:</strong> <?php echo "$".$item_total; ?></td>
</tr>
</tbody>
</table>
<?php
}
The product_action.php
<?php
if(!empty($_GET["action"])) {
$productId = isset($_GET['id']) ? htmlspecialchars($_GET['id']) : '';
$quantity = isset($_POST['quantity']) ? htmlspecialchars($_POST['quantity']) : '';
switch($_GET["action"]) {
case "add":
if(!empty($quantity)) {
$stmt = $conn->prepare("SELECT * FROM entertainment where id= ?");
$stmt->bind_param('i',$productId);
$stmt->execute();
$productDetails = $stmt->get_result()->fetch_object();
$itemArray = array($productDetails->id=>array('product_title'=>$productDetails->title, 'id'=>$productDetails->id, 'quantity'=>$quantity, 'price'=>$productDetails->offer_price));
if(!empty($_SESSION["cart_item"])) {
if(in_array($productDetails->id,array_keys($_SESSION["cart_item"]))) {
foreach($_SESSION["cart_item"] as $k => $v) {
if($productDetails->id == $k) {
if(empty($_SESSION["cart_item"][$k]["quantity"])) {
$_SESSION["cart_item"][$k]["quantity"] = 0;
}
$_SESSION["cart_item"][$k]["quantity"] += $quantity;
}
}
} else {
$_SESSION["cart_item"] = $_SESSION["cart_item"] + $itemArray;
}
} else {
$_SESSION["cart_item"] = $itemArray;
}
}
break;
case "remove":
if(!empty($_SESSION["cart_item"])) {
foreach($_SESSION["cart_item"] as $k => $v) {
if($productId == $v['id'])
unset($_SESSION["cart_item"][$k]);
}
}
break;
case "empty":
unset($_SESSION["cart_item"]);
break;
}
}
I am completely new to PHP. I tried searching alot but didn't find what I wanted. now the problem is while loading the page, the page is not displaying, its still loading. can anyone tell me how to fix it. any help would be great.

how to output specific information in a modal from a database

I am trying to display more information about the user in my table. The goal is to see more information about the user in a modal, than you can see in the table overview. Unfortunately, I don't manage to display only the information of the respective user in the modal. I already have the following code which doesn't work like i want. At the moment, the modal stays emtpy.
Greetings
admin.php
<?php
include('connection.php');
if( !empty($_POST) ){
foreach( $_POST as $key_post => $value_post ){
if (preg_match('/delete_/i',$key_post) ) {
$id_to_delete = (integer) str_replace('delete_','', $key_post);
$deleteQuery = "DELETE FROM card WHERE id = " . $id_to_delete;
$statement = $pdo->prepare($deleteQuery);
$statement->execute();
}
}
}
include('read.php');
if( !empty($_POST) ){
foreach( $_POST as $key_post => $value_post ){
if (preg_match('/viewDetail_/i',$key_post) ) {
$id_to_view = (integer) str_replace('viewDetail_','', $key_post);
$viewQuery = "SELECT * FROM card WHERE id = " . $id_to_view;
$statement = $pdo->prepare($viewQuery);
$statement->execute();
$viewResult = $statement->fetchAll();
}
}
}
?>
<form action="admin.php" method="post">
<div class="table-wrapper">
<div class="table-scroll">
<table id="myTable">
<tr>
<th>ID</th>
<th>Kartentyp</th>
<th>Absender</th>
<th>Empfänger</th>
<th>Sendedatum</th>
<th id="smallCol">Verschickt</th>
<th id="smallCol">Bestätigung</th>
<th>Edit</th>
</tr>
<?php
foreach ($result as $row) {
if ($row['Dispatched'] == 0) {
$dispatched = 'Pending';
} else {
$dispatched = 'Versendet';
}
?>
<tr class="Alle <?php echo $row['Category']; ?> <?php echo $row['Dispatched']; ?>">
<td><?php echo $row['ID']; ?></td>
<td><?php echo $row['Category']; ?></td>
<td><?php echo $row['Sender']; ?></td>
<td><?php echo $row['Receiver']; ?></td>
<td><?php echo $row['SendDate']; ?></td>
<td><?php echo $dispatched; ?></td>
<td>Placeholder</td>
<td>
<input type="submit" name="delete_<?php echo $row['ID']; ?>" value="delete" >
<input type="submit" name="viewDetail_<?php echo $row['ID']; ?>" value="modal" data-target="modal1" class="modal-trigger">
</td>
</tr>
<?php
}
?>
</table>
</div>
</div>
</form>
<br>
<div class="row">
<button class="btn waves-effect waves-light" type="submit" name="action">Absenden
<i class="material-icons right">send</i>
</button>
</div>
<div id="modal1" class="modal">
<div class="modal-content">
<h4>Modal Header</h4>
<div class="table-wrapper">
<div class="table-scroll">
<table id="myTable">
<tr>
<th>ID</th>
<th>Kartentyp</th>
<th>Absender</th>
<th>Empfänger</th>
<th>Sendedatum</th>
<th id="smallCol">Verschickt</th>
<th id="smallCol">Bestätigung</th>
</tr>
<?php
foreach ($viewResult as $row){ ?>
<tr>
<td><?php echo $row['ID']; ?></td>
<td><?php echo $row['Category']; ?></td>
<td><?php echo $row['Sender']; ?></td>
<td><?php echo $row['Receiver']; ?></td>
<td><?php echo $row['SendDate']; ?></td>
<td><?php echo $dispatched; ?></td>
<td>Placeholder</td>
</tr>
<?php
}
?>
</table>
</div>
</div>
</div>
<div class="modal-footer">
Zurück
</div>
</div>
read.php
<?php
include('connection.php');
$statement = $pdo->prepare("SELECT * FROM card ORDER BY ID ASC");
$statement->execute();
$result = $statement->fetchAll();
if ($statement->rowCount() > 0) {
foreach ($statement->fetchAll() as $row) {
$id = $row['ID'];
$imagePath = $row["ImagePath"];
$sender = $row["Sender"];
$senderEmail = $row["SenderEmail"];
$receiver = $row["Receiver"];
$receiverEmail = $row["ReceiverEmail"];
$subject = $row["Subject"];
$text = $row["Text"];
$sendDate = $row["SendDate"];
$dispatched = $row["Dispatched"];
$category = $row['Category'];
}
}
?>

How to hide the value in table and anchor tag when user click the anchor return

I want to hide the row when the admin click the anchor return because It's already saved in return.php so just need hide the returned status while the pending is not. Thank you for helping me
<thead>
<tr>
<th>Book title</th>
<th>Borrower</th>
<th>Type</th>
<th>Date Borrow</th>
<th>Due Date</th>
<th>Date Returned</th>
<th>Fines</th>
<th>Borrow Status</th>
</tr>
</thead>
<tbody>
<?php $user_query=mysqli_query($dbcon,"select * from borrow
LEFT JOIN member ON borrow.member_id = member.member_id
LEFT JOIN borrowdetails ON borrow.borrow_id = borrowdetails.borrow_id
LEFT JOIN book on borrowdetails.book_id = book.book_id
ORDER BY borrow.borrow_id DESC
")or die(mysqli_error());
while($row=mysqli_fetch_array($user_query)){
$currentdate = date('Y/m/d');
$start = new DateTime($returndate=$row['due_date']);
$end = new DateTime($currentdate);
$fines =0;
if(strtotime($currentdate) > strtotime($returndate)){
$days= $start->diff($end, true)->days;
$fines = $days > 0 ? intval(floor($days)) * 10 : 0;
$fi = $row['borrow_details_id'];
mysqli_query($dbcon,"update borrowdetails set fines='$fines' where borrow_details_id = '$fi'");
}
$id=$row['borrow_id'];
$book_id=$row['book_id'];
$borrow_details_id=$row['borrow_details_id'];
?>
<tr class="del<?php echo $id ?>">
<td><?php echo $row['book_title']; ?></td>
<td><?php echo $row['firstname']." ".$row['lastname']; ?></td>
<td><?php echo $row['type']; ?></td>
<td><?php echo $row['date_borrow']; ?></td>
<td><?php echo $row['due_date']; ?> </td>
<td><?php echo $row['date_return']; ?> </td>
<td><?php echo "₱ ".$fines; ?></td>
<td><?php echo $row['borrow_status'];?></td>
<td> <a rel="tooltip" title="Return" id="<?php echo $borrow_details_id; ?>"
href="#delete_book<?php echo $borrow_details_id; ?>" data-toggle="modal"
class="btn btn-success"><i class="icon-check icon-large"></i>Return</a>
<?php include('modal_return.php'); ?>
<td></td>
</tr>
<?php } ?>
</tbody>
</table>
This is the view_return.php where will admin see the all books pending
This is the history/transaction where the book is already return

For this , you can do like below example, Add a class "test" in anchorTag or in td
and by using jquery
$('.test').click(function(){
$(this).parent().hide();
});
<table>
<tr>
<td>Test</td>
<td class="test" id="returnId1">Return</td>
</tr>
<tr>
<td>Test2</td>
<td class="test" id="returnId2">Return</td>
</tr>
</table>

ChartJS is not displayed properly

I have a problem when using ChartJS for displaying data. My data can displayed correctly but when using ChartJS it is not displayed properly.
I need help for this. and this is my code below.
screenshot page when use this code
?>
<div class="contentDesc">
<div class="container-fluid">
<div class="row">
<div class="col-lg-8 s-dashboard">
<div class="panel panel-info">
<div class="panel-heading">
<h2 class="panel-title"><?php echo __('Status Ketersediaan Ijazah') ?></h2>
</div>
<div class="panel-body">
<div class="s-chart">
<canvas id="line-chartjs" width="175" height="315"></canvas>
</div>
</div>
<div class="panel-footer">
<table class="table">
<tr>
<td class="text-left"><i class="fa fa-square" style="color:#99FF33;"></i> <?php echo __('Ijazah Ada') ?></td>
<td class="text-right"><?php echo $get_total_ijazahada?></td>
</tr>
<tr>
<td class="text-left"><i class="fa fa-square" style="color:#337AB7;"></i> <?php echo __('Ijazah Sudah Dikembalikan') ?></td>
<td class="text-right"><?php echo $get_total_ijazahkembali?></td>
</tr>
</table>
</div>
</div>
</div>
<div class="col-lg-4 s-dashboard">
<div class="panel panel-default s-dashboard">
<div class="panel-heading">
<h2 class="panel-title"><?php echo __('Status Karyawan') ?></h2>
</div>
<div class="panel-body">
<div class="s-chart">
<canvas id="radar-chartjs" width="175" height="175"></canvas>
</div>
</div>
<div class="panel-footer">
<table class="table">
<tr>
<td class="text-left"><i class="fa fa-square" style="color:#f2f2f2;"></i> <?php echo __('Total Data Ijazah') ?></td>
<td class="text-right"><?php echo $get_total_ijazah?></td>
</tr>
<tr>
<td class="text-left"><i class="fa fa-square" style="color:#99FF33;"></i> <?php echo __('Karyawan Aktif') ?></td>
<td class="text-right"><?php echo $get_total_aktif?></td>
</tr>
<tr>
<td class="text-left"><i class="fa fa-square" style="color:#337AB7;"></i> <?php echo __('Karyawan Kontrak') ?></td>
<td class="text-right"><?php echo $get_total_kontrak?></td>
</tr>
<tr>
<td class="text-left"><i class="fa fa-square" style="color:#FF9F40;"></i> <?php echo __('Karyawan Harian') ?></td>
<td class="text-right"><?php echo $get_total_harian?></td>
</tr>
<tr>
<td class="text-left"><i class="fa fa-square" style="color:#FF6384;"></i> <?php echo __('Karyawan Resign') ?></td>
<td class="text-right"><?php echo $get_total_resign?></td>
</tr>
<tr>
<td class="text-left"><i class="fa fa-square" style="color:#C9CBCF;"></i> <?php echo __('Pelamar Batal Join') ?></td>
<td class="text-right"><?php echo $get_total_bataljoin?></td>
</tr>
<tr>
<td class="text-left"><i class="fa fa-square" style="color:#D9534F;"></i> <?php echo __('Pelamar Tidak Ada Kabar') ?></td>
<td class="text-right"><?php echo $get_total_tidakada?></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="clearfix"></div>
</div>
</div>
<script src="<?php echo JWB?>chartjs/Chart.min.js"></script>
<script>
$(function(){
var lineChartData = {
labels : [<?php echo $get_date?>],
datasets :
[
{
fillColor : "#99FF33",
data : [<?php echo $get_total_ijazahada?>]
},
{
fillColor : "#5D45BD",
data : [<?php echo $get_total_ijazahkembali?>]
}
]
}
var c = $('#line-chartjs');
var container = $(c).parent();
var ct = c.get(0).getContext("2d");
$(window).resize( respondCanvas );
function respondCanvas(){
c.attr('width', $(container).width() ); //max width
c.attr('height', $(container).height() ); //max height
//Call a function to redraw other content (texts, images etc)
var myChart = new Chart(ct).Bar(lineChartData,{
barShowStroke: true,
barDatasetSpacing : 2,
animation: false
});
}
respondCanvas();
var data = [
{
value : <?php echo $get_total_aktif?>,
color : "#99FF33",
label : "<?php echo __('Aktif'); ?>"
},
{
value : <?php echo $get_total_kontrak?>,
color : "#337AB7",
label : "<?php echo __('Kontrak'); ?>"
},
{
value : <?php echo $get_total_harian?>,
color : "#FF9F40",
label : "<?php echo __('Harian'); ?>"
},
{
value : <?php echo $get_total_resign?>,
color : "#FF6384",
label : "<?php echo __('Resign'); ?>"
},
{
value : <?php echo $get_total_bataljoin?>,
color : "#C9CBCF",
label : "<?php echo __('Batal Join'); ?>"
},
{
value : <?php echo $get_total_tidakada?>,
color : "#D9534F",
label : "<?php echo __('Tidak Ada Kabar'); ?>"
}
];
var r = $('#radar-chartjs');
var container = $(r).parent();
var rt = r.get(0).getContext("2d");
$(window).resize( respondCanvas );
function respondCanvasRadar(){
r.attr('width', $(container).width()); //max width
r.attr('height', $(container).height()); //max height
//Call a function to redraw other content (texts, images etc)
var myChart = new Chart(rt).Doughnut(data,{
animation: false,
segmentStrokeWidth : 1
});
}
respondCanvasRadar();
});
</script>