Pequeña aportación: Formatear XML


([N1] aztecmexico) #1

Buen día a tod@s,

Como no creo que a estas alturas ya nadie se escapa de tener que procesar documentos electrónicos en formato xml, principalmente facturas, y guardarlos en nuestras bases de datos, para posteriormente revisarlos, verificarlos, etc, pues la verdad el verlos en los cuadros de texto de V7 después de importarlos tal como nos los regresan los webservices pues es feo, por decir lo menos, vamos, ilegibles completamente.

Después de revisar páginas y página, y códigos y códigos de todos lados, les dejo este pequeño procedimiento para que puedan sin mayores problemas visualizarlos de forma legible y más agradable dentro de sus aplicaciones.

Los archivos necesarios son:
codebeauty.html (que contiene el código que mostrará el xml)
vkbeautify.0.99.00.beta.js que es la librería javascript utilizada para formatear y “embellecer” el xml.

El html llama a los javascript del editor ACE y la librería jquery.min.js, imagino que si gustan los pueden bajar para tenerlos en local, de momento lo dejé así para evitar problemas de dependencias de otras librerías, por lo que es necesaria una conexión a internet para que funcione el procedimiento.

El proceso es simple,

  1. adjuntar a su proyecto los archivos codebeauty.html y vkvkbeautify.0.99.00.beta.js que les dejo como adjuntos en el post.
  2. Crear un formulario que contenga un visor html (dentro de un layout), el cual deberá tener propiedades de ancho y alto proporcional, opciones=contenido url y en contenido: “file:///” + sysCacheClientPath + “codebeauty2.html”.
  3. Un manejador de evento con el código que adjunto en imagen, lanzado en la pre-inicialización del formulario.
    El código en principio toma el archivo codebeauty.html como base para generar un segundo archivo: codebeauty2.html que es el que se muestra en el visor html, pero tambien pueden importar el código html a un campo en su app y manejarlo a partir de ahí en lugar de estarlo importando.
  4. En mi caso el formulario esta dentro de un separador de formularios, por lo que cargo el campo que contiene el xml directamente, si no es asi deberán cargar previamente el registro contenedor de su xml.
  5. lo importante aqui es la sustitución de todas las comillas dobles del xml, de lo contrario no funciona el invento,
    una vez sustituidas, se reemplaza el contenido del codebeauty, un indicador “mixml” por el código ya sustituido de su xml propio.
    6- el proceso graba el nuevo archivo en disco y es todo.
    Al mostrar el formulario el xml se ve legible y agradable.

Espero les sirva.

Saludos


([N1] aztecmexico) #2

Van los archivos





([N1] aztecmexico) #3

Bueno, les dejo enlace para que descarguen la librería y el html.

https://drive.google.com/drive/folders/1nViXOXb1SlWnJQYtPrG_gD4aZnu-BmBb?usp=sharing


([N1] aztecmexico) #4

Dar crédito al Maestro Paco Satué, cuyos ejemplos en su servidor de pruebas me sacaron de más de un apuro.

Y tambien la página en la que me basé para generar el archivo, es la siguiente:

https://www.cleancss.com/xml-beautify/

Creo que con un poco de ganas y tiempo podríamos generar algunas utilerías que nos servirían a todos para aprovechar y utilizar en nuestras aplicaciones.

Saludos a todos.


([N3] pacosatu) #5

Hola Martin.

Práctica aportación.
He incorporado un ejemplo en el Editor de código HTML de mis Ejercicios en el Cloud (XML Formatter).

Lo he simplificado un pco para hacerlo más comprensible.

Saludos y gracias
Paco Satué


([N3] Juanjo) #6

Muchas gracias a ambos.