I spend more than two days with no luck, when open site, its display all orders for current date. But sometimes I need to add order in previous date, after inserting, query return me to the index page and again its display the orders today, but i want now to display the last record which have different date.
code in index page:
<script>
$('#datepicker').change(function () {
$.post('check_data.php', {
dtpickerdate : $(this).val()
}, function (response) {
$('table').html(response);
});
});
$("#datepicker").datepicker({dateFormat: "mm-dd-yy",}).datepicker("setDate", new Date()).change();
</script>
insert query:
$conn->query("INSERT INTO `orders` VALUES('$order_no','$address','$no_ofppl','$d_time','$k_time','$date',now(),'$done','$mile')") or die('Error: ' . mysqli_error($conn));
echo '
<script type = "text/javascript">
alert("Saved Record");
window.location = "index.php";
</script>
'; }
}else
{
echo 'Result Error';
}
Check_data.php
<thead class = "alert-info">
<tr>
<th>Kitchen Time</th>
<th>Order#</th>
<th>First Name</th>
<th>Last Name</th>
<th>Address</th>
<th>Driver#</th>
<th>Delivery Time</th>
<th># of People</th>
<th>Miles</th>
</tr> </thead><tbody>
<?php
$dtpickerdate = isset($_POST['dtpickerdate']) ? $_POST['dtpickerdate'] : NULL;
$q_customer = $conn->query
("SELECT * from orders inner JOIN customer_order on customer_order.order_no =orders.order_no and orders.date like'$dtpickerdate' inner join driver_order on driver_order.order_no=orders.order_no LEFT JOIN customer on customer.phone=customer_order.phone order by k_time,time desc" )
or die(mysqli_error());
$k_time = '';
while($f_customer = $q_customer->fetch_array()){
$s=mysqli_num_rows($q_customer);
?>
<tr>
<?php
if($k_time == '' || $k_time != $f_customer['k_time']){
$k_time = $f_customer['k_time'];
echo '<td align="center" > <span style=" font-weight:bold;">'
.$f_customer['k_time']. '</td>';
} else{
echo "<td td style=' border: none;'> </td>";
}
echo "<td style='background-color: #5f5d5d; ' align='center' span style='font-weight:bold;'> <a href = '#' style='color:#ececec;font-weight:bold;' data-toggle = 'modal' data-target = '#action'>".$f_customer['order_no']."</a></td>";
echo "<td style='background-color: #5f5d5d;color:#ececec;'>" .$f_customer['first_name']."</td>";
echo "<td style='background-color: #5f5d5d;color:#ececec;'>". $f_customer['last_name']."</td>";
echo "<td style='background-color: #5f5d5d;color:#ececec;'>". $f_customer['address']."</td>";
echo "<td style='background-color: #5f5d5d;color:#ececec;'>". $f_customer['driver_no']."</td>";
echo "<td style='background-color: #5f5d5d;color:#ececec;'>". $f_customer['d_time']."</td>";
echo "<td style='background-color: #5f5d5d;color:#ececec;'>". $f_customer['no_ofppl']."</td>";
}
Related
I have this PHP code and I am trying to alert a table that receives its values via sql.
Here's my code:
<script src="jquery.min.js">
</script>
<script>
function bus(x){
alert("Row index is: " + x.value);
}
</script>
$sql="SELECT ID, NOME, CPF FROM cadastro WHERE NOME LIKE '%" . $name . "%'";
$result=mysqli_query($conn,$sql);
while($row=mysqli_fetch_array($result)){
$ID =$row['ID'];
$NOME=$row['NOME'];
$CPF=$row['CPF'];
echo '<table style="width:100%">';
echo "<tr>";
echo "<th> ID </th>";
echo "<th> NOME </th>";
echo "<th> CPF </th>";
echo "</tr>";
echo '<tr style="cursor: pointer;">';
echo "<td onclick='bus(" . $ID . ")' class='tab'>" . $ID . "</td>";
echo "<td onclick='bus(" . $ID . ")' class='tab'>" . $NOME . "</td>";
echo "<td onclick='bus(" . $ID . )' class='tab'>" . $CPF . "</td>";
echo "</tr>";
echo "</table>";
I need to get the value from the table and serve it to a javascript function.
If x is a Number, then x.value will give you undefined and you should just use:
alert("Row index is: " + x);
To get the value of the column, you could pass this to the function instead of the id and then get the innerHTML:
<td onclick="bus(this)" class="tab">column 1</td>
function bus(elm){
alert(elm.innerHTML);
}
function bus(elm) {
alert(elm.innerHTML);
}
<table>
<tr>
<td onclick="bus(this)" class="tab">column 1</td>
<td onclick="bus(this)" class="tab">column 2</td>
<td onclick="bus(this)" class="tab">column 3</td>
</tr>
</table>
You only have one error. onclick is passing the ID, so the following code will do exactly what you need:
<script>
function bus(x){
alert("Row index is: " + x);
}
</script>
I removed the .value from your javascript.
function bus(x){
alert("Value is " + x);
}
<table>
<tr>
<td onclick="bus(44)">44</td>
<td onclick="bus(44)">Lorem</td>
<td onclick="bus(44)">ipsum</td>
</tr>
</table>
In this case x is not an object, just a plain value so:
alert("Row index is: " + x);
gl, pb
I have a DataTables on a page and want to be able to click anywhere on that row to expand it and show some additional information the docs. However I do not set up my table in JS/Ajax, it's just an HTML table loaded with dynamic information from PHP.
Here is my table:
Here is the the table code:
<table id="tickets" class="table table-striped">
<thead>
<tr>
<th>Ticket #</th>
<th>Agent</th>
<th>Ext.</th>
<th>Ticket Date</th>
<th>Subject</th>
<!-- <th>Text</th> -->
<th>Status</th>
<th>Edit</th>
</tr>
</thead>
<tbody>
<?php
if (pg_num_rows($ticketsQuery) > 0) {
foreach ($ticketsList as $value) {
echo "<tr>";
echo "<td class='col-xs-1'>" . $value['incident_number'] . "</td>";
echo "<td class='col-xs-2'>" . $value['agent'];
if ($value['additional_agent_1'] != '') {
echo "<br>" . $value['additional_agent_1'];
}
if ($value['additional_agent_2'] != '') {
echo "<br>" . $value['additional_agent_2'];
}
if ($value['additional_agent_3'] != '') {
echo "<br>" . $value['additional_agent_3'];
}
echo "</td>";
if ($value['agent_extension'] != '' && $value['agent_extension'] != null) {
echo "<td class='col-xs-1'>ext. " . $value['agent_extension'] . "</td>";
} else {
echo "<td class='col-xs-1'></td>";
}
echo "<td class='col-xs-2'>" . date("D, M. j, Y", strtotime($value['incident_opening_date'])) . "</td>";
echo "<td class='col-xs-3'>" . $value['incident_subject'] . "</td>";
echo "<td class='col-xs-2'>" . $value['incident_status'] . "</td>";
echo "<td class='col-xs-1 text-center'>";
echo "<form action='edit_tickets.php' method='post' style='display:inline-block;'>";
echo "<button class='btn btn-info btn-xs' id='btnEditTicket' name='btnEditTicket' value='" . $value['incident_number'] . "'>Edit</button>";
echo "</form>";
echo "</td>";
echo "</tr>";
}
unset($value); // Unset the foreach value
}
?>
</tbody>
</table>
Here is my DataTable init:
<script>
$(document).ready(function() {
$('#tickets').DataTable({
dom: "<'row'<'col-xs-12 col-sm-6 col-sm-push-2'B><'col-xs-6 col-sm-2 col-sm-pull-6'l><'col-xs-6 col-sm-4'f>>" +
"<'row'<'col-xs-6'><'col-xs-6'>>" +
"<'row'<'col-xs-12't>>" +
"<'row'<'col-xs-12 col-sm-4'i><'col-xs-12 col-sm-8'p>>",
buttons: [
'copy',
'csv',
'excel',
'pdf',
{
extend: 'print'
}
],
columnDefs: [ {
targets: [ 0 ],
orderData: [ 0, 1 ]
}, {
targets: [ 1 ],
orderData: [ 1, 0 ]
} ],
"order": [[3, "desc" ]]
});
});
</script>
Here is the end goal:
I am new to html5 and php. I am wondering how to use javascript in the case of my written code.
I am outputting my database data in a table in HTML. I want the last to output a bit more to the right. But if I use inline css styling I am getting a parse error:
my code:
<table class="scroll">
<thead style="background-color: #99E1D9; color: #705D56;">
<tr>
<th>ID</th>
<th>Name</th>
<th>Last Update</th>
<th style="padding-left: 30%;">Status</th>
</tr>
</thead>
<tbody id="hoverTable">
<?php
$connection = mysql_connect('localhost', 'root', '');
mysql_select_db('patientdb');
$query = "SELECT id, name, date, status FROM clients";
$result = mysql_query($query);
while($row = mysql_fetch_array($result)){ //looping through results
echo "<tr>
<td>" . $row['id'] . "</td>
<td>" . $row['name'] . "</td>
<td>" . $row['date'] . "</td>
<td class=\"fa fa-circle\" style=\"color: grey; margin-left: \30%;\"></td> //my question is regarding this line!!!!
</tr>"; //$row['index'] the index here is a field name
}
mysql_close();
?>
</tbody>
</table>
My goal is to change the color of the output of the last <td> depending on wether the data my database according to this logic:
if (x > 60) {
echo: "orange output";
}elseif (x >50) {
echo: "red output";
}else{
echo: "green output";
}
****How can I use JS in my current case?****
EDIT: trying out solutions
<script>
$('#hoverTable td').css('background-color',function(){
var x = DATA FROM MY DATABASE;
if (x > 50) {
echo: "orange output";
}elseif (x >60) {
echo: "red output";
}else{
echo: "green output";
}
});
</script>
Table code
<table class="scroll">
<thead style="background-color: #99E1D9; color: #705D56;">
<tr>
<th>ID</th>
<th>Naam Client</th>
<th>Laatste Update</th>
<th style="padding-left: 30%;">Status</th>
</tr>
</thead>
<tbody id="hoverTable">
<?php
$connection = mysql_connect('localhost', 'root', ''); //The Blank string is the password
mysql_select_db('patientdb');
$query = "SELECT id, naam, datum, status FROM clients"; //You don't need a ; like you do in SQL
$result = mysql_query($query);
while($row = mysql_fetch_array($result)){
$statusClass = 'class="green output"';
if($row['status'] > 60){
$statusClass = 'class="red output"';
}else if($row['status'] > 50){
$statusClass = 'class="orange output"';
}
echo
'<tr>
<td>' . $row["id"] . '</td>
<td>' . $row["name"] . '</td>
<td>' . $row["date"] . '</td>
<td class="fa fa-circle" style="color: grey; margin-left: 30%;" .$statusClass."></td>
</tr>';
}
mysql_close(); //Make sure to close out the database connection
?>
</tbody>
</table>
hello if you want to use in php and status is last "td" code can be like this:
while($row = mysql_fetch_array($result)){
$statusClass = 'green output';
if($row['status'] > 60){
$statusClass = 'red output';
}else if($row['status'] > 50){
$statusClass = 'orange output';
}
echo '<tr>
<td>' . $row["id"] . '</td>
<td>' . $row["name"] . '</td>
<td>' . $row["date"] . '</td>
<td class="fa fa-circle '.$statusClass.'" style="color: grey; margin-left: 30%;"></td>
</tr>'
}
make sure, that u have highest number in condition on first place, because if you use this code
if (x > 50) {
echo: "orange output";
}elseif (x >60) {
echo: "red output";
}else{
echo: "green output";
}
and x is 65 it returns "orange output" instead of "red output" because first statement is true, x is greater than 50
and using jquery for this is simplest solution. comment above, only apply id for table instead of selector "table"
$("#hoverTable td")...
Straightforward , if you are using jQuery.
$('#hoverTable td:last-child').css('background-color',function(){
var x = /*your target argument*/;
if(x > 50){return 'orange '};
});
You can't break lines in PHP. Use this:
echo "<tr>".
"<td>" . $row['id'] . "</td> ".
"<td>" . $row['name'] . "</td> ".
"<td>" . $row['date'] . "</td>".
"<td class=\"fa fa-circle\" style=\"color: grey; margin-left: \30%;\"></td> ".
"</tr>";
You need to concatenate the ends of each line, or use a heredoc.
echo '<div class="col-lg-10 col-lg-offset-1 panel">' . "<table id='data' class='table'>
<tr>
<th></th>
<th>Document No</th>
<th>AWB NO</th>
<th>Order Id</th>
<th>Forms</th>
<th>Extras</th>
</tr>";
foreach ($cancel as $key => $value)
{
echo "<tr>";
echo "<td>" . "<input type='checkbox' name='name1' id='checkit$checkitCounter' />" . "</td>";
echo "<td>" . $value[$d] . "</td>";
echo "<td>" . $value[$a] . "</td>";
echo "<td>" . $value[$o] . "</td>";
echo "<td>" . $value[$f] . "</td>";
echo "<td>" . $value[$e] . "</td>";
echo "</tr>";
}
echo "</table></div>";
This above table is generated using php echo with checkbox generated every iteration.
<div style="padding-left:600px;">
<a href='#' class='btn btn-primary btn-md' id='button' style="margin-right:1000px;" onclick='checkit()'
role='button'>Continue..</a>
</div>
The above button is supposed to run a javascript function given below:
function checkit {
var x = document.getElementById("checkit").checked;
if (x == false) {
alert('All items are not removed,pls remove and continue');
}
else {
window.location = "tst.php";
}
}
The above JavaScript doesn't seem to be functioning properly as even though i have checked none of the boxes it just stays on the same page.
Example:
<div style="padding-left:600px;"> <a href='#' class='btn btn-primary btn-md' id='button' style="margin-right:1000px;" onclick='checkit()' role='button'>Continue..</a>
</div>
<input type='checkbox' name='name1' class='checkit' />
<input type='checkbox' name='name1' class='checkit' />
<input type='checkbox' name='name1' class='checkit' />
<input type='checkbox' name='name1' class='checkit' />
<input type='checkbox' name='name1' class='checkit' />
<input type='checkbox' name='name1' class='checkit' />
And js:
function checkit() {
var boxes = document.querySelectorAll(".checkit");
arr = [];
for (i = 0; i < boxes.length; i++) {
arr.push(boxes[i]);
}
console.log(arr);
function is_checked(val) {
return val.checked == true;
}
checked = arr.filter(is_checked);
console.log(checked);
if (checked.length != boxes.length) {
alert('All items are not removed,pls remove and continue');
} else {
window.location = "tst.php";
}
}
Demo: https://jsbin.com/cukuzeweza/edit?html,js,output
I have made a light version of your code and the rest is left to your development logic.
You have had a lot small problems in your code, like function in JavaScript needed (), the usage of single and double quotes, missing call the JavaScript function etc.
I have created a dummy array for test, but again you could do what you like to achieve your code.
Here is the working solution:
<?php
$cancel = ["checkBox1", "checkBox2", "checkBox3"];
echo "<div><table id='data' class='table'>
<tr>
<th></th>
<th>Document No</th>
</tr>";
foreach ($cancel as $value)
{
echo "<tr>";
echo "<td><input type='checkbox' name='name1' id='$value' onchange='checkIt(\"$value\");' /></td>";
echo "<td>" . $value . "</td>";
echo "</tr>";
}
echo "</table></div>";
?>
<script>
function checkIt(checkBoxId) {
var x = document.getElementById(checkBoxId).checked;
console.log("x" + checkBoxId + " is " + x);
}
</script>
You can see in your console the results of your checkbox.
I am using this script for exporting data from HTML table to Excel.
<script>
var tableToExcel = (function() {
var uri = 'data:application/vnd.ms-excel;base64,'
, template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body><table>{table}</table></body></html>'
, base64 = function(s) { return window.btoa(unescape(encodeURIComponent(s))) }
, format = function(s, c) { return s.replace(/{(\w+)}/g, function(m, p) { return c[p]; }) }
return function(table, name) {
if (!table.nodeType) table = document.getElementById(table)
var ctx = {worksheet: name || 'Worksheet', table: table.innerHTML}
window.location.href = uri + base64(format(template, ctx))
}
})()
</script>
I found this here
but when i export this data it includes all columns in HTML table as expected to do. but my last row contains some icons that i don't want to export to excel.
<div class="row" style="margin-left:20px;">
<div class="grid_4">
<div class="da-panel collapsible">
<input type="button" class="btn btn-success" onclick="tableToExcel('testTable', 'W3C Example Table')" value="Export to Excel" style="float:right">
<div class="da-panel-content">
<div class="da-panel-title" style="border-top:1px solid #ccc;border-bottom:1px solid #ccc">
<h3 style="padding-left:10px;font-weight:bold;">Staff Training Information</h3></div>
<table class="da-table da-ex-datatable-numberpaging" id="testTable" width="100%">
<thead width="100%">
<tr>
<th width="10%">Staff ID</th>
<th width="10%">Name</th>
<th width="10%">Location</th>
<th width="10%">POCT Test</th>
<th width="10%">Initial Training Date</th>
<th width="10%">Annual Competency Date</th>
<th width="10%">Competency Type</th>
<th width="1%">Next Competency Date</th>
<th width="39%">Action</th>
</tr>
</thead>
<tbody width="100%">
<?php
include_once('database.php');
$pdo = Database::connect();
$sql = 'SELECT * FROM competency';
foreach ($pdo->query($sql) as $row) {
$id = $row['staff_id'];
echo '<tr>';
echo '<td width="10%">'. $row['staff_id'] . '</td>';
$sql1 = "SELECT *FROM staff WHERE StaffID='$id'";
foreach($pdo->query($sql1) as $res)
{
echo '<td width="10%">'. $res['StaffName'] . '</td>';
}
echo '<td width="10%">'. $row['location'] . '</td>';
?>
<td width="10%">
<?php
$s = $row['poct_test'];
$val = explode(" ",$s);
for ($i=0; $i<sizeof($val); $i++)
{
$v = $val[$i];
echo $v."<br/>";
}
?>
</td>
<?php
echo '<td width="10%">'. $row['date_of_initial_training'] . '</td>';
echo '<td width="10%">'. $row['annual_competency'] . '</td>';
echo '<td width="10%">'. $row['type_of_competency'] . '</td>';
echo '<td width="1%">'. $row['next_competency'] . '</td>';
echo '<td width="39%">';
echo '<img src="images/ic_zoom.png" height="16" width="16" />';
echo ' ';
echo '<img src="images/icn_edit.png"/>';
echo ' ';
?>
<img src="images/icn_logout.png"/>
<?php
echo '</td>';
echo '</tr>';
}
Database::disconnect();
?>
</tbody>
</table>
</div>
</div>
</div>
</div>
As shown in code that last 3 echo contains update/delete icons. I just want to exclude Action column when exporting the table content in excel.
Any help would be highly appreciated.
You can use selectors from jQuery, clone of your table in memory then remove elements you don't want with appropriate selector.
var $table = $('#testTable').clone();
$table = filterNthColumn($table, 9); //remove Action column
function filterNthColumn($table, n){
return $table.find('td:nth-child('+n+'), th:nth-child('+n+')').remove();
}
make a hidden div under the table
<div class="exportData"> </div>
Then on click of the export button call export.php through ajax and put the result into exportData div. Then you can call your print script on the new data brought.
$.post( "export.php", function( data ) {
$( ".result" ).html( data );
});
Copy past your for loop on export.php and delete the two cols.
I think you can just clone the table firstly, remove the action column, and "tableToExcel" the cloned table.
To make the column removing easier, add class "action_th" to action th, and class "action_td" to action td.
Then it's like this,
var exTable = $('#testTable').clone();
//remove the action th/td
exTable.find('.action_th, .action_td').remove();
//then tableToExcel(exTable, ..
This works for me -
$('#divTableContainer').clone().find('table tr th:nth-child(7),table tr td:nth-child(7)).remove().end().prop('outerHTML')