how to display a table based on a column value (CSV Path) - javascript

I have a table as such
File Name
File path
MyFile1.csv
D:\tmp\MyFile1.csv
MyFile2.csv
D:\tmp\MyFile1.csv
So Far , i'm displaying my main table as such
<div class="panel-body table-responsive">
<table class="table table-striped table-bordered" id="example">
<thead>
<tr style="background-color:#555;color:white;">
<th>File Name</th>
<th>File path</th>
</tr>
</thead>
<tbody>
<?php
$query_table = "select File_Name as File_Name, file_path as file_path from table_logs ";
$result_table = pg_query($dbconn1, $query_table) or die('Échec de la requête : ' . pg_last_error());
while ($list_table = pg_fetch_assoc($result_table)) {
echo '<tr><td>' . $list_table['File_Name '] . '</td><td>' . $list_table['file_path '] . '</td></tr>';
}
?>
</tbody>
<tfoot>
<tr>
<th>File Name</th>
<th>File path</th>
</tr>
</tfoot>
</table>
</div>
To access the csv files a transform them dynamicaly to sub tables based on the file paths i'm using this php code and that working fine
<?php
$query_table = "select File_Name as File_Name, file_path as file_path from table_logs";
$result_table = pg_query($dbconn1, $query_table) or die('Échec de la requête : ' . pg_last_error());
while ($list_table = pg_fetch_assoc($result_table)) {
echo "<br><html><body><table >\n\n";
$f = fopen($list_table['file_path'], "r");
while (($line = fgetcsv($f)) !== false) {
echo "<tr>";
foreach ($line as $cell) {
echo "<td>" . htmlspecialchars($cell) . "</td>";
}
echo "</tr>\n";
}
fclose($f);
echo "\n</table></body></html>";
}
?>
My output is as such for the file path 1 : D:\tmp\MyFile1.csv
Key
Value
key1
value1
key2
value2
My output is as such for the file path 2 : D:\tmp\MyFile2.csv
Key
Value
key1
my row 1
key2
my row 2
My question is how display a table when clicking on the value of a File Path
Do i have to add a button the main table ?
How could i achieve the link between the main table and the sub tables ?
How to use ajax to pass the variable and display in Javascript the result ?

You can use an anchor tag for that and pass the filename with your link than grab it from the URL and show data of that file. You can get your filename when people click on your file paths.
D:\tmp\MyFile1.csv
<br>
<?php echo isset($_GET['fileanme']) && $_GET['fileanme'] ? $_GET['fileanme'] : '' ?>

Related

Button to remove table row is not getting added to html table

I am trying to add a button to remove the table row when clicked. This should be placed next to data that is outputted from MySQL database.For some reason the button is not outputting, below is the code for my table:
<table>
<thead>
<tr>
<th>Name</th>
<th>Email</th>
<th>Subject</th>
<th>Message</th>
<th>Have you replied?</th>
</tr>
</thead>
<?php //makes a connection to the database
$conn = mysqli_connect("localhost", "root", "", "messages");
if ($conn->connect_error) {
die("Connection Failed:" . $conn->connect_error);
}
$sql = "SELECT * FROM tbl_messages";
$result = $conn->query($sql);
if ($result->num_rows > 0) { //fills the table with the content in the database
while ($row = $result->fetch_assoc()) {
echo '<tr><td>' . $row["name"] . '</td><td>' . $row["email"] . '</td><td>' . $row["subject"] . '</td><td>' . $row["message"] . '</td><td><button id="replied" onclick="DeleteRow()"></button>' . '</td></tr>';
}
echo "</table";
} else {
echo "0 result";
}
$conn->close();
?>
</table>
And this is the javascript code to delete the table row:
<script>
function DeleteRow() {
var td = event.target.parentNode;
var tr = td.parentNode; // the row to be removed
tr.parentNode.removeChild(tr);
}
</script>
Picture of my table row
The blank space underneath the "Have you replied" table header is where the button should be but its not there
I am still learning PHP so any replies on how I can fix this would be very helpful please

How do I create a link in <tr> using the same data requested from an SQL database?

I am trying to create a table which pulls data from an SQL database and each row on the table is a clickable link to it's corresponding page depending on the first column data in the database.
I have managed to do both parts separately i.e create a table with SQL data and i've managed making a table with each row a clickable link however I am struggling to combine the two.
I am using a .js to listen for clicks and send you off depending on the "tr data-href='url'".
My php script to create the table form SQL data creates the "tr" first, then populates the row with each cell, closes the "/tr" and repeats for all rows.
How can I make the php write the "tr data-href='url'" where 'url' is the same as the first column of data for each row?
My PHP script is below, followed by the five lines of JS.
<?php
$host = "localhost";
$user = "user";
$pass = "pass";
$db_name = "FFD";
//create connection
$connection = mysqli_connect($host, $user, $pass, $db_name);
//test if connection failed
if(mysqli_connect_errno()){
die("connection failed: "
. mysqli_connect_error()
. " (" . mysqli_connect_errno()
. ")");
}
//get results from database
$result = mysqli_query($connection,"SELECT id,name,location,plots,blurb FROM Sites");
$all_property = array(); //declare an array for saving property
//showing property
echo '
<div class="content-container">
<h1>Table heading</h1>
<section>
<div class="tbl-header">
<table cellpadding="0" cellspacing="0" border="0">
<thead>
<tr>'; //initialize table tag
while ($property = mysqli_fetch_field($result)) {
echo '<th>' . $property->name . '</th>'; //get field name for header
array_push($all_property, $property->name); //save those to array
}
echo '</tr>
</thead>
</table>
</div>
<div class="tbl-content">
<table cellpadding="0" cellspacing="0" border="0">
<tbody>';
//end tr tag
//showing all data
while ($row = mysqli_fetch_array($result)) {
echo '<tr>';
foreach ($all_property as $item) {
echo '<td>' . $row[$item] . '</td>'; //get items using property value
}
echo '</tr>';
}
echo '</tbody></table></div></section></div>';
?>
$(document).ready(function(){
$('tr[data-href]').on("click", function() {
document.location = $(this).data('href');
});
});
I could just be thick and missing something simple and obvious.
Thanks in advance!
You can concatenate your url, like this (assuming id is the column with the url)
while ($row = mysqli_fetch_array($result)) {
echo '<tr data-href="' . $row['id'] . '">';
foreach ($all_property as $item) {
echo '<td>' . $row[$item] . '</td>';
}
echo '</tr>';
}

Data table Server side Ajax Pagination

I Have A location Table with nearly 14 thousand records,
I need ajax pagination with server-side data.
I used the Below Code But not working.
<table class="table table-bordered table-striped table-hover dataTable js-exportable" id="htmltableID">
<thead>
<tr>
<th>SNO</th>
<th>Location</th>
<th>City</th>
<th>State</th>
</tr>
</thead>
<tbody>
<?php
$i = 1;
foreach ($data as $row) {
echo "<tr>";
echo "<td>" . $i . "</td>";
echo "<td>" . $row->location . "</td>";
echo "<td>" . $row->city . "</td>";
echo "<td>" . $row->state . "</td>";
echo "</tr>";
$i++;
}
?>
</tbody>
</table>
<script>
var oTable = "";
$(document).ready(function () {
oTable = $('#htmltableID').dataTable({
"sPaginationType": "full_numbers",
"bServerSide": true,
"sAjaxSource": "location",
"sServerMethod": "POST",
"iDisplayLength": 5
});
});
</script>
By Using this Code I am getting error Msg "DataTables warning: table id=htmltableID - Cannot reinitialise DataTable. For more information about this error, please see http://datatables.net/tn/3" and "DataTables warning: table id=htmltableID - Invalid JSON response. For more information about this error, please see http://datatables.net/tn/1"
You should have below type of code in main file. Let's say Maindata.php
<table class="table table-bordered table-striped table-hover dataTable js-exportable" id="htmltableID">
<thead>
<tr>
<th>SNO</th>
<th>Location</th>
<th>City</th>
<th>State</th>
</tr>
</thead>
</table>
<script>
var oTable = "";
$(document).ready(function () {
oTable = $('#htmltableID').dataTable({
"sPaginationType": "full_numbers",
"bServerSide": true,
"sAjaxSource": "location",
"sServerMethod": "POST",
"iDisplayLength": 5
});
});
</script>
And the data(json) needs to be fetch from other file, let's say loadrecords.php(In your case it was location/loadRecord)
<?php
// $data is the list of records fetched from database
// No need to print the data since we need to provide json data to dataTable, so Below code not required
/*
$i = 1;
foreach ($data as $row) {
echo "<tr>";
echo "<td>" . $i . "</td>";
echo "<td>" . $row->location . "</td>";
echo "<td>" . $row->city . "</td>";
echo "<td>" . $row->state . "</td>";
echo "</tr>";
$i++;
}
*/
// Data which you needs to send in 'location/loadRecord' should be like this (In my case it was `loadrecords.php`)
/*{
"data": [
["1","Location 1","City 1","State 1"],
["2","Location 2","City 2","State 2"],
.....
.....
["N","Location N","City N","State N"]
]
}*/
// Loop the data records fetched from database and prepare array in below format
$json_arr = array(
"data" => array(
array("1","Location 1","City 1","State 1"),
array("2","Location 2","City 2","State 2"),
...............
...............
array("N","Location N","City N","State N"),
)
);
echo json_encode($json_arr);
data will have N no.of rows with 4 columns since you want to display 4 columns in the table so related data needs to be provided in json

Hidden table row not displaying correct information

I've having some issue with the Javascript. I have a table that shows the basic information of the customer when an employee conduct a search base on the customer name. When the employee clicks on "View Sales History" the hidden table row of the particular customer's sales history will appear.
I've have no problem displaying the sales history of all the customer's returned from the search when I change the css display to "table-row". However it would only display the first customer's sales history whenever I hide the table row and include the javascript to display the hidden row.
This is what I've tried doing so far, hopefully someone can help me out here.
while($row = mysql_fetch_assoc($result)) {
$id = $row["id"];
$cfname = $row["f_name"];
$clname = $row["l_name"];
$cemail = $row["email"];
$ccompany = $row["company_name"];
$year = $row["year"];
$product = $row["product"];
$employee = $row["employee"];
$status = $row["status"];
echo '<tr>
<td>'.$cfname.' '.$clname.'</td>
<td>'.$cemail.'</td>
<td>'.$ccompany.'</td>
<td> <h4 id="vsalesHistory" onclick="vsalesHistory()">View Sales History</h4></td>
</tr>';
echo '<thead id="salesHistoryHead">
<tr>
<th>Date of Sales</th>
<th>Type of Product</th>
<th>Previous Sales Manager</th>
<th>Job Status</th>
</tr>
</thead>';
echo '<tr id="salesHistory">
<td>'.$year.'</td>
<td>'.$product.'</td>
<td>'.$employee.'</td>
<td>'.$status.'</td>
</tr>';
}
echo '</table>';
and this is my JS script
function vsalesHistory(){
var e = document.getElementById('salesHistoryHead');
var f = document.getElementById('salesHistory');
if(e.style.display == 'table-row'){
e.style.display = 'none';
}else{
e.style.display = 'table-row';
}
if(f.style.display == 'table-row'){
f.style.display = 'none';
}else{
f.style.display = 'table-row';
}
}
You are creating multiple rows with the same ID, which is not a good idea. Instead, use the row ID to create unique iDs, like:
echo '<thead id="salesHistoryHead' . $id . '">
<tr>
<th>Date of Sales</th>
<th>Type of Product</th>
<th>Previous Sales Manager</th>
<th>Job Status</th>
</tr>
</thead>';
echo '<tr id="salesHistory' . $id . '">
<td>'.$year.'</td>
<td>'.$product.'</td>
<td>'.$employee.'</td>
<td>'.$status.'</td>
</tr>';
Then pass the ID with the button action, e.g.
<td> <h4 id="vsalesHistory" onclick="vsalesHistory(' . $id . ')">View Sales History</h4></td>
If $id is a string, you would need to quote it in the call to vsalesHistory.
Now you can use the ID in your Javascript to pick the single right set of information.
For example:
function vsalesHistory(id){
var e = document.getElementById('salesHistoryHead'+id);
var f = document.getElementById('salesHistory'+id);
...

Passing GET parameters in JediTable loadurl

Background:
I am creating a php generated shifts scheduler for my hospital's Operating Rooms. On X Axis I'm plotting days, on Y the ORs. I'm using Jeditable to edit in place each cell generating a dropdown from a select that load data.
Php Code:
$query = $db->query('select sp.id, sp.sigla from lista_specializzandi sp where sp.id not in (select sp.id from lista_specializzandi sp, esigenze e where sp.id = e.specializzando and e.giorno='.$giorno.' and (e.tipologia=2 or e.tipologia=3 or e.tipologia=4 or e.tipologia =5 or e.tipologia=6 or e.tipologia=7))');
$esiSelect = array();
while ($disp = $db->fetch_array($query)) {
$esiSelect[$disp['id']] = $disp['sigla'];
}
Javascript:
<script>
$(document).ready(function() {
$(".turnistica").editable('save_turnistica.php', {
data : <?php echo json_encode($esiSelect); ?>,
type : 'select',
indicator : 'Salvo...',
tooltip : 'Clicca per modificare',
placeholder : ' ',
onblur : 'submit',
event : 'click',
submitdata : function(value, settings) {
return {"giorno" : $(this).attr('id_giorno'), "sala" : $(this).parent().attr('id_riga')};
}
});
});
</script>
The table:
<section class="fluid" id="flip-scroll">
<table id="foglioEsigenze" class="table-bordered table-striped table-condensed cf full">
<col class="col10">
<?php
foreach ($cals as $c)
echo
'<col class="dw'.$c->isFeriale.$c->isFestivo.'"></col>';
?>
<thead class="cf verde_trasp bold text-white">
<tr>
<th class="col1"> </th>
<?php
foreach ($cals as $c)
echo
'<th class="dw'.$c->isFeriale.$c->isFestivo.'"><span style="font-size:9px">'.substr($c->giornoNome, 0, 3).'</span> '.$c->d.'</th>';
?>
</tr>
</thead>
<tbody>
<?php
while ($s = $db->fetch_array($indice)) {
echo
'<tr class="Row" data-blocco="'.$s['blocco'].'" id_riga="'.$s['id'].'"><td style="text-align: left;">'.$s['sigla'].'</td>';
foreach ($cals as $g) {
echo
'<td class="turnistica" style="text-align: center;" id_giorno="'.$g->id.'">';
global $db;
$sql = 'select sp.sigla from turnistica t, lista_specializzandi sp where t.giorno = '.$g->id.' and t.riga='.$s['id'].' and t.specializzando = sp.id limit 1';
$query = $db->query($sql);
$sigla = $db->fetch_array($query);
echo $sigla['sigla'];
'</td>';
'</tr>';
}
}
?>
</tbody>
</table>
</section>
... So far so good!
Now I need to create a dropdown that auto remove physicians after I insert them in a column.
I thought this solution but I don't know why it's not working.
1) I moved all the load code to an external php file:
<?php
require ('includes/initialise.php');
global $db;
$giorno = $_GET['giorno'];
$query = $db->query('select sp.id, sp.sigla from lista_specializzandi sp where sp.id not in (select sp.id from lista_specializzandi sp, esigenze e where sp.id = e.specializzando and e.giorno='.$giorno.' and (e.tipologia=2 or e.tipologia=3 or e.tipologia=4 or e.tipologia =5 or e.tipologia=6 or e.tipologia=7))');
$esiSelect = array();
while ($disp = $db->fetch_array($query)) {
$esiSelect[$disp['id']] = $disp['sigla'];
}
echo json_encode($esiSelect);
?>
2) I called it by loadurl in the javascript adding the attribute of the element
loadurl : "disponibili.php?giorno=" + $(this).attr("id_giorno"),
All the problems are coming from the Javascript variable I am passing. But I googled a lot without solving the problem.
How can I fix this?
#dcaswell: I am not able to pass the javascript variable in 2) to the loadurl file, so no action can be performed before populating the json list. I am definitely missing something. Any help would be much appreciated.
Thanks

Categories

Resources