hi…
i have table and I put style overflow:auto
I just to happen is the <th> will be fix/ not move. only the <tr>
here is my code:
<div id="kanban_table" style="overflow:auto; height:215px;">
<table>
<th> JO No.</th>
<th> ETD </th>
<th> PO No. </th>
<th> SKU Code </th>
<th> Description </th>
<th> PO Req </th>
<th> Priority</th>
<?php
$sql = "SELECT FromMonth , ToMonth FROM so_month";
$res = mysql_query($sql, $con);
$row = mysql_fetch_assoc($res);
$FromMonth = $row['FromMonth'];
$ToMonth = $row['ToMonth'];
$sql = "SELECT ETD, PO_No, SKUCode, Description, POReq
FROM sales_order WHERE NOT EXISTS (SELECT PO_No FROM job_order WHERE job_order.PO_No = sales_order.PO_No) AND MONTH(ETD) BETWEEN '$FromMonth' AND '$ToMonth' ORDER BY ETD, PO_No ASC LIMIT 10 ";
$res_so = mysql_query($sql, $con);
while($row = mysql_fetch_assoc($res_so)){
echo "<form name='joborder_form' action='' method='post'>";
$PO_No = $row['PO_No'];
echo "<tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='$row[ETD]' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='$row[PO_No]' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='$row[SKUCode]' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='$row[Description]' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='$row[POReq]' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr>";
echo "</form>";
}
echo "</table>";
echo "</div>";
Thank you
PaulOB
April 28, 2012, 9:22am
2
Hi,
When you post code please post the processed code from View Source in the browser as this is not the php forum and we are only interested in the html and css.
I had a little trouble understanding what you want but it sounds like you want a fixed table header while the body scrolls.
This is actually not something that is easy to do in any manageable way within the same table unless you script it. I do have an old demo here but it relies on using a table foot element to keep the cells open at the right width. It is however not that customisable due to the method used and you need a good understanding of html and css to make it work.
We also had a quiz on this subjec t a couple of years ago that might help.
Hi,
When you post code please post the processed code from View Source in the browser as this is not the php forum and we are only interested in the html and css.
I had a little trouble understanding what you want but it sounds like you want a fixed table header while the body scrolls.
This is actually not something that is easy to do in any manageable way within the same table unless you script it. I do have an old demo here but it relies on using a table foot element to keep the cells open at the right width. It is however not that customisable due to the method used and you need a good understanding of html and css to make it work.
We also had a quiz on this subjec t a couple of years ago that might help.
Yes, only the body of table I want to scroll.and the header is fix.
Thank you
I tried this:
<?php
error_reporting(0);
date_default_timezone_set("Asia/Singapore"); //set the time zone
$con = mysql_connect('localhost', 'root','');
if (!$con) {
echo 'failed';
die();
}
mysql_select_db("mes", $con);
$Date_Shelve =date('Y-m-d H:i:s');
?>
<html>
<head>
<title>Job Order</title>
<link rel="stylesheet" type="text/css" href="kanban.css" />
<style type="text/css">
#SR_date{
position: relative;
font-family: Arial, Helvetica, sans-serif;
font-size: .9em;
margin-left: 10px;
margin-right: 770px;
width: auto;
height: auto;
float: left;
top : 10px;
}
#disp_btn{
position: relative;
font-family: Arial, Helvetica, sans-serif;
font-size: .8em;
margin-left: 0px;
top: 10px;
}
p {margin:0 0 1em}
table p {margin :0}
.wrap {
margin:20px 0 0;
width:96%;
float:left;
position:relative;
height:200px;
overflow:hidden;
padding:25px 0 0;
/*background:#fffccc;*/
border:1px solid #000;
}
.inner {
width:100%;
height:200px;
overflow:auto;
}
table {
margin: 10px;
font-family: Arial, Helvetica, sans-serif;
font-size: .9em;
border: 1px solid #DDD;
width: auto;
}
th {
font-family: Arial, Helvetica, sans-serif;
font-size: .7em;
background: #694;
color: #FFF;
padding: 2px 6px;
border-collapse: separate;
border: 1px solid #000;
}
td {
font-family: Arial, Helvetica, sans-serif;
font-size: .7em;
border: 1px solid #DDD;
text-align: left;
}
thead th {border:none;}
thead tr p {
position:absolute;
top:0;
}
</style>
</head>
<body>
<?php
$sql = "SELECT jo_number, ETD, PO_No, SKUCode, Description, POQty, Priority
FROM job_order ORDER BY jo_number, ETD";
$res_jo = mysql_query($sql,$con);
?>
<div class="wrap">
<div class="inner">
<table id="data" cellspacing="0" cellpadding="0">
<thead>
<tr>
<th> JO No.</th>
<th> ETD </th>
<th> PO No. </th>
<th> SKU Code </th>
<th> Description </th>
<th> PO Req </th>
<th> Priority</th>
</tr>
</thead>
<?php
$sql = "SELECT FromMonth , ToMonth FROM so_month";
$res = mysql_query($sql, $con);
$row = mysql_fetch_assoc($res);
$FromMonth = $row['FromMonth'];
$ToMonth = $row['ToMonth'];
$sql = "SELECT ETD, PO_No, SKUCode, Description, POReq
FROM sales_order WHERE NOT EXISTS (SELECT PO_No FROM job_order WHERE job_order.PO_No = sales_order.PO_No) AND MONTH(ETD) BETWEEN '$FromMonth' AND '$ToMonth' ORDER BY ETD, PO_No ASC LIMIT 10 ";
$res_so = mysql_query($sql, $con);
while($row = mysql_fetch_assoc($res_so)){
echo "<form name='joborder_form' action='' method='post'>";
$PO_No = $row['PO_No'];
echo "<tbody>";
echo "<tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='$row[ETD]' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='$row[PO_No]' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='$row[SKUCode]' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='$row[Description]' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='$row[POReq]' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr>";
echo "</form>";
}
echo "</tbody>";
echo "</table>";
echo "</div>";
echo "</div>" ;
?>
<div class="wrap">
<div class="inner">
<table id="data" cellspacing="0" cellpadding="0">
<?php
while($row_job = mysql_fetch_assoc($res_jo)){
echo "<tbody>";
echo "<tr>
<td><input type='text' name='JO_No_' id='JO_No_' value='$row_job[jo_number]' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='ETD_' id='ETD_' value='$row_job[ETD]' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='PO_No_' id='PO_No_' value='$row_job[PO_No]' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode_' id='SKUCode_' value='$row_job[SKUCode]' style='border:none;' size='15'></td>
<td><input type='text' name='Description_' id='Description_' value='$row_job[Description]' style='border:none;' size='35'></td>
<td><input type='text' name='POReq_' id='POReq_' value='$row_job[POQty]' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='priority_' value='$row_job[Priority]' id='priority_' style='border:none;width:auto;' size='10'></td>
</tr>" ;
}
echo "</tbody>";
echo "</table>";
echo "</div>" ;
echo "</div>";
?>
</body>
</html>
I add wrap and inner still te head did not fix and it was not displayed on the wrap part.
Thank you
PaulOB
April 29, 2012, 8:41am
5
Hi,
You still posted php
You also missed out the tfoot element and the p element in the thead.
Here’s a working example with your data.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Job Order</title>
<link rel="stylesheet" type="text/css" href="kanban.css" />
<style type="text/css">
p { margin:0 0 1em }
table p { margin :0 }
.wrap {
margin:20px 0 0;
float:left;
position:relative;
height:200px;
overflow:hidden;
padding:25px 0 0 0;
border:1px solid #ddd;
background:green;
}
.inner {
padding:0 18px 0 0;
height:200px;
overflow:auto;
}
table {
font-family: Arial, Helvetica, sans-serif;
font-size: .9em;
width: 100%;
margin:0 0 0 -1px;
background:#fff;
}
th {
font-size: .7em;
background: #694;
color: #FFF;
padding: 2px 6px;
border: 1px solid #000;
}
td {
font-size: .7em;
border: 1px solid #DDD;
text-align: left;
padding: 2px 6px;
}
tfoot th, thead th {
font-weight:bold;
text-align:center;
border:1px solid #ddd;
padding:0 3px 0 5px;
background:green;
}
thead th { border:none; }
thead tr p {
position:absolute;
top:5px;
}
</style>
</head>
<body>
<div class="wrap">
<div class="inner">
<table id="data" cellspacing="0" cellpadding="0">
<thead>
<tr>
<th><p>JO No.</p></th>
<th><p>ETD </p></th>
<th><p>PO No.</p></th>
<th><p>SKU Code</p></th>
<th><p> Description</p></th>
<th><p>PO Req</p></th>
<th><p>Priority</p></th>
</tr>
</thead>
<tfoot>
<tr>
<th> JO No.</th>
<th> ETD </th>
<th> PO No. </th>
<th> SKU Code </th>
<th> Description </th>
<th> PO Req </th>
<th> Priority</th>
</tr>
</tfoot>
<tbody>
<tr>
<td><input type='text' value='test' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='$row[ETD]' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='$row[PO_No]' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='$row[SKUCode]' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='$row[Description]' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='$row[POReq]' style='border:none;' size='10'></td>
<td class="last"><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr>
<tr>
<td><input type='text' value='test' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='$row[ETD]' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='$row[PO_No]' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='$row[SKUCode]' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='$row[Description]' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='$row[POReq]' style='border:none;' size='10'></td>
<td ><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr>
<tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='$row[ETD]' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='$row[PO_No]' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='$row[SKUCode]' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='$row[Description]' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='$row[POReq]' style='border:none;' size='10'></td>
<td class="last"><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr>
<tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='$row[ETD]' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='$row[PO_No]' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='$row[SKUCode]' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='$row[Description]' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='$row[POReq]' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr>
<tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='$row[ETD]' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='$row[PO_No]' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='$row[SKUCode]' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='$row[Description]' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='$row[POReq]' style='border:none;' size='10'></td>
<td class="last"><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr>
<tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='$row[ETD]' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='$row[PO_No]' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='$row[SKUCode]' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='$row[Description]' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='$row[POReq]' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr>
<tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='$row[ETD]' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='$row[PO_No]' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='$row[SKUCode]' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='$row[Description]' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='$row[POReq]' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr>
<tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='$row[ETD]' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='$row[PO_No]' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='$row[SKUCode]' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='$row[Description]' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='$row[POReq]' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr>
<tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='$row[ETD]' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='$row[PO_No]' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='$row[SKUCode]' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='$row[Description]' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='$row[POReq]' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr>
<tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='$row[ETD]' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='$row[PO_No]' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='$row[SKUCode]' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='$row[Description]' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='$row[POReq]' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr>
<tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='$row[ETD]' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='$row[PO_No]' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='$row[SKUCode]' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='$row[Description]' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='$row[POReq]' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr>
<tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='$row[ETD]' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='$row[PO_No]' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='$row[SKUCode]' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='$row[Description]' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='$row[POReq]' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr>
</tbody>
</table>
</div>
</div>
</body>
</html>
Of course you should make the CSS specific to that table only rather than global.
Sorry if I post it as php coz actually i code it in php.
i tried your suggested code, but still the <th> did not displayed on wrap.
here is my php code:
<?php
error_reporting(0);
date_default_timezone_set("Asia/Singapore"); //set the time zone
$con = mysql_connect('localhost', 'root','');
if (!$con) {
echo 'failed';
die();
}
mysql_select_db("mes", $con);
$Date_Shelve =date('Y-m-d H:i:s');
?>
<html>
<head>
<title>Job Order</title>
<link rel="stylesheet" type="text/css" href="kanban.css" />
<style type="text/css">
p { margin:0 0 1em }
table p { margin :0 }
.wrap {
margin:20px 0 0;
float:left;
position:relative;
height:200px;
overflow:hidden;
padding:25px 0 0 0;
border:1px solid #ddd;
width: auto;
/* background:green;*/
}
.inner {
padding:0 18px 0 0;
height:200px;
overflow:auto;
}
table {
font-family: Arial, Helvetica, sans-serif;
font-size: .9em;
width: auto;
margin:0 0 0 -1px;
background:#fff;
}
th {
font-size: .7em;
background: #694;
color: #FFF;
padding: 2px 6px;
border: 1px solid #000;
}
td {
font-size: .7em;
border: 1px solid #DDD;
text-align: left;
padding: 2px 4px;
}
tfoot th, thead th {
font-weight:bold;
text-align:center;
border:1px solid #ddd;
padding:0 3px 0 5px;
background:green;
}
thead th { border:none; }
thead tr p {
position:absolute;
top:5px;
}
</style>
</head>
<body>
<?php
$sql = "SELECT jo_number, ETD, PO_No, SKUCode, Description, POQty, Priority
FROM job_order ORDER BY jo_number, ETD";
$res_jo = mysql_query($sql,$con);
?>
<div class="wrap">
<div class="inner">
<table id="data" cellspacing="0" cellpadding="0">
<thead>
<tr>
<th><p>JO No.</p></th>
<th><p>ETD </p></th>
<th><p>PO No.</p></th>
<th><p>SKU Code</p></th>
<th><p> Description</p></th>
<th><p>PO Req</p></th>
<th><p>Priority</p></th>
</tr>
</thead>
<tfoot>
<tr>
<th> JO No.</th>
<th> ETD </th>
<th> PO No. </th>
<th> SKU Code </th>
<th> Description </th>
<th> PO Req </th>
<th> Priority</th>
</tr>
</tfoot>
<?php
$sql = "SELECT FromMonth , ToMonth FROM so_month";
$res = mysql_query($sql, $con);
$row = mysql_fetch_assoc($res);
$FromMonth = $row['FromMonth'];
$ToMonth = $row['ToMonth'];
$sql = "SELECT ETD, PO_No, SKUCode, Description, POReq
FROM sales_order WHERE NOT EXISTS (SELECT PO_No FROM job_order WHERE job_order.PO_No = sales_order.PO_No) AND MONTH(ETD) BETWEEN '$FromMonth' AND '$ToMonth' ORDER BY ETD, PO_No ASC LIMIT 10 ";
$res_so = mysql_query($sql, $con);
while($row = mysql_fetch_assoc($res_so)){
echo "<form name='joborder_form' action='' method='post'>";
$PO_No = $row['PO_No'];
echo "<tbody>";
echo "<tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='$row[ETD]' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='$row[PO_No]' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='$row[SKUCode]' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='$row[Description]' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='$row[POReq]' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr>";
echo "</form>";
}
echo "</tbody>";
echo "</table>";
echo "</div>";
echo "</div>" ;
?>
<div class="wrap">
<div class="inner">
<table id="data" cellspacing="0" cellpadding="0">
<?php
while($row_job = mysql_fetch_assoc($res_jo)){
echo "<tbody>";
echo "<tr>
<td><input type='text' name='JO_No_' id='JO_No_' value='$row_job[jo_number]' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='ETD_' id='ETD_' value='$row_job[ETD]' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='PO_No_' id='PO_No_' value='$row_job[PO_No]' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode_' id='SKUCode_' value='$row_job[SKUCode]' style='border:none;' size='15'></td>
<td><input type='text' name='Description_' id='Description_' value='$row_job[Description]' style='border:none;' size='35'></td>
<td><input type='text' name='POReq_' id='POReq_' value='$row_job[POQty]' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='priority_' value='$row_job[Priority]' id='priority_' style='border:none;width:auto;' size='10'></td>
</tr>" ;
}
echo "</tbody>";
echo "</table>";
echo "</div>" ;
echo "</div>";
?>
<div id="disp_btn">
<input type="button" name="print" value="display" onclick="disp()">
</div>
</body>
</html>
here is the code from view source:
<html>
<head>
<title>Job Order</title>
<link rel="stylesheet" type="text/css" href="kanban.css" />
<style type="text/css">
#SR_date{
position: relative;
font-family: Arial, Helvetica, sans-serif;
font-size: .9em;
margin-left: 10px;
margin-right: 770px;
width: auto;
height: auto;
float: left;
top : 10px;
}
#disp_btn{
position: relative;
font-family: Arial, Helvetica, sans-serif;
font-size: .8em;
margin-left: 0px;
top: 10px;
}
p { margin:0 0 1em }
table p { margin :0 }
.wrap {
margin:20px 0 0;
float:left;
position:relative;
height:200px;
overflow:hidden;
padding:25px 0 0 0;
border:1px solid #ddd;
width: auto;
/* background:green;*/
}
.inner {
padding:0 18px 0 0;
height:200px;
overflow:auto;
}
table {
font-family: Arial, Helvetica, sans-serif;
font-size: .9em;
width: auto;
margin:0 0 0 -1px;
background:#fff;
}
th {
font-size: .7em;
background: #694;
color: #FFF;
padding: 2px 6px;
border: 1px solid #000;
}
td {
font-size: .7em;
border: 1px solid #DDD;
text-align: left;
padding: 2px 4px;
}
tfoot th, thead th {
font-weight:bold;
text-align:center;
border:1px solid #ddd;
padding:0 3px 0 5px;
background:green;
}
thead th { border:none; }
thead tr p {
position:absolute;
top:5px;
}
</style>
<div class="wrap">
<div class="inner">
<table id="data" cellspacing="0" cellpadding="0">
<thead>
<tr>
<th><p>JO No.</p></th>
<th><p>ETD </p></th>
<th><p>PO No.</p></th>
<th><p>SKU Code</p></th>
<th><p> Description</p></th>
<th><p>PO Req</p></th>
<th><p>Priority</p></th>
</tr>
</thead>
<tfoot>
<tr>
<th> JO No.</th>
<th> ETD </th>
<th> PO No. </th>
<th> SKU Code </th>
<th> Description </th>
<th> PO Req </th>
<th> Priority</th>
</tr>
</tfoot>
<form name='joborder_form' action='' method='post'><tbody><tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='2012-05-04' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='WHPO17158' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='602030' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='D TB PADEL 3PET' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='7560.00' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr></form><form name='joborder_form' action='' method='post'><tbody><tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='2012-05-07' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='WHPO16544/ 083064/104' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='745140/13NEW' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='D TB CLUB 3PET' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='1662.00' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr></form><form name='joborder_form' action='' method='post'><tbody><tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='2012-05-07' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='WHPO16544/ 083064/104' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='745139/13NEW' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='S TB SOLO SDI 3PET Blue-Yellow/Orange/Green' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='1482.00' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr></form><form name='joborder_form' action='' method='post'><tbody><tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='2012-05-07' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='WHPO16544/ 083064/104' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='772000/99' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='D SB MAX 3BBL B06 SWI' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='336.00' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr></form><form name='joborder_form' action='' method='post'><tbody><tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='2012-05-07' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='WHPO16544/ 083064/104' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='772000/98' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='D SB PROGRESS 3BBL SDI' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='372.00' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr></form><form name='joborder_form' action='' method='post'><tbody><tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='2012-05-07' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='WHPO16544/ 083064/104' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='772000/95' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='D SB COMP 3BBL B06 SWI' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='456.00' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr></form><form name='joborder_form' action='' method='post'><tbody><tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='2012-05-07' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='WHPO16544/ 083064/104' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='772000/90' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='D SB PRO 3BBL B06 SWI' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='1566.00' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr></form><form name='joborder_form' action='' method='post'><tbody><tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='2012-05-07' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='WHPO16544/ 083064/104' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='745141/12' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='S TB MINI ORANGE 3PET' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='102.00' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr></form><form name='joborder_form' action='' method='post'><tbody><tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='2012-05-07' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='WHPO16544/ 083064/104' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='735031/92' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='D SB PROGRESS SGLBX SDI' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='24.00' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr></form><form name='joborder_form' action='' method='post'><tbody><tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='2012-05-07' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='WHPO16544/ 083064/104' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='735030/91' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='D SB COMP SGLBX SDI' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='192.00' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr></form></tbody></table></div></div>
<div class="wrap">
<div class="inner">
<table id="data" cellspacing="0" cellpadding="0">
<!--echo "<table>";-->
<tbody><tr>
<td><input type='text' name='JO_No_' id='JO_No_' value='120429001' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='ETD_' id='ETD_' value='2012-05-01' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='PO_No_' id='PO_No_' value='D02241233/TGT PO#0088-5078129-0581' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode_' id='SKUCode_' value='603107US' style='border:none;' size='15'></td>
<td><input type='text' name='Description_' id='Description_' value='D TB PRACTICE 3PET NEW' style='border:none;' size='35'></td>
<td><input type='text' name='POReq_' id='POReq_' value='10800.00' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='priority_' value='Approved' id='priority_' style='border:none;width:auto;' size='10'></td>
</tr><tbody><tr>
<td><input type='text' name='JO_No_' id='JO_No_' value='120429002' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='ETD_' id='ETD_' value='2012-05-01' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='PO_No_' id='PO_No_' value='D10221121' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode_' id='SKUCode_' value='603107US' style='border:none;' size='15'></td>
<td><input type='text' name='Description_' id='Description_' value='D TB PRACTICE 3PET NEW' style='border:none;' size='35'></td>
<td><input type='text' name='POReq_' id='POReq_' value='1332.00' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='priority_' value='Approved' id='priority_' style='border:none;width:auto;' size='10'></td>
</tr><tbody><tr>
<td><input type='text' name='JO_No_' id='JO_No_' value='120429003' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='ETD_' id='ETD_' value='2012-05-01' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='PO_No_' id='PO_No_' value='D11121124' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode_' id='SKUCode_' value='603107US' style='border:none;' size='15'></td>
<td><input type='text' name='Description_' id='Description_' value='D TB PRACTICE 3PET NEW' style='border:none;' size='35'></td>
<td><input type='text' name='POReq_' id='POReq_' value='2082.00' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='priority_' value='Approved' id='priority_' style='border:none;width:auto;' size='10'></td>
</tr><tbody><tr>
<td><input type='text' name='JO_No_' id='JO_No_' value='120429004' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='ETD_' id='ETD_' value='2012-05-02' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='PO_No_' id='PO_No_' value='MF12015' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode_' id='SKUCode_' value='605040' style='border:none;' size='15'></td>
<td><input type='text' name='Description_' id='Description_' value='D TB COACHING MED 5DZ PG' style='border:none;' size='35'></td>
<td><input type='text' name='POReq_' id='POReq_' value='3000.00' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='priority_' value='Approved' id='priority_' style='border:none;width:auto;' size='10'></td>
</tr><tbody><tr>
<td><input type='text' name='JO_No_' id='JO_No_' value='120429004' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='ETD_' id='ETD_' value='2012-05-02' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='PO_No_' id='PO_No_' value='MF12022' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode_' id='SKUCode_' value='602135' style='border:none;' size='15'></td>
<td><input type='text' name='Description_' id='Description_' value='D TB FORT ALLCOURT 3TIN' style='border:none;' size='35'></td>
<td><input type='text' name='POReq_' id='POReq_' value='5400.00' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='priority_' value='Approved' id='priority_' style='border:none;width:auto;' size='10'></td>
</tr><tbody><tr>
<td><input type='text' name='JO_No_' id='JO_No_' value='120429005' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='ETD_' id='ETD_' value='2012-05-02' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='PO_No_' id='PO_No_' value='MF12025' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode_' id='SKUCode_' value='601137' style='border:none;' size='15'></td>
<td><input type='text' name='Description_' id='Description_' value='D TB FORT ELITE 3TIN' style='border:none;' size='35'></td>
<td><input type='text' name='POReq_' id='POReq_' value='3600.00' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='priority_' value='Approved' id='priority_' style='border:none;width:auto;' size='10'></td>
</tr><tbody><tr>
<td><input type='text' name='JO_No_' id='JO_No_' value='120429006' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='ETD_' id='ETD_' value='2012-05-03' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='PO_No_' id='PO_No_' value='MF12020' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode_' id='SKUCode_' value='340854' style='border:none;' size='15'></td>
<td><input type='text' name='Description_' id='Description_' value='S TB WIMB UV HYDRA 3TIN' style='border:none;' size='35'></td>
<td><input type='text' name='POReq_' id='POReq_' value='1800.00' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='priority_' value='Approved' id='priority_' style='border:none;width:auto;' size='10'></td>
</tr><tbody><tr>
<td><input type='text' name='JO_No_' id='JO_No_' value='120429007' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='ETD_' id='ETD_' value='2012-05-04' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='PO_No_' id='PO_No_' value='WHPO17130' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode_' id='SKUCode_' value='602134' style='border:none;' size='15'></td>
<td><input type='text' name='Description_' id='Description_' value='D TB FORT ALLCOURT 4TIN' style='border:none;' size='35'></td>
<td><input type='text' name='POReq_' id='POReq_' value='10080.00' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='priority_' value='Approved' id='priority_' style='border:none;width:auto;' size='10'></td>
</tr><tbody><tr>
<td><input type='text' name='JO_No_' id='JO_No_' value='120429008' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='ETD_' id='ETD_' value='2012-05-07' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='PO_No_' id='PO_No_' value='WHPO16476/ 082112/109' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode_' id='SKUCode_' value='745137/13' style='border:none;' size='15'></td>
<td><input type='text' name='Description_' id='Description_' value='TB MIXED LOOSE BALL 5DZ' style='border:none;' size='35'></td>
<td><input type='text' name='POReq_' id='POReq_' value='4575.00' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='priority_' value='Approved' id='priority_' style='border:none;width:auto;' size='10'></td>
</tr><tbody><tr>
<td><input type='text' name='JO_No_' id='JO_No_' value='120429009' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='ETD_' id='ETD_' value='2012-05-07' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='PO_No_' id='PO_No_' value='WHPO16458/ 082106/107' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode_' id='SKUCode_' value='745145/13' style='border:none;' size='15'></td>
<td><input type='text' name='Description_' id='Description_' value='D TB FORT ALL COURT 3X4TIN' style='border:none;' size='35'></td>
<td><input type='text' name='POReq_' id='POReq_' value='3840.00' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='priority_' value='Approved' id='priority_' style='border:none;width:auto;' size='10'></td>
</tr></tbody></table></div></div><div id="disp_btn">
<input type="button" name="print" value="display" onclick="disp()">
</div>
</body>
</html>
Thank you
PaulOB
April 30, 2012, 8:16am
8
Hi,
The first table in your page is working fine except that you removed the background from the wrap so all you see on the header is white text on a white background. Re-instate the colour that I had in place.
.wrap {
margin:20px 0 0;
float:left;
position:relative;
height:200px;
overflow:hidden;
padding:25px 0 0 0;
border:1px solid #ddd;
width: auto;
[B] background:green;[/B]
}
The table has a white background so all you get is the green header. Use whatever colour you want or just have black text instead.
You can’t place a form element here:
</tfoot>
<form name='joborder_form' action='' method='post'>
<tbody>
Nothing can come inside the table tags (apart from caption). All content must be inside the th or td tags. The form opening and closing tags should be outside the whole table.
Don’t forget to use a full doctype as in my example.
Just copy and paste my code and you will see that it does work.
i tried this:
<?php
error_reporting(0);
date_default_timezone_set("Asia/Singapore"); //set the time zone
$con = mysql_connect('localhost', 'root','');
if (!$con) {
echo 'failed';
die();
}
mysql_select_db("mes", $con);
$Date_Shelve =date('Y-m-d H:i:s');
?>
<html>
<head>
<title>Job Order</title>
<link rel="stylesheet" type="text/css" href="kanban.css" />
<style type="text/css">
#SR_date{
position: relative;
font-family: Arial, Helvetica, sans-serif;
font-size: .9em;
margin-left: 10px;
margin-right: 770px;
width: auto;
height: auto;
float: left;
top : 10px;
}
#disp_btn{
position: relative;
font-family: Arial, Helvetica, sans-serif;
font-size: .8em;
margin-left: 0px;
top: 10px;
}
p { margin:0 0 1em }
table p { margin :0 }
.wrap {
margin:20px 0 0;
float:left;
position:relative;
height:200px;
overflow:hidden;
padding:25px 0 0 0;
border:1px solid #ddd;
width: auto;
background:green;
font-style: normal;
color: gray;
}
.inner {
padding:0 18px 0 0;
height:200px;
overflow:auto;
}
table {
font-family: Arial, Helvetica, sans-serif;
font-size: .9em;
width: auto;
margin:0 0 0 -1px;
background:#fff;
}
th {
font-size: .7em;
background: #694;
color: white;
padding: 2px 6px;
border: 1px solid #000;
}
td {
font-size: .7em;
border: 1px solid #DDD;
text-align: left;
padding: 2px 4px;
}
tfoot th, thead th {
font-weight:bold;
text-align:center;
border:1px solid #ddd;
padding:0 3px 0 5px;
background:green;
}
thead th { border:none; }
thead tr p {
position:absolute;
top:5px;
}
</style>
</head>
<body>
<?php
$sql = "SELECT jo_number, ETD, PO_No, SKUCode, Description, POQty, Priority
FROM job_order ORDER BY jo_number, ETD";
$res_jo = mysql_query($sql,$con);
?>
<!--<div id="kanban_table" style="overflow:auto; height:215px;"> -->
<div class="wrap">
<div class="inner">
<table id="data" cellspacing="0" cellpadding="0">
<thead>
<tr>
<th><p>JO No.</p></th>
<th><p>ETD </p></th>
<th><p>PO No.</p></th>
<th><p>SKU Code</p></th>
<th><p> Description</p></th>
<th><p>PO Req</p></th>
<th><p>Priority</p></th>
</tr>
</thead>
<tfoot>
<tr>
<th> JO No.</th>
<th> ETD </th>
<th> PO No. </th>
<th> SKU Code </th>
<th> Description </th>
<th> PO Req </th>
<th> Priority</th>
</tr>
</tfoot>
<?php
$sql = "SELECT FromMonth , ToMonth FROM so_month";
$res = mysql_query($sql, $con);
$row = mysql_fetch_assoc($res);
$FromMonth = $row['FromMonth'];
$ToMonth = $row['ToMonth'];
$sql = "SELECT ETD, PO_No, SKUCode, Description, POReq
FROM sales_order WHERE NOT EXISTS (SELECT PO_No FROM job_order WHERE job_order.PO_No = sales_order.PO_No) AND MONTH(ETD) BETWEEN '$FromMonth' AND '$ToMonth' ORDER BY ETD, PO_No ASC LIMIT 10 ";
$res_so = mysql_query($sql, $con);
while($row = mysql_fetch_assoc($res_so)){
echo "<form name='joborder_form' action='' method='post'>";
$PO_No = $row['PO_No'];
echo "<tbody>";
echo "<tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='$row[ETD]' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='$row[PO_No]' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='$row[SKUCode]' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='$row[Description]' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='$row[POReq]' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr>";
}
echo "</tbody>";
echo "</table>";
echo "</form>";
echo "</div>";
echo "</div>" ;
?>
<!--echo "<div style='overflow:auto; height:215px;'>";-->
<div class="wrap">
<div class="inner">
<table id="data" cellspacing="0" cellpadding="0">
<!--echo "<table>";-->
<?php
while($row_job = mysql_fetch_assoc($res_jo)){
echo "<tbody>";
echo "<tr>
<td><input type='text' name='JO_No_' id='JO_No_' value='$row_job[jo_number]' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='ETD_' id='ETD_' value='$row_job[ETD]' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='PO_No_' id='PO_No_' value='$row_job[PO_No]' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode_' id='SKUCode_' value='$row_job[SKUCode]' style='border:none;' size='15'></td>
<td><input type='text' name='Description_' id='Description_' value='$row_job[Description]' style='border:none;' size='35'></td>
<td><input type='text' name='POReq_' id='POReq_' value='$row_job[POQty]' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='priority_' value='$row_job[Priority]' id='priority_' style='border:none;width:auto;' size='10'></td>
</tr>" ;
}
echo "</tbody>";
echo "</table>";
echo "</div>" ;
echo "</div>";
?>
</body>
</html>
and i attach the output
Thank you
code from view source:
<html>
<head>
<title>Job Order</title>
<link rel="stylesheet" type="text/css" href="kanban.css" />
<style type="text/css">
#SR_date{
position: relative;
font-family: Arial, Helvetica, sans-serif;
font-size: .9em;
margin-left: 10px;
margin-right: 770px;
width: auto;
height: auto;
float: left;
top : 10px;
}
#disp_btn{
position: relative;
font-family: Arial, Helvetica, sans-serif;
font-size: .8em;
margin-left: 0px;
top: 10px;
}
p { margin:0 0 1em }
table p { margin :0 }
.wrap {
margin:20px 0 0;
float:left;
position:relative;
height:200px;
overflow:hidden;
padding:25px 0 0 0;
border:1px solid #ddd;
width: auto;
background:green;
font-style: normal;
color: gray;
}
.inner {
padding:0 18px 0 0;
height:200px;
overflow:auto;
}
table {
font-family: Arial, Helvetica, sans-serif;
font-size: .9em;
width: auto;
margin:0 0 0 -1px;
background:#fff;
}
th {
font-size: .7em;
background: #694;
color: white;
padding: 2px 6px;
border: 1px solid #000;
}
td {
font-size: .7em;
border: 1px solid #DDD;
text-align: left;
padding: 2px 4px;
}
tfoot th, thead th {
font-weight:bold;
text-align:center;
border:1px solid #ddd;
padding:0 3px 0 5px;
background:green;
}
thead th { border:none; }
thead tr p {
position:absolute;
top:5px;
}
</style>
<div class="wrap">
<div class="inner">
<table id="data" cellspacing="0" cellpadding="0">
<thead>
<tr>
<th><p>JO No.</p></th>
<th><p>ETD </p></th>
<th><p>PO No.</p></th>
<th><p>SKU Code</p></th>
<th><p> Description</p></th>
<th><p>PO Req</p></th>
<th><p>Priority</p></th>
</tr>
</thead>
<tfoot>
<tr>
<th> JO No.</th>
<th> ETD </th>
<th> PO No. </th>
<th> SKU Code </th>
<th> Description </th>
<th> PO Req </th>
<th> Priority</th>
</tr>
</tfoot>
<!--<table>
<th> JO No.</th>
<th> ETD </th>
<th> PO No. </th>
<th> SKU Code </th>
<th> Description </th>
<th> PO Req </th>
<th> Priority</th>-->
<form name='joborder_form' action='' method='post'><tbody><tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='2012-05-04' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='WHPO17158' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='602030' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='D TB PADEL 3PET' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='7560.00' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr><form name='joborder_form' action='' method='post'><tbody><tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='2012-05-07' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='WHPO16544/ 083064/104' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='745140/13NEW' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='D TB CLUB 3PET' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='1662.00' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr><form name='joborder_form' action='' method='post'><tbody><tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='2012-05-07' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='WHPO16544/ 083064/104' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='745139/13NEW' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='S TB SOLO SDI 3PET Blue-Yellow/Orange/Green' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='1482.00' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr><form name='joborder_form' action='' method='post'><tbody><tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='2012-05-07' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='WHPO16544/ 083064/104' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='772000/99' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='D SB MAX 3BBL B06 SWI' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='336.00' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr><form name='joborder_form' action='' method='post'><tbody><tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='2012-05-07' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='WHPO16544/ 083064/104' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='772000/98' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='D SB PROGRESS 3BBL SDI' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='372.00' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr><form name='joborder_form' action='' method='post'><tbody><tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='2012-05-07' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='WHPO16544/ 083064/104' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='772000/95' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='D SB COMP 3BBL B06 SWI' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='456.00' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr><form name='joborder_form' action='' method='post'><tbody><tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='2012-05-07' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='WHPO16544/ 083064/104' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='772000/90' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='D SB PRO 3BBL B06 SWI' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='1566.00' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr><form name='joborder_form' action='' method='post'><tbody><tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='2012-05-07' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='WHPO16544/ 083064/104' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='745141/12' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='S TB MINI ORANGE 3PET' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='102.00' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr><form name='joborder_form' action='' method='post'><tbody><tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='2012-05-07' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='WHPO16544/ 083064/104' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='735031/92' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='D SB PROGRESS SGLBX SDI' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='24.00' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr><form name='joborder_form' action='' method='post'><tbody><tr>
<td><input type='text' value='' style='border:none;' size='10'></td>
<td><input type='text' name='ETD' id='ETD' value='2012-05-07' style='border:none;' size='10'></td>
<td><input type='text' name='PO_No' id='PO_No' value='WHPO16544/ 083064/104' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode' id='SKUCode' value='735030/91' style='border:none;' size='15'></td>
<td><input type='text' name='Description' id='Description' value='D SB COMP SGLBX SDI' style='border:none;' size='35'></td>
<td><input type='text' name='POReq' id='POReq' value='192.00' style='border:none;' size='10'></td>
<td><input type='submit' name='priority' value='Approved' id='priority'></td>
</tr></tbody></table></form></div></div>
<!--echo "<div style='overflow:auto; height:215px;'>";-->
<div class="wrap">
<div class="inner">
<table id="data" cellspacing="0" cellpadding="0">
<!--echo "<table>";-->
<tbody><tr>
<td><input type='text' name='JO_No_' id='JO_No_' value='120429001' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='ETD_' id='ETD_' value='2012-05-01' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='PO_No_' id='PO_No_' value='D02241233/TGT PO#0088-5078129-0581' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode_' id='SKUCode_' value='603107US' style='border:none;' size='15'></td>
<td><input type='text' name='Description_' id='Description_' value='D TB PRACTICE 3PET NEW' style='border:none;' size='35'></td>
<td><input type='text' name='POReq_' id='POReq_' value='10800.00' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='priority_' value='Approved' id='priority_' style='border:none;width:auto;' size='10'></td>
</tr><tbody><tr>
<td><input type='text' name='JO_No_' id='JO_No_' value='120429002' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='ETD_' id='ETD_' value='2012-05-01' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='PO_No_' id='PO_No_' value='D10221121' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode_' id='SKUCode_' value='603107US' style='border:none;' size='15'></td>
<td><input type='text' name='Description_' id='Description_' value='D TB PRACTICE 3PET NEW' style='border:none;' size='35'></td>
<td><input type='text' name='POReq_' id='POReq_' value='1332.00' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='priority_' value='Approved' id='priority_' style='border:none;width:auto;' size='10'></td>
</tr><tbody><tr>
<td><input type='text' name='JO_No_' id='JO_No_' value='120429003' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='ETD_' id='ETD_' value='2012-05-01' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='PO_No_' id='PO_No_' value='D11121124' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode_' id='SKUCode_' value='603107US' style='border:none;' size='15'></td>
<td><input type='text' name='Description_' id='Description_' value='D TB PRACTICE 3PET NEW' style='border:none;' size='35'></td>
<td><input type='text' name='POReq_' id='POReq_' value='2082.00' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='priority_' value='Approved' id='priority_' style='border:none;width:auto;' size='10'></td>
</tr><tbody><tr>
<td><input type='text' name='JO_No_' id='JO_No_' value='120429004' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='ETD_' id='ETD_' value='2012-05-02' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='PO_No_' id='PO_No_' value='MF12015' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode_' id='SKUCode_' value='605040' style='border:none;' size='15'></td>
<td><input type='text' name='Description_' id='Description_' value='D TB COACHING MED 5DZ PG' style='border:none;' size='35'></td>
<td><input type='text' name='POReq_' id='POReq_' value='3000.00' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='priority_' value='Approved' id='priority_' style='border:none;width:auto;' size='10'></td>
</tr><tbody><tr>
<td><input type='text' name='JO_No_' id='JO_No_' value='120429004' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='ETD_' id='ETD_' value='2012-05-02' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='PO_No_' id='PO_No_' value='MF12022' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode_' id='SKUCode_' value='602135' style='border:none;' size='15'></td>
<td><input type='text' name='Description_' id='Description_' value='D TB FORT ALLCOURT 3TIN' style='border:none;' size='35'></td>
<td><input type='text' name='POReq_' id='POReq_' value='5400.00' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='priority_' value='Approved' id='priority_' style='border:none;width:auto;' size='10'></td>
</tr><tbody><tr>
<td><input type='text' name='JO_No_' id='JO_No_' value='120429005' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='ETD_' id='ETD_' value='2012-05-02' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='PO_No_' id='PO_No_' value='MF12025' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode_' id='SKUCode_' value='601137' style='border:none;' size='15'></td>
<td><input type='text' name='Description_' id='Description_' value='D TB FORT ELITE 3TIN' style='border:none;' size='35'></td>
<td><input type='text' name='POReq_' id='POReq_' value='3600.00' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='priority_' value='Approved' id='priority_' style='border:none;width:auto;' size='10'></td>
</tr><tbody><tr>
<td><input type='text' name='JO_No_' id='JO_No_' value='120429006' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='ETD_' id='ETD_' value='2012-05-03' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='PO_No_' id='PO_No_' value='MF12020' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode_' id='SKUCode_' value='340854' style='border:none;' size='15'></td>
<td><input type='text' name='Description_' id='Description_' value='S TB WIMB UV HYDRA 3TIN' style='border:none;' size='35'></td>
<td><input type='text' name='POReq_' id='POReq_' value='1800.00' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='priority_' value='Approved' id='priority_' style='border:none;width:auto;' size='10'></td>
</tr><tbody><tr>
<td><input type='text' name='JO_No_' id='JO_No_' value='120429007' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='ETD_' id='ETD_' value='2012-05-04' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='PO_No_' id='PO_No_' value='WHPO17130' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode_' id='SKUCode_' value='602134' style='border:none;' size='15'></td>
<td><input type='text' name='Description_' id='Description_' value='D TB FORT ALLCOURT 4TIN' style='border:none;' size='35'></td>
<td><input type='text' name='POReq_' id='POReq_' value='10080.00' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='priority_' value='Approved' id='priority_' style='border:none;width:auto;' size='10'></td>
</tr><tbody><tr>
<td><input type='text' name='JO_No_' id='JO_No_' value='120429008' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='ETD_' id='ETD_' value='2012-05-07' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='PO_No_' id='PO_No_' value='WHPO16476/ 082112/109' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode_' id='SKUCode_' value='745137/13' style='border:none;' size='15'></td>
<td><input type='text' name='Description_' id='Description_' value='TB MIXED LOOSE BALL 5DZ' style='border:none;' size='35'></td>
<td><input type='text' name='POReq_' id='POReq_' value='4575.00' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='priority_' value='Approved' id='priority_' style='border:none;width:auto;' size='10'></td>
</tr><tbody><tr>
<td><input type='text' name='JO_No_' id='JO_No_' value='120429009' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='ETD_' id='ETD_' value='2012-05-07' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='PO_No_' id='PO_No_' value='WHPO16458/ 082106/107' style='border:none;' size='30'></td>
<td><input type='text' name='SKUCode_' id='SKUCode_' value='745145/13' style='border:none;' size='15'></td>
<td><input type='text' name='Description_' id='Description_' value='D TB FORT ALL COURT 3X4TIN' style='border:none;' size='35'></td>
<td><input type='text' name='POReq_' id='POReq_' value='3840.00' style='border:none;width:auto;' size='10'></td>
<td><input type='text' name='priority_' value='Approved' id='priority_' style='border:none;width:auto;' size='10'></td>
</tr></tbody></table></div></div><div id="disp_btn">
<input type="button" name="print" value="display" onclick="disp()">
</div>
</body>
</html>
PaulOB
April 30, 2012, 9:19am
11
newphpcoder:
code from view source:
Just copy and paste the exact code you gave me above and test it in a browser. You can see that the code is actually working ok (apart form the second table because as I mentioned before you don’t have a thead or tfoot section in that table).
Here’s a screenshot showing it working:
There must be a conflict in some other section of your code or the code you posted above is not the exact live version.
Do you have a link to a live version - If not you may have to put up a demo online so we can debug further.
