sábado, 17 de enero de 2015

Using JavaScript to print a PeopleSoft Page

When working with Peoplesoft more than once we need/want to print the page we are working with.

Unfortunately, until a few time ago, I only knew one way to do that: printing the page throug the web Browser option.
But this method adds the navigation bar and menu to the printing page. I think these things are, at least, unnecesary.

With some simple steps we will see a new way of printing the page content, and avoid showing those unwanted sectors.

Let's have a practical example:

1) We have the Purchase Order page we have seen in the previous blog.



2) We will add an HTML area, based on a LONG type field.



3) We also add a push button to print the page. In this case, we will change some usual options.



This field must have a minimum of 25 characters, since we need to populate it with a string. I have chosen the DESCR field, in stead of a PRINT button field.

The target must be an External Link since we won't execute a FieldChange event. We are going to run a script in an external page.

The external link must be set as Dynamic, since we are generating it through PeopleCode.

We also set a Page Field Name property, in case we want to manipulat it through the HTML code.



Just to let the page having sense, we change the field label.



4) Here we have the final page in the Designer.



5) Set up the fields by PeopleCode.



In the RowInit Event we set the HTMLAREA field as well as the DESCR field.

The script we must set in the button to be run is  "javascript:window.print();"

On the other side, I will explain HTLMAREA value step by step.

a) <style type=""text/css"">
b)    @media print {
c)            #PAGEBAR, .PSHEADERTOOLBARFRAME {
d)                    display: none }
e)      }
f) </style>

a) Open a style tag, specifying CSS language will be used.
b) Specify this style will only be used when Printing the document.
c) Choose those HTML elements in the document that will be set up with the properties. In this case #PAGEBAR and .PSHEADERTOOLBARFRAME are the navigation bar and page header used by PeopleSoft pages.
d) Set display property to none, meanning these properties won't be shown in the printing document.
e) Close the "@media" key.
f) Close the "style" tag.

6) We navigate to the page in PeopleSoft.



7) When clicking the print button, the event is executed



8) The printed page will be shown as follows:



9) In addition to this step by step, we could also hide the "Print" button when printing the page, adding the #PRINT ID to the CSS script, in the RowInit event.



If we print it once again, the Print button is not shown anymore.



I hope this blog could be so useful to you as it is to  me.
Regards.
Facundo Salerno.

Usar JavaScript para imprimir una página


A la hora de usar PeopleSoft mas de una vez necesitamos/queremos imprimir la página en la que estamos trabajando.

Lamentablemente, a la hora de hacerlo, la única forma conocida por mi (hasta hace poco tiempo) es imprimir la página desde el navegador.
Pero a la hora de hacerlo nos incluye en la impresión el menú lateral y/o superior.
Esto puede ser molesto, o al menos innecesario.

Con unos simples pasos, veremos la forma de imprimir el contenido de una página, sin mostrar esos sectores indeseados.

Veamos un ejemplo práctico:

1) Tenemos la página de pedidos que hemos usado en el ejemplo anterior:



2) Vamos a agregar un área HTML, asignándole un campo LONG


3) Agregamos un botón para imprimir la página con ciertas especificaciones distintas a las usuales:


El campo tiene que tener un mínimo de 25 caracteres de largo, por lo cual uso el campo DESCR, en lugar de un campo de botón común.
El destino va a ser un link Externo, porque no se trata de un evento FieldChange, sino que queremos ejecutar un script en una página ventana a la nuestra.
El link va a ser dinámico, ya que lo generaremos por PCode.

Además, le damosun nombre a nivel de página al campo, por si queremos encontrarlo" y utilizarlo desde el HTML.


Para darle sentido a la página le cambiamos la etiqueta al campo.


4) La página nos quedaría de la siguiente forma:


5) Cargamos el script en el campo HTMLAREA:


En este evento cargamos tanto el valor del HTMLAREA, como el valor del botón.

El botón lleva el script a ejecutar: javascript:window.print();


En cambio, el contenido del HTML será entonces línea por línea: 
a) <style type=""text/css""> 
b)    @media print { 
c)            #PAGEBAR, .PSHEADERTOOLBARFRAME { 
d)                    display: none }
e)      }
f) </style>

a) Abro el tag de estilos, indicando que usaré CSS
b) Especifico para que tipo de salida es el estilo, aclarando que es solo a la hora de imprimir.
c) Elijo que elementos del HTML usarán la propiedad siguiente, en este caso #PAGEBAR y .PSHEADERTOOLBARFRAME son la barra de navegación y el encabezado propio de las páginas de PeopleSoft.
d) le pido que la propiedad display tenga un estado "none", es decir, no se mostrarán y cierro la llave de la propiedad
e) cierro la llave del tipo de salida.
f) cierro el tag de estilo.


6) Entramos a la página desde el sistema:


7) Al darle clic al botón, se ejecuta el evento ingresado:


8) Y la impresión resultante, queda de la siguiente manera:


9) Por último, podríamos también ocultar el botón "Imprimir" agregándolo a las propiedades del CSS.
Para hacerlo entonces, basta agregar la propiedad en el RowInit:


Le anteponemos el # porque así es como se indica el ID del Campo en el CSS.

Si ahora volvemos a imprimir, el campo ya no aparece en la impresión.



Espero que este simple Paso a Paso les resulte tan útil como a mí.

Saludos.
Facundo Salerno.


domingo, 4 de enero de 2015

Add a JAVA applet in a PeopleSoft Page


A JAVA applet is a set of related classes and compiled into a ".jar" file. This file is able to be run through an HTML object.

In PeopleSoft we cun add these programs in our pages through some easy steps.

Let's see an example:
For instance, we have a page where we can see a purchase order's lines. We want to show a calculator in case any user wants to make some calculations based on the numbers in the page.


1) Place the ".jar" applet file in a public folder of the Web Server. We need this folder to be public since users must have access to the file.
For instance, we can place the file in the folder were the "Signon.html" file is placed.
Generally the path is:
//server/PS_HOME/WEBSERVER/BASE/application/peoplesoft/PORTAL/portalName




2) Add a HTMLAREA field in the page where we want to show the Embedded Calculator.




3) Create an HTML object. It will be used to populate the area in the page.



We are interested on the following parameters of this file:
NAME:Applet's name.
CODE: Path and name of the applet's main class.
ARCHIVE: Name and extension of the JAR file we left in the WebServer.
WIDTH: of the applet (pixels)
HEIGHT: of the applet (pixels)
CODEBASE: Here we should detail the path where the file is placed. Since we left it in the same folder as the singon.html file we only need to set the dot character "." as a parameter. With this reference we tell the system the file is in the same path.

Then we use the "document.write()" method to write the applet in the HMTL.

Note: Line breaks were only added to be shown in the explanation of the parameters. In the HTML object the applet must be written in the same line, so the final quote is recognized and the string is closed.


4) Populate the HTMLAREA field in the Activate event of the Page.



5) Finally, the result is as follows:



I hope this blog could be so useful to you as it is to  me.
Regards.
Facundo Salerno.

Agregar un applet de JAVA en una página PeopleSoft



Un applet de JAVA es un conjunto de clases relacionadas y compiladas en un archivo con extensión ".jar" que se puede ejecutar desde un HTML. 
En PeopleSoft podemos usar estos programas desde nuestras páginas, mediante unos simples pasos.

Vamos a verlo en un Ejemplo Práctico. 
Por ejemplo, tenemos una página donde se muestran las líneas de un pedido, y queremos insertar una calculadora para que el usuario pueda hacer cuentas en base a los números en pantalla.




Los pasos serían:

1) Ubicar el archivo .jar del applet en una carpeta del servidor Web que tenga acceso público. Esto es porque los distintos navegadores de los usuarios van a tener que poder acceder a dicho archivo.
Por ejemplo podemos dejarlos en el directorio del WebServer donde se encuentra el archivo signon.html 

Generalmente la ruta es: //servidor/PS_HOME/WEBSERVER/BASE/application/peoplesoft/PORTAL/nombrePortal

Ejemplo:


2) Agregar un área HTML en la página donde queremos visualizar el applet.




3) Crear un objeto HTML, que será el que se mostrará en la página.



De este archivo nos interesan los siguientes parámetros:
NAME: Nombre para el Applet.
CODE: Dirección donde está la clase principal del applet.
ARCHIVE: Es el archivo JAR que dejamos en el servidor.
WIDTH: Ancho del applet (en pixeles).
HEIGHT: Alto del applet (en pixeles).
CODEBASE: Aquí debe ir la ruta donde debe buscar el archivo. Como la dejamos en la misma carpeta del signon.html, basta con pasarle un caracter punto "." como parámetro, haciendo referencia a que el archivo JAR está en la misma dirección.

Con el método "document.write()" escribiremos en el HTML el applet.

NOTA: Los saltos de línea fueron agregados para la explicación, pero en el objeto HTML el applet debe ir todo en la misma línea, para que reconozca la comilla simple al final de la línea y cierre el "string".

4) En el evento Activate de la página populamos el campo HTMLAREA con nuestro script.


5) Finalmente, al entrar a nuestra página, el resultado será el siguiente:



Espero que este simple paso a paso les resulte útil como a mí.

Saludos.
Facundo Salerno.