<!DOCTYPE html>
<html>
<head>
    <title>SMV Productivity</title>
<meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\">
<script language="javascript" type="text/javascript" src="js/jquery.js"></script>
 <script src="js/jquery-ui.js"></script>
 <link rel="stylesheet" href="js/jquery-ui.css">
 <link rel="stylesheet" type="text/css" href="css/tablestyle.css">
 <?php
$today2 = date("Y.m.d");
 ?>
<script type="text/javascript">    
   $(function() {
        ajaxLoadData();
    $( "#StartDate" ).datepicker({
        dateFormat : 'yy.mm.dd',
        maxDate: '0',
        defaultDate: '<?=$today2?>',
        onSelect: function() {   
  ajaxLoadData();
    },
    onClose: function( selectedDate ) {
	$( "#EndDate" ).datepicker( "option", "minDate", selectedDate );
			}
    });
        $( "#EndDate" ).datepicker({
        dateFormat : 'yy.mm.dd',
        maxDate: '0',
        defaultDate: '<?=$today2?>',
        onSelect: function() {   
        ajaxLoadData();
    },
    onClose: function( selectedDate ) {
	$( "#StartDate" ).datepicker( "option", "maxDate", selectedDate );
			}
    });  
    });  
function ajaxLoadData () {
          $.ajax({
                type: "POST",
                url: "orderpending_prc.php",
                cache : false,
                dataType: "html",
                data: { "StartDate": $("#StartDate").val(),"EndDate": $("#EndDate").val(), "Section": "1" },
                success: (function(data){
                   if( data.indexOf("<tr>") !=-1){
                    $("#Section1").html(data);   
                   }
                    })
            });
}
function launchIntoFullscreen(element) {
  if(element.requestFullscreen) {
    element.requestFullscreen();
  } else if(element.mozRequestFullScreen) {
    element.mozRequestFullScreen();
  } else if(element.webkitRequestFullscreen) {
    element.webkitRequestFullscreen();
  } else if(element.msRequestFullscreen) {
    element.msRequestFullscreen();
  }
}
function exitFullscreen() {
  if(document.exitFullscreen) {
    document.exitFullscreen();
  } else if(document.mozCancelFullScreen) {
    document.mozCancelFullScreen();
  } else if(document.webkitExitFullscreen) {
    document.webkitExitFullscreen();
  }
}	      
        </script>

</head>
<body>
<table class="demo-table">
		<caption class="title">Table 1. Sales Data of Electronics Division</caption>
		<thead>
			<tr>
				<th>Program</th>
				<th>Pding</th>
				<th>FG Bal</th>
				<th>Pac</th>
                                
				<th>Plan</th>
                                <th>Target</th>
                                
                                <th>WH</th>
                                <th>Wax</th>
                                <th>S Wax</th>
                                <th>Cas</th>
                                
                                <th>Fil</th>
                                <th>MP</th>
                                <th>Sol</th>
                                <th>C Sol</th>
                                <th>Qc Sol</th>
                                <th>Res</th>
                                <th>Mec</th>
                                <th>Reset</th>
                                <th>Set</th>
                                <th>S Set</th>
                                
                                <th>HP</th>
                                <th>Qc Hp</th>
                                <th>R Qc Hp</th>
                                <th>Pla</th>
                                <th>Qc Pla</th>
                                <th>Fp</th>
                                <th>Glue</th>
                                <th>2Tone</th>
                                <th>Enamel</th>
                                <th>Qce</th>
                                <th>R Qce</th>

                                <th>Total W</th>
                                <th>W-master</th>
                                <th>St</th>
                                <th>Cpn</th>
                                <th>st_cp</th>
			</tr>
		</thead>
                <tbody id="Section1">
		
		</tbody>
		<tfoot>
			<tr>
				<th colspan="4">Total</th>
				<th>1040</th>
			</tr>
		</tfoot>
	</table>


              
</body>
</html>