Monday 21 February 2022

Make Print Reports | Oracle APEX

--------Table

CREATE TABLE  "EMP" 

   ( "EMPNO" NUMBER(4,0) NOT NULL, 

"ENAME" VARCHAR2(50), 

"JOB" VARCHAR2(50), 

"MGR" NUMBER(4,0), 

"HIREDATE" DATE, 

"SAL" NUMBER(7,2), 

"COMM" NUMBER(7,2), 

"DEPTNO" NUMBER(2,0), 

"DESCRIPTION" VARCHAR2(100), 

CONSTRAINT "EMP_PK" PRIMARY KEY ("EMPNO")

   )

/


--------PL Content



Htp.p('<input type="button1" class="button button1"  class="t-Icon t-Icon--right fa fa-print" id="print" type="button" onclick="printdiv(''div_print1'');" value="Print"/><br/>

      <div id="div_print1" style="margin-top:5px;"> ');   


htp.p('

<style>

table, th, td{

    border: 1px solid black;

    border-collapse: collapse;

}

</style>

');


htp.p('<center>My Employee Reports</center>');


htp.p('<table style="width:100%"

<tr>

<th align="left">Emp No</th>

<th align="left">Emp Name</th>

<th align="right">MGR</th>

<th align="right">Salary</th>

</tr>

');


for x in (select EMPNO,ENAME,MGR,SAL FROM EMP)

loop

htp.p('

<tr>

<td>'||x.EMPNO||'</td>

<td>'||x.ENAME||'</td>

<td align="right">'||x.MGR||'</td>

<td align="right">'||x.SAL||'</td>

</tr>

');

end loop;


for x in (select sum(sal) sal from emp)

loop

htp.p('

<tr>

<td></td>

<td></td>

<td>Total</td>

<td align="right">'||x.sal||'</td>

</tr>

');

end loop;


htp.p('</table>');


htp.p('</div>');





--------Function and Global Variable Declaration


function printdiv(printpage)

{

var headstr = "<html><head><title></title></head><body>";

var footstr = "</body>";

var newstr = document.all.item(printpage).innerHTML;

var oldstr = document.body.innerHTML;

document.body.innerHTML = headstr+newstr+footstr;

window.print();

document.body.innerHTML = oldstr;

return false;

}




--------Inline


<style>

.button {

  border: none;

  color: white;

  padding: ;

  text-align: center;

  text-decoration: none;

  display: inline-block;

  font-size: ;

  margin: 4px 2px;

  transition-duration: 0.4s;

  cursor: pointer;

}


.button1 {

  background-color: white; 

  color: black; 

  border: 2px solid #4CAF50;

}


.button1:hover {

  background-color: #4CAF50;

  color: white;

}


.button2 {

  background-color: white; 

  color: black; 

  border: 2px solid #008CBA;

}


.button2:hover {

  background-color: #008CBA;

  color: white;

}


</style>