<div class="col-md-6 hidden-xm hidden-sm">
<div class="col-md-12 hidden-xm"><h3>ההזמנה שלך</h3></div>
<div class="col-md-12 hidden-xm">
<div class="table-responsive hidden-xm">
<table class="table table-default">
<thead>
<tr>
<th class="text-right">סה"כ</th>
<th class="text-right">מוצר</th>
</tr>
</thead>
<tbody>
<?php
$totalPrice = 0;
$arr = [];
foreach($_SESSION['cart'] as $product){
$productDetails = get_product($product['id']);
array_push($arr,$product['amount']." x".$productDetails->get_name());
$totalPrice+= $productDetails->get_price()*$product['amount'];
?>
<tr>
<td class="text-right"> <?php echo $productDetails->get_price()*$product['amount']; ?>$</td>
<td class="text-right"><?php echo $productDetails->get_name()." <b>".$product['amount']."x</b>"; ?></td>
</tr>
<?php };?>
<tr>
<td class="total_price">משלוח</td>
<td>9$</td>
</tr>
<tr>
<td class="text-right total_price">סה"כ</td>
<td class="text-right"> <?php echo $totalPrice+9 ?>$</td>
</tr>
</tbody>
</table>
</div>
<div class="col-md-12 hidden-xm text-right"> אחריות מלאה על המוצרים ל-28 יום</div>
<input type="hidden" name="products" value="<?php echo implode("<br>",$arr) ?>">
<div class="text-left">
<input type="submit" name="submit" class="btn btn-lg btn-pay" value="שליחת הזמנה">
</div>
</div>
</div>
I've tried for pretty long time to find out why the : hidden-xm/hidden-sm not working for me. Can someone tell me what am i doing wrong?
also I want to notice that this div is inside a bigger container but I want to hide it if its at a mobile point of view.
I'ts hidden-xs instead of hidden-xm
Related
I have a table like this:
<table class="table">
<thead>
<tr>
<th scope="col">ID</th>
<th scope="col">Usernames</th>
<th scope="col">number</th>
<th scope="col">Type</th>
<th scope="col">Date</th>
<th scope="col"></th>
</tr>
</thead>
<tbody>
<?php
foreach($projects as $project)
{
echo '<tr>';
echo '<th>'.$project['id'].'</th>';
echo '<td>'.$project['user'].'</td>';
echo '<td>'.$project['number'].'</td>';
echo '<td>'.$project['user_type'].'</td>';
echo '<td>'.$project['logs'].'</td>';
echo '<td>View</td>';
echo '</tr>';
}
?>
</tbody>
</table>
I am trying to render the details of the table above on another div (shown below) in the same page but on another window view pane using the 'View' button.
<div class="row my-4">
<div class="col-12 col-md-6 col-lg-3 mb-4 mb-lg-0">
<div class="card">
<h5 class="card-header">Customers</h5>
<div class="card-body" id="more-info">
<h5 class="card-title">
<?php echo $post['id']; ?>
</h5>
<p class="card-text">
<?php echo $post['user']; ?>
</p>
<p class="card-text text-success">
<?php echo $post['catch_code']; ?>
</p>
</div>
</div>
</div>
The foreach in the first example is been iterated with the "view" button for each element. I need each element to be displayed as I click 'View' on it. I was worried if clicking "view" then all elements will be displayed, being that the iteration is the same as the id on the View button..
Please kindly propose a solution for me.
The issue you have is that you're creating multiple elements with the same id in your loop. This is invalid as id values must be unique within the DOM.
To fix this issue change the id attribute to a class instead. You can then populate the 'View' link with data attributes that hold the information to populate the #more-info div when the button is clicked.
Try this:
let $idField = $('h5.user-id');
let $userField = $('p.user');
let $catchCodeField = $('p.catch-code');
$('.view-files').on('click', e => {
e.preventDefault();
let $btn = $(e.target);
let id = $btn.data('id');
let user = $btn.data('user');
let catchCode = $btn.data('catchcode');
$idField.text(id);
$userField.text(user);
$catchCodeField.text(catchCode);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<table class="table">
<thead>
<tr>
<th scope="col">ID</th>
<th scope="col">Usernames</th>
<th scope="col">number</th>
<th scope="col">Type</th>
<th scope="col">Date</th>
<th scope="col"></th>
</tr>
</thead>
<tbody>
<tr>
<th>001</th>
<td>User 001</td>
<td>Number 001</td>
<td>User type 001</td>
<td>Logs 001</td>
<td>View</td>
</tr>
<tr>
<th>002</th>
<td>User 002</td>
<td>Number 002</td>
<td>User type 002</td>
<td>Logs 002</td>
<td>View</td>
</tr>
<tr>
<th>003</th>
<td>User 003</td>
<td>Number 003</td>
<td>User type 003</td>
<td>Logs 003</td>
<td>View</td>
</tr>
</tbody>
</table>
<div class="row my-4">
<div class="col-12 col-md-6 col-lg-3 mb-4 mb-lg-0">
<div class="card">
<h5 class="card-header">Customers</h5>
<div class="card-body" id="more-info">
<h5 class="card-title user-id"></h5>
<p class="card-text user"></p>
<p class="card-text text-success catch-code"></p>
</div>
</div>
</div>
</div>
I have been trying to dynamically add a new dropdown list form using javascript. I have no idea how I should proceed with it. What I have rightnow is a html form page with a javascript that allows me to add a new row of text input form. html Form
Here is my current code for this page.
<?php
include('session.php');
?>
<?php
$ItemID = "ItemID";
$ItemName = "ItemName";
$UnitPrice = "UnitPrice";
$sql = "SELECT ItemID,ItemName,UnitPrice FROM Item";
$result = $db->query($sql);
$sql2 ="SELECT BranchID,BranchLocation FROM Branch";
$result2 = $db->query($sql2);
$sql4 ="SELECT MemberID FROM Membership";
$result4 = $db->query($sql4);
?>
<html>
<head>
<title>Add Sales</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
</head>
<body>
<div class="text-center">
<h1>Add new Sales Record</h1>
</div>
<div class="container">
<button class="w3-button w3-black w3-round-large">Back</button>
</div>
<div class="container" align="right">
<table class="table-sm">
<tbody>
<tr class="table-primar">
<th scope="col" style="padding-right: 50px;">ItemID</th>
<th scope="col" style="padding-right: 50px">ItemName</th>
<th scope="col">UnitPrice</th>
</tr>
<?php
while($rows = $result->fetch_assoc()) {
?>
<tr class="contents">
<td><?php echo $rows[$ItemID]; ?></td>
<td><?php echo $rows[$ItemName]; ?></td>
<td><?php echo $rows[$UnitPrice]; ?></td>
</tr>
<?php
}
?>
</tbody>
</table>
</div>
<hr>
<div class="container">
<div class="row clearfix">
<div class="col-md-12 column">
<form action="addsales.php" method="post">
<table class="">
<table class="table table-bordered table-hover">
<thead>
<tr >
<th class="text-center">
Branch ID
</th>
<th class="text-center">
MemberID
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<select name="branchid">
<option selected></option>
<?php
while($rows2 = $result2->fetch_assoc()){
?>
<option value="<?php echo $rows2["BranchID"];?>"><?php echo $rows2["BranchLocation"];?></option>
<?php
}
?>
</select>
</td>
<input type="hidden" value="<?php echo $login_session; ?>" name='employeeid' class="form-control"/>
<td>
<select name="memberid">
<option selected></option>
<?php
while($rows4 = $result4->fetch_assoc()){
?>
<option value="<?php echo $rows4["MemberID"];?>"><?php echo $rows4["MemberID"];?></option>
<?php
}
?>
</select>
</td>
</tr>
</tbody>
</table>
<table class="table table-bordered table-hover" id="tab_logic">
<thead>
<tr >
<th class="text-center">
ItemID
</th>
<th class="text-center">
Amount
</th>
</tr>
</thead>
<tbody>
<tr id='addr0'>
<td>
<input type="text" maxlength ="10" name='item[0][itemid]' placeholder='ItemID' class="form-control"/>
</td>
<td>
<input type="number" name='item[0][amount]' placeholder='Amount' class="form-control"/>
</td>
</tr>
<tr id='addr1'></tr>
</tbody>
</table>
<input class="w3-button w3-black w3-round-large" type="submit" name='submit' value="Submit"/>
</form>
<button id="add_row" class="w3-button w3-black w3-round-large" style="position: absolute; right: 20px;">New row</button>
</div>
</div>
</div>
<script type="text/javascript">
$(document).ready(function() {
var i = 1;
$("#add_row").click(function() {
$('#addr' + i).html("<td><input name='item["+i+"][itemid]' placeholder='ItemID' maxlength='10' class='form-control input-md'/></td><td><input type='text' name='item["+i+"][amount]' placeholder='Amount' class='form-control input-md'/></td>");
$('#tab_logic').append('<tr id="addr' + (i + 1) + '"></tr>');
i++;
});
});
</script>
</body>
</html>
I want to change the javascript code so that instead of adding a new text input form, it will add a select form with options from the database. Something similar to this.
<td>
<select name="memberid">
<option selected></option>
<?php
while($rows4 = $result4->fetch_assoc()){
?>
<option value="<?php echo $rows4["MemberID"];?>"><?php echo $rows4["MemberID"];?></option>
<?php
}
?>
</select>
</td>
I am really new to all this php and javascript, so my code may look a bit off. Thank you for your help in advance.
I need to Highlight columns that have different values.
If the value on $b['nama'] and $c['nama'] is not the same i need to highlight the <tr>. I wanted the system admin to easily see which of the field is having different values so the admin can decide to approve user edit request or to reject the request.
<?php
error_reporting(0);
$b = $data->row_array();
$c = $data2->row_array();
?>
<!-- Begin Page Content -->
<div class="container-fluid">
<!-- DataTales Example -->
<div class="card shadow mb-4">
<div class="card-header py-3">
<h6 class="m-0 font-weight-bold text-primary">User requested changes</h6>
</div>
<div class="card-body">
<table id="tabel" class="table table-bordered table-striped" style="width: 75%">
<thead>
<tr>
<th>Variable</th>
<th>Current data</th>
<th>Requested changes</th>
</tr>
</thead>
<tbody>
<tr>
<td>Nama</td>
<td>
<?php echo $b['nama']; ?>
</td>
<td>
<?php echo $c['nama']; ?>
</td>
</tr>
<tr>
<td>NIP Baru</td>
<td>
<?php echo $b['nipBaru']; ?>
</td>
<td>
<?php echo $c['nipBaru']; ?>
</td>
</tr>
<tr>
<td>NIP lama</td>
<td>
<?php echo $b['nipLama']; ?>
</td>
<td>
<?php echo $c['nipLama']; ?>
</td>
</tr>
<tr>
<td>Gelar depan</td>
<td>
<?php echo $b['gelarDepan']; ?>
</td>
<td>
<?php echo $c['gelarDepan']; ?>
</td>
</tr>
<tr>
<td>Gelar belakang</td>
<td>
<?php echo $b['gelarBelakang']; ?>
</td>
<td>
<?php echo $c['gelarBelakang']; ?>
</td>
</tr>
<tr>
<td>Tempat lahir</td>
<td>
<?php echo $b['tempatLahir']; ?>
</td>
<td>
<?php echo $c['tempatLahir']; ?>
</td>
</tr>
</tbody>
</table>
<button type="submit" class="btn btn-primary btn-sm" style="width:10%"><span class="icon-cursor"></span> Approve</button>
<button type="submit" class="btn btn-primary btn-sm" style="width:10%"><span class="icon-cursor"></span> Reject</button>
</div>
</div>
</div>
Check if those two values are different and apply a class to the row
<tr<?php if ($b['nama'] != $c['nama']) { echo ' class="highlight"'; } ?>>
<td>Nama</td>
<td>
<?php echo $b['nama']; ?>
</td>
<td>
<?php echo $c['nama']; ?>
</td>
</tr>
then use CSS to highlight the cells
.highlight td {
background: yellowgreen;
}
try this code
you can change the bgcolor value or you can create css class and inside of if you echo the class='my_class'
<?php
error_reporting(0);
$b = $data->row_array();
$c = $data2->row_array();
?>
<!-- Begin Page Content -->
<div class="container-fluid">
<!-- DataTales Example -->
<div class="card shadow mb-4">
<div class="card-header py-3">
<h6 class="m-0 font-weight-bold text-primary">User requested changes</h6>
</div>
<div class="card-body">
<table id="tabel" class="table table-bordered table-striped" style="width: 75%">
<thead>
<tr>
<th>Variable</th>
<th>Current data</th>
<th>Requested changes</th>
</tr>
</thead>
<tbody>
<tr <?php if ($b['nama'] != $c['nama']){echo "bgcolor='#FF0000'";} ?>>
<td>Nama</td>
<td>
<?php echo $b['nama']; ?>
</td>
<td>
<?php echo $c['nama']; ?>
</td>
</tr>
<tr <?php if ($b['nipBaru'] != $c['nipBaru']){echo "bgcolor='#FF0000'";} ?> >
<td>NIP Baru</td>
<td>
<?php echo $b['nipBaru']; ?>
</td>
<td>
<?php echo $c['nipBaru']; ?>
</td>
</tr>
<tr <?php if ($b['nipBaru'] != $c['nipBaru']){echo "bgcolor='#FF0000'";} ?> >
<td>NIP lama</td>
<td>
<?php echo $b['nipLama']; ?>
</td>
<td>
<?php echo $c['nipLama']; ?>
</td>
</tr>
<tr <?php if ($b['gelarDepan'] != $c['gelarDepan']){echo "bgcolor='#FF0000'";} ?> >
<td>Gelar depan</td>
<td>
<?php echo $b['gelarDepan']; ?>
</td>
<td>
<?php echo $c['gelarDepan']; ?>
</td>
</tr>
<tr <?php if ($b['gelarBelakang'] != $c['gelarBelakang']){echo "bgcolor='#FF0000'";} ?> >
<td>Gelar belakang</td>
<td>
<?php echo $b['gelarBelakang']; ?>
</td>
<td>
<?php echo $c['gelarBelakang']; ?>
</td>
</tr>
<tr <?php if ($b['tempatLahir'] != $c['tempatLahir']){echo "bgcolor='#FF0000'";} ?> >
<td>Tempat lahir</td>
<td>
<?php echo $b['tempatLahir']; ?>
</td>
<td>
<?php echo $c['tempatLahir']; ?>
</td>
</tr>
</tbody>
</table>
<button type="submit" class="btn btn-primary btn-sm" style="width:10%"><span class="icon-cursor"></span> Approve</button>
<button type="submit" class="btn btn-primary btn-sm" style="width:10%"><span class="icon-cursor"></span> Reject</button>
</div>
</div>
</div>
You can define a class named 'same' and 'different'. Then in php check if the values are same and echo the class property based on being same or different.
php
<tr>
<td>Nama</td>
<td class="<?php echo ($b['nama'] == $c['nama'])? 'same': 'different'; ">
<?php echo $b['nama']; ?>
</td>
<td class="<?php echo ($b['nama'] == $c['nama'])? 'same': 'different'; ">
<?php echo $c['nama']; ?>
</td>
</tr>
In Styles
.same{
color:green;
}
.different{
color:red;
}
We have used ternary operator to figure out if the variables are same or not.
https://www.abeautifulsite.net/how-to-use-the-php-ternary-operator
Since you seem to be using Bootstrap, you could just apply an already defined style to the cells to highlight the difference. For instance:
<tr>
<td>Nama</td>
<td class="<?php echo ($b['nama'] == $c['nama'])? 'bg-success': 'bg-danger'; ">
<?php echo $b['nama']; ?>
</td>
<td class="bg-<?php echo ($b['nama'] == $c['nama'])? 'bg-success': 'bg-danger'; ">
<?php echo $c['nama']; ?>
</td>
</tr>
By doing this, if $b['nama'] and $c['nama'] are different, the cells would have an near-red background and if they are equal, they'd have a near-green background. If you'd like to only highlight differences (in order to make the screen less overwhelming, just replace the 'bg-success' with '' so the equal cells don't get styled
I am attempting to implement the TableSort: http://tablesorter.com, then later I will be implementing the pagination.
However, nothing is appearing to happen after implementation. I follwed the steps on the tablesorter webpage.
Any suggestions?
<!DOCTYPE html>
<html>
<head>
<script src="/libs/js/jquery-3.1.1.js" type="text/javascript">
</script>
<script src="/libs/js/jquery-3.1.1.min.js" type="text/javascript">
</script>
<script src="/libs/js/jquery.tablesorter.js" type="text/javascript">
</script>
<script src="/libs/js/jquery.tablesorter.pager.js" type="text/javascript">
</script>
<script type="text/javascript">
$(document).ready(function()
{
$("#myTable").tablesorter();
}
);
</script>
<title></title>
</head>
<body>
<?php
$page_title = 'All Product';
require_once('includes/load.php');
// Checkin What level user has permission to view this page
page_require_level(2);
$products = join_product_table();
?><?php include_once('layouts/header.php'); ?>
<div class="row">
<div class="col-md-12">
<?php echo display_msg($msg); ?>
</div>
<div class="col-md-12">
<div class="panel panel-default">
<div class="panel-heading clearfix">
<div class="pull-right">
<a class="btn btn-primary" href="add_product.php">Add New</a>
</div>
</div>
<div class="panel-body">
<table class="table table-bordered" id="myTable">
<thead>
<tr>
<th class="text-center" style="width: 50px;">#</th>
<th>Photo</th>
<th>Product Title</th>
<th class="text-center" style="width: 10%;">Category</th>
<th class="text-center" style="width: 10%;">Instock</th><!--<th class="text-center" style="width: 10%;"> Buying Price </th>
<th class="text-center" style="width: 10%;"> Saleing Price </th>-->
<th class="text-center" style="width: 10%;">Product Added</th>
<th class="text-center" style="width: 100px;">Actions</th>
</tr>
</thead>
<tbody>
<?php foreach ($products as $product):?>
<tr>
<td class="text-center"><?php echo count_id();?></td>
<td><?php if($product['media_id'] === '0'): ?><img alt="" class="img-avatar" src="uploads/products/no_image.jpg"> <?php else: ?> <img alt="" class="img-avatar" src="uploads/products/%3C?php%20echo%20$product['image'];%20?%3E"> <?php endif; ?></td>
<td><?php echo remove_junk($product['name']); ?></td>
<td class="text-center"><?php echo remove_junk($product['categorie']); ?></td>
<td class="text-center"><?php echo remove_junk($product['quantity']); ?></td><!--<td class="text-center"> <?php echo remove_junk($product['buy_price']); ?></td>
<td class="text-center"> <?php echo remove_junk($product['sale_price']); ?></td>-->
<td class="text-center"><?php echo read_date($product['date']); ?></td>
<td class="text-center">
<div class="btn-group">
<a class="btn btn-info btn-xs" data-toggle="tooltip" href="edit_product.php?id=%3C?php%20echo%20(int)$product['id'];?%3E" title="Edit"><span class="glyphicon glyphicon-edit"></span></a> <a class="btn btn-danger btn-xs" data-toggle="tooltip" href="delete_product.php?id=%3C?php%20echo%20(int)$product['id'];?%3E" title="Delete"><span class="glyphicon glyphicon-trash"></span></a>
</div>
</td>
</tr><?php endforeach; ?>
</tbody>
</table>
</div>
</div>
</div>
</div><?php include_once('layouts/footer.php'); ?>
</body>
</html>
Resulting image with test data.
Edit, browser console:
As far as I know this code must work but I when I coded it it does not work
The problem is that the form does not submit. How can I solve this ?
I don't even get the value of the checkbox when checked .
<table id="example" class="display" cellspacing="0" width="100%">
<thead>
<th>ID</th>
<th>Item Photo</th>
<th>Item Name</th>
<th>Stocks</th>
<th>Date Posted</th>
<th>Price</th>
<th>Actions</th>
</thead>
<tbody>
<form action ="<?php echo base_url()?>Shop/test" method="POST">
<?php
$x=1;
foreach($shop_items as $key)
{
?>
<tr>
<td><input class="checkbox" type="checkbox" name="cb[]" value="<?php $key->shop_item_id?>"> <?php echo $x;?> </td>
<td><center><img src="<?php echo base_url()?>uploads/items_main/<?php echo $key->shop_item_main_pic;?>" style = "width:60px;height:50px;"alt=""></center></td>
<td><?php echo mb_strimwidth($key->shop_item_name, 0, 18,"...");?></td>
<td style="width:10px;"><center><button><span class="fa fa-eye"></span></button></center></td>
<td><?php echo date('F,d,Y',strtotime($key->shop_item_date_posted))?></td>
<td><?php if(!$key->shop_item_sale){ echo number_format($key->shop_item_orig_price);}
else{ echo "<font color='red'>".number_format(intval($key->shop_item_orig_price-($key->shop_item_orig_price*($key->shop_item_sale/100))))."</font> ";}?></td>
<td>
Bid | View
</td>
</tr>
<?php
$x+=1;
}
?>
<button class='btn btn-danger btn-xs' type="submit" name="delete" value="delete"><span class="fa fa-times"></span> delete</button>
</form>
</tbody>
In the Controller, the structure is like this
if(isset($_POST['delete']))
{
if (isset($_POST["cb"])) {
// Checkbox is checked.
$cb = $_POST["cb"];
echo $cb;
}
else {
$cb = $_POST["cb"];
echo $cb;
}
}
If you emit all the PHP you are left with bad HTML:
<table id="example" class="display" cellspacing="0" width="100%">
<thead>
<th>ID</th>
</thead>
<tbody>
<form action="<?php echo base_url() ?>Shop/test" method="POST">
<tr>
<td>
<input class="checkbox" type="checkbox" name="cb[]" value="<?php $key->shop_item_id ?>"> <?php echo $x; ?>
</td>
</tr>
<button class='btn btn-danger btn-xs' type="submit" name="delete" value="delete">
<span class="fa fa-times"></span> delete
</button>
</form>
</tbody>
</table>
form shoul not be a child of tbody. Any content in a table should be inside th or td tags. You should place the form outside of the table and the button inside td tags:
<form action="<?php echo base_url() ?>Shop/test" method="POST">
<table id="example" class="display" cellspacing="0" width="100%">
<thead>
<th>ID</th>
</thead>
<tbody>
<tr>
<td>
<input class="checkbox" type="checkbox" name="cb[]" value="<?php $key->shop_item_id ?>"> <?php echo $x; ?>
</td>
</tr>
<tr>
<td>
<button class='btn btn-danger btn-xs' type="submit" name="delete" value="delete">
<span class="fa fa-times"></span> delete
</button>
</td>
</tr>
</tbody>
</table>
</form>