HTML Table Grid - php

Need some help.
I'm creating a table view with grid/borders.
However,some borders can't be seen although I'm including in tags the style=''.
Much better if I will tell that I only see the table border which is included in table tag.
Please see attached file for the format.
By the way I'm getting the records in database via PHP script.
Here is my code:
$result.="<br/><br/><br/>
<table style='border:solid 1px;'>";
$result.="<thead style='border-bottom:thin solid'><th style='text- align:center;border-style:solid 1px'>YC ".$store_name."</th></thead>
<tr><td></td>
<td colspan='3'>Service Time </td>
<td colspan='3'>Production Time</td>
<!--<td colspan='3'>Customer Feedback</td>
<td colspan='3'>Customer Feedback</td>
<td colspan='3'>Customer Feedback</td>-->
</tr>
<tr></tr>
<tr>
<td></td>
<td>TC Within<br>30 mins.</td>
<td>Total<br>TC</td>
<td><br/>%</td>
<td>Within 15 <br/>mins.</td>
<td>Total <br/>TC</td>
<td><br/>%</td>
</tr>
<tr></tr>";
//get PartView
$query = "SELECT * FROM Part_view WHERE StoreID = ".$store_id." AND datepart(month,TransDate) = '".$month."' AND datepart(year,TransDate) = '".$year."' ORDER BY TransDate ASC ";
$que = mssql_query($query);
while($row=mssql_fetch_array($que)){
$transdate =date('d',strtotime($row['TransDate']));
$tc30 = $row['TC30'];
$totaltc30 = $row['Total_TRX1'];
$hitrate = round($row['Hitrate']);
$pd15 = $row['PDT15'];
$totalpd15 = $row['Total_TRX2'];
$production = round($row['ProdTime']);
$excellence = $row['Excellence'];
$totalexcellence = $row['Total_TRX4'];
$excellencepercent = round($row['ExcelPercent']);
$good = $row['Good'];
$totalgood = $row['Total_TRX5'];
$goodpercent = round($row['GoodPercent']);
$poor = $row['Poor'];
$totalpoor = $row['Total_TRX6'];
$poorpercent = round($row['PoorPercent']);
if($hitrate==""){
$hitrates = "";
}else{
$hitrates = $hitrate;
}
$result.="<tr>
<td>".$transdate."</td>
<td>".$tc30."</td>
<td>".$totaltc30."</td>
<td>".$hitrate."% </td>
<td>".$pd15."</td>
<td>".$totalpd15."</td>
<td>".$production."% </td>
</tr>";
}
$result.="</table>";
echo $result;
Can someone help me?

OK, I think what you are actually asking is why the entire grid isn't being 'bordered'. You can use CSS to accomplish this far cleaner than inline styles. You need to set styles for TD.
Code:
table {
border-width: 1px;
border-spacing: 0px;
border-style: solid;
border-color: black;
border-collapse: separate;
background-color: white;
}
table th {
border-width: 1px;
padding: 3px;
border-style: solid;
border-color: black;
background-color: white;
}
table td {
border-width: 1px;
padding: 3px;
border-style: solid;
border-color: black;
background-color: white;
}
If you use this in your CSS you can remove all the inline styling you have already, this code will fix it all.

You can use this tool to create the table. But I recommend you to do that by yourself. And you should include your code and we can help you to fix that.
Tool: http://divtable.com/generator/

Related

Define certain table data Phpmyadmin by URL - Wordpress Custom Code

I want to make custom code website function into wordpress.
its continuation from My URL question here: https://stackoverflow.com/questions/65456090/change-default-user-profile-url-bbpress-plugin
I have code that insert value into database phpmyadmin
function topic_count($reply_id = 0){
global $connection;
$user_id= bbp_get_reply_author_id( $reply_id );
$username= get_userdata($user_id);
$topic_count = bbp_get_user_topic_count_raw( $user_id);
$reply_count = bbp_get_user_reply_count_raw( $user_id);
$post_count = (int) $topic_count + $reply_count;
if(isset($user_id, $username->user_login, $topic_count, $reply_count, $post_count)){
$query = "INSERT INTO example (id, username, topic_count, reply_count, post_count )
VALUES (
'$user_id',
'$username->user_login',
'$topic_count',
'$reply_count',
'$post_count')";
mysqli_query($connection , $query);
}
}
add_action('bbp_theme_after_reply_author_details', 'topic_count');
The code working well, and the data stored into phpmyadmin. See this image below:
Now, i want to make function to get the user data. Not listing all the data, only retrieve specific user data. The key to define what data to take only through URL. Because the url have username defined, from this code:
function user_profile_link(){
$author_id = bbp_get_reply_author_id();
$user_info = get_userdata($author_id);
$url = site_url()."/profile/".$user_info->user_login;
return $url;
}
add_filter('bbp_get_user_profile_url', 'user_profile_link');
This is the image result:
Im trying to get the data with this code:
$id_query = mysqli_query($connection, "SELECT * FROM example" ) ;
$test = mysqli_fetch_assoc($id_query);
echo $test["username"];
And yes, the data can be fetched. But the problem is, only fetch first data. 'achan'. User andre and also chandra, also get 'achan' username.
In the nutshell, how to make code like, this url 'http://localhost/example/profile/chandra/' for 'chandra' data. this url 'http://localhost/example/profile/andre/' for 'andre' data.
All help is appreciated. Thank you web developer.
use while when you fetch data and set it to array; then use foreach.
$test_array = [];
while($test = mysqli_fetch_assoc($id_query)){
$test_array[] = $test;
}
foreach(test_array as $item){
echo $item["username"];
}
I found the solution in my own way. I'm using $_SERVER['REQUEST_URI']
the code is like this:
$uriSegments = explode("/", parse_url($_SERVER['REQUEST_URI'], PHP_URL_PATH));
$id_query = mysqli_query($connection, "SELECT * FROM example" ) ;
foreach($id_query as $row);
if($uriSegments[3] == $row["username"]){
//your code, but in my case something like this
?>
<table style="border-collapse: collapse; width: 100%;">
<tbody>
<tr>
<td style="width: 20%; border-style: solid; border-color: #000000;">User ID</td>
<td style="width: 20%; border-style: solid; border-color: #000000;">Username</td>
<td style="width: 20%; border-style: solid; border-color: #000000;">Jumlah Topik</td>
<td style="width: 20%; border-style: solid; border-color: #000000;">Jumlah
Balasan</td>
<td style="width: 20%; border-style: solid; border-color: #000000;">Total</td>
</tr>
<tr>
<td style="width: 20%; border-style: solid; border-color: #000000;"><?= $row["id"] ?>
</td>
<td style="width: 20%; border-style: solid; border-color: #000000;"><?=
$row["username"] ?></td>
<td style="width: 20%; border-style: solid; border-color: #000000;"><?=
$row["topic_count"] ?></td>
<td style="width: 20%; border-style: solid; border-color: #000000;"><?=
$row["reply_count"] ?></td>
<td style="width: 20%; border-style: solid; border-color: #000000;"><?=
$row["post_count"] ?></td>
</tr>
</tbody>
</table>
<br /><br />
<?php
}
This code solve my problem. I hope this answer will be useful.

How to create search engine for a website?

I am Front end developer but never touched any backend language. So now I have to create a website for my client. They have supposed data of 500 items with 10 fields each in Excel file. Now they want to create a search engine within their website where we search for the name and all the info related to that name appears.Search should be only by 1 field that is name. Any help?
Even if I hire someone to help me out, what all technologies he/she should know?
Dont think its right thing to do. Using database would be a good idea but this is something you can do to overcome this issue.I think import your data to html table and do the following.
function myFunction() {
var input, filter, table, tr, td, i;
input = document.getElementById("myInput");
filter = input.value.toUpperCase();
table = document.getElementById("myTable");
tr = table.getElementsByTagName("tr");
for (i = 0; i < tr.length; i++) {
td = tr[i].getElementsByTagName("td")[0];
if (td) {
if (td.innerHTML.toUpperCase().indexOf(filter) > -1) {
tr[i].style.display = "";
} else {
tr[i].style.display = "none";
}
}
}
}
#myInput {
background-image: url('/css/searchicon.png');
background-position: 10px 12px;
background-repeat: no-repeat;
width: 100%;
font-size: 16px;
padding: 12px 20px 12px 40px;
border: 1px solid #ddd;
margin-bottom: 12px;
}
#myTable {
border-collapse: collapse;
width: 100%;
border: 1px solid #ddd;
font-size: 18px;
}
#myTable th, #myTable td {
text-align: left;
padding: 12px;
}
#myTable tr {
border-bottom: 1px solid #ddd;
}
#myTable tr.header, #myTable tr:hover {
background-color: #f1f1f1;
}
<input type="text" id="myInput" onkeyup="myFunction()" placeholder="Search for names..">
<table id="myTable">
<tr class="header">
<th style="width:60%;">Name</th>
<th style="width:40%;">Country</th>
</tr>
<tr>
<td>Garry</td>
<td>Australia</td>
</tr>
<tr>
<td>Ben Hopkins</td>
<td>USA</td>
</tr>
<tr>
<td>Deric</td>
<td>UK</td>
</tr>
<tr>
<td>Ollie</td>
<td>Germany</td>
</tr>
</table>
First of all, You need a DBMS in you PC then make a Database here according to requirements. then using server side programming language like PHP, C#, Java etc. now you are able to make the search engine.
I am here to help you more if you need more help. thanks
Here are dome steps that might help you
1. You need a database and all the data inserted to it with specific fields.
2. Now On the front-end you need a from like this
<form method="post" action="">
<input type = text name="field_name_to_search">
<input type = submit name = "submit" value="submit" >
</form>
3. For displaying the data searched you need a database connection for the file in which you are writing your code.
4. After connecting with database you need to get the data with sql query and view in a required format. The query can be like this
<?php if(isset($_POST('submit'))){
$sql = "select * from database_table WHERE field_name_to_search =
$_POST('field_name_to_search')";
}
?>
5. Now you have all the data regarding the field searched in the variable $sql.
6. You can check the data by print_r($sql) function. You have all the data that is searched you can parse it into your html using a (for) loop.
If you hire a developer just show him this answer. I am sure he will get my point.

Is it possible to change the table structure in mobile device using html css?

I have one table which is displaying proper in desktop. I want to change the layout or structure of table in mobile. Please check below image. I have to display like that. I have to display all the information in one row in mobile.Would you help me in this?
<table>
<thead>
<tr>
<th>Id</th>
<th>Name</th>
<th>Email</th>
<th>Mobile</th>
</tr>
</thead>
<tbody>
<?php
if (isset($result_all_records->num_rows) > 0) {
// output data of each row
while($row = $result_all_records->fetch_assoc()) {
echo "
<tr>
<td>{$row['id']}</td>
<td>{$row['Name']}</td>
<td>{$row['Email']}</td>
<td>{$row['Mobile']}</td>
";
}
}
else {
echo "No records found";
}
?>
</tbody>
</table>
I found the solution from http://codepen.io/anon/pen/QwPVNW
We have to add `data-label='column name' and need to use below code in media queries. it will work
echo "
<tr>
<td data-label='id'>{$row['id']}</td>
<td data-label='Name'>{$row['Name']}</td>
<td data-label='Email'>{$row['Email']}</td>
<td data-label='Mobile'>{$row['Mobile']}</td>
";
#media only screen and (max-width: 384px) {
table {
border: 0;
}
table thead {
display: none;
}
table tr {
margin-bottom: 10px;
display: block;
border-bottom: 2px solid #ddd;
}
table td {
display: block;
text-align: left;
font-size: 13px;
border-bottom: 1px dotted #ccc;
}
table td:last-child {
border-bottom: 0;
}
table td:before {
content: attr(data-label);
float: left;
text-transform: uppercase;
font-weight: bold;
margin-right: 20px;
}
}

php table break page with no rows on next page

I am having a php table which contains information about billing of certain numbers. After generating this table I export it in pdf using mpdf.
If the table has a certain number of rows it breaks the page in a weird way, leading the headers repeat on the next page with no rows.
Here is the format of the table:
The table contains up to 3 headers inside <thead> tags, like this:
<table class="items" width="100%" style="font-size: 9pt; border-collapse: collapse;" cellpadding="8">
<thead>
<tr>
<td width="30.3%">Forbrug</td>
<td width="23.1%">Periode</td>
<td width="10.76%">Tid/MB</td>
<td width="9.28%">Enheder</td>
<td width="12.9%" align="right">I alt</td>
<td width="13.3%" align="right">I alt+<b>moms</b></td>
</tr>
</thead>
rows are added in a while from the database in this way.. nothing special
<tr>
<td>'.$produktNameFromDatabase.'</td>
<td>'.$periodeFromDatabase.'</td>
<td>'.$tidMbFromDatabase.'</td>
<td>'.$enhederFromDatabase.'</td>
<td align="right">'.number_format((float)$produktpris, 2, ',', '.').' kr.</td>
<td align="right"><b>'.number_format((float)$produktpris*(1 + (0.25 * $moms)) - $momsDiscount, 2, ',', '.').' kr.</b></td>
</tr>
with the total lines at the end
<tr>
<td class="blanktotal" colspan="1" rowspan="6"></td>
<td class="blanktotal" colspan="1" rowspan="6"></td>
<td class="totals" colspan="2">Subtotal:</td>
<td class="totals" colspan="2">'.number_format((float)$pris1, 2, ',', '.').' kr.</td>
</tr>
<tr>
<td class="totals1" colspan="2">Moms:</td>
<td class="totals1" colspan="2">'.number_format((float)$pris1*(0.25 * $moms) - $momsTotal, 2, ',', '.').' kr.</td>
</tr>
<tr>
<td class="totals1" colspan="2"><b>TOTAL:</b></td>
<td class="totals1" colspan="2"><b>'.number_format((float)$pris1*(1 + (0.25 * $moms)) - $momsTotal, 2, ',', '.').' kr.</b></td>
</tr>
</tbody>
</table>
!!! EVERYTHING that you have seen by now, including the totals are a part of the table!
Here is the mpdf settings that I have:
In PhP:
$mpdf=new mPDF('win-1252','A4','','',20,15,48,25,10,10);
$mpdf->useOnlyCoreFonts = true; // false is default
$mpdf->SetProtection(array('print'));
$mpdf->SetTitle("Suggestive Title");
$mpdf->SetAuthor("Author");
$mpdf->SetWatermarkText("Faktura");
$mpdf->showWatermarkText = true;
$mpdf->watermark_font = 'DejaVuSansCondensed';
$mpdf->watermarkTextAlpha = 0.1;
$mpdf->SetDisplayMode('fullpage');
In HTML:
$html .= '<!--mpdf
<htmlpageheader name="myheader">
<table width="100%"><tr>
<td width="50%" style="color:#000000;">
<span style="font-weight: bold; font-size: 14pt;">
Company Name
</span>
Company Information
</td>
<td width="50%" style="text-align: right;">
<img src="image.jpg" />
Invoice Information <br />Side: {PAGENO} af {nb}
</td>
</tr></table>
</htmlpageheader>
<htmlpagefooter name="myfooter">
<div style="border-top: 1px solid #000000; font-size: 9pt; text-align: center; padding-top: 3mm; ">
Footer Stuff
</div>
<div style="font-size: 9pt; text-align: center;">
Other Footer Stuff
</div>
</htmlpagefooter>
<sethtmlpageheader name="myheader" value="on" show-this-page="1" />
<sethtmlpagefooter name="myfooter" value="on" />
mpdf-->';
Some styling that I use
body {font-family: sans-serif;
font-size: 10pt;
}
p { margin: 0pt;
}
td { vertical-align: top; }
.items td {
border-left: 0.1mm solid #000000;
border-right: 0.1mm solid #000000;
}
table thead td { background-color: #d4ffaa;
border: 0.1mm solid #000000;
}
.items td.blanktotal {
background-color: #FFFFFF;
border: 0mm none #000000;
border-top: 0.1mm solid #000000;
border-right: 0.0mm solid #000000;
}
.items td.totals {
text-align: right;
border-top: 0.1mm solid #000000;
border-right: 0.0mm solid #000000;
border-left: 0.0mm solid #000000;
}
.items td.totals1 {
text-align: right;
border-top: 0.0mm solid #000000;
border-right: 0.0mm solid #000000;
border-left: 0.0mm solid #000000;
}
The result looks something like this:
This issue occurs only when the number of rows fills the page. If it overflows it is no major issue, because the table headers are still there on the next page (all of them unfortunately, not only the last one) and the rest of the rows are added further.
How can I get rid of those empty rows, in this special case?
Thank you!
!!EDIT: Added more information, code and a better image of the case. Sorry for not doing it at the first time!
!!EDIT #2: I just observed on other examples that had more than 1 page of rows that the <thead>s keep their position on next pages. It happens all the time. Is there a way to disable that so that other <thead>s will just continue on the next page from the top of the page without remembering the position from the previous page?
You need to set headers (and footers) in individual strings, like this:
require_once __DIR__ . '/../vendor/autoload.php';
$stylesheet = '
.table-header{
border: none;
background-color: yellow;
width: 100%;
}
.table-header td{
border-right: 1px solid;
}
.table-body{
border: none;
background-color: transparent;
width: 100%;
}
.table-body td{
border-right: 1px solid;
border-bottom: 1px solid;
}
.table-footer{
border: none;
background-color: transparent;
width: 100%;
}
.table-footer .td-number{
text-align: right;
}
';
/* Sample data */
$html = '<table class="table-body">';
for ($i = 1; $i <= 100; $i++) {
$html.='<tr>
<td width="30.3%">Forbrug '.$i.'</td>
<td width="23.1%">Periode '.$i.'</td>
<td width="10.76%">'.$i.' MB</td>
<td width="9.28%">Val '.$i.'</td>
<td width="12.9%" align="right">I alt '.$i.'</td>
<td width="13.3%" align="right"><b>moms</b> '.$i.'</td>
</tr>';
}
$html.= '</table>';
$header = '<table class="table-header"><tr>
<td width="30.3%">Forbrug</td>
<td width="23.1%">Periode</td>
<td width="10.76%">Tid/MB</td>
<td width="9.28%">Enheder</td>
<td width="12.9%" align="right">I alt</td>
<td width="13.3%" align="right">I alt+<b>moms</b></td>
</tr></table>';
$footer = '<table class="table-footer"><tr>
<td>Footer here</td>
<td class="td-number"><b>Page N. {PAGENO}</b></td>
</tr></table>';
$mpdf = new mPDF('c','A4','','',15,15,18,15,10,5);
$mpdf->mirrorMargins = 1;
/* Declare headers */
$mpdf->SetHTMLHeader($header);
$mpdf->SetHTMLHeader($header,'E');
/* Declare footers */
$mpdf->SetHTMLFooter($footer);
$mpdf->SetHTMLFooter($footer,'E');
$mpdf->WriteHTML($stylesheet,1);
$mpdf->WriteHTML($html);
$mpdf->Output();
I eventually found a solution. Best way to get rid of these things is to replace <thead> tags with <th>. <thead> has a predefined style which makes the table header repeat itself on every page. <th> will make the header stop repeating itself on the next pages (fortunate or unfortunate), but it will eliminate the space caused by the <thead>'s style

TCPDF - printing table from mysql showing repeated first row

I am new to TCPDF. The small problem that I am facing is that all output data is displaying the same row. I mean the first record is repeated the number of times the total data(rows) exist in the database. Here is my code
$tbl_header = '<style>
table {
border-collapse: collapse;
border-spacing: 0;
margin: 0 20px;
}
tr {
padding: 3px 0;
}
th {
background-color: #CCCCCC;
border: 1px solid #DDDDDD;
color: #333333;
font-family: trebuchet MS;
font-size: 30px;
padding-bottom: 4px;
padding-left: 6px;
padding-top: 5px;
text-align: left;
}
td {
border: 1px solid #CCCCCC;
font-size: 25px;
padding: 3px 7px 2px;
}
</style>
<table id="gallerytab" width="600" cellspacing="2" cellpadding="1" border="0">
<tr>
<th><font face="Arial, Helvetica, sans-serif">Products Title</font></th>
<th><font face="Arial, Helvetica, sans-serif">Product Specs</font></th>
<th><font face="Arial, Helvetica, sans-serif">Product Price</font></th>
<th><font face="Arial, Helvetica, sans-serif">Products Image</font></th>
</tr>';
$tbl_footer = '</table>';
$tbl = '';
while ($row_Pro_Record = mysql_fetch_assoc($Pro_Record)) {
$tbl .= '
<tr>
<td>'.$p_title.'</td>
<td>'.$p_size.'</td>
<td>'.$p_price.'</td>
<td><img width="120"src="http://localhost/product/images/'.$c_name.'/'.$p_image.'.jpg"></td>
</tr>
';
}
// output the HTML content
$pdf->writeHTML($tbl_header . $tbl . $tbl_footer, true, false, false, false, '');
It could be a small stupid detail that I am missing as my php/mysql skills aren't that great. Any help would be much appreciated, thanks in advance :)
Where is $p_title coming from ? $row_Pro_Record is the variable that contains your row data. So inside you table you should have something like
<td>'.$row_Pro_Record['title'].'</td>
where title is the name of the column, instead of
<td>'.$p_title.'</td>
have a read of the mysql_fetch_assoc docs it shows a nice example of looping over results :
while ($row = mysql_fetch_assoc($result)) {
echo $row["userid"];
echo $row["fullname"];
echo $row["userstatus"];
}

Categories