Componente SELECT multi-columna

Creado por   el 2019-12-19 22:37:47


Durante el desarrollo de mi software MRP SIADO me tope con un problema relacionado con el detalle de los documentos (ordenes de compras, guiás y facturas) ya que para agregar nuevos items a un documento estos son seleccionados desde un campo tipo SELECT, el problema es que algunos ítems tienen el mismo nombre, lo cual no es extraño en un software de esta naturaleza ya que cada uno esta asociado a un id diferente en la base de datos y mantienen una relación referencial con campos de diferentes tablas como cuentas contables, stock, medidas, etc., por esta razón es necesario incluir la información relacionada de manera que los usuarios no se confundan y agreguen el item equivocado con todos los problemas que esto ocasionaría.

Como todos sabemos en una etiqueta tipo SELECT los datos se despliegan de manera similar a una tabla con una sola columna y múltiples filas, donde no es posible tabular la información en columnas.

¿Entonces como hacemos para mostrar esta información?

Una posible solución seria separar los datos mediante un carácter como una coma o un guion, el problema de esto es que al desplegar el componente, los datos se verían muy desordenados y serian difíciles de leer.

Otra solución seria usar un tipo de letra monoespaciado y formatear los datos para que se muestren equidistantes simulando columnas, esta es una buena opción pero rompe el diseño de la pagina al usar distintos tipos de fuentes.

Lo bueno de ser programador es que siempre podemos darle la vuelta a un problema, así que me dispuse a crear un componente que resolviera esta problemática, mi idea era crear un web component lamentablemente esta tecnología no era compatible con todos los navegadores, así que tuve que hacerlo como en la vieja escuela con VanillaJS pero aprovechando las nuevas características del estándar ES6, el resultado es un componente que en un arranque de originalidad llame SelectMultiColumns, pero que finalmente cumple con el propósito para el cual fue desarrollado, debo decir que funciona bastante bien incluso con mas de 2000 items probado en un entorno de producción.

https://github.com/RichardCollao/SelectMultiColumns

Adelanto de software LauncherX (Lanzador de emuladores arcade)

Creado por   el 2018-05-22 01:10:51


Hace poco quise instalar el HyperSpin en Linux pero solo es posible para windows (de manera nativa) aunque existen otras opciones muy buenas que son compatibles con Linux, como maximus arcade y Attract-Mode, a mi parecer los temas no son tan atractivos visualmente como los del HyperSpin.

Así que me puse a desarrollar una alternativa siguiendo el mismo estilo y aprovechando sus recursos multimedia, la idea es desarrollar un Launcher multiplataforma y open source, todavía me falta mucho trabajo, pero apenas disponga un beta funcional subiré un repositorio a GitHub para que puedan descargarlo.

El software lo estoy desarrollado en ElectronJs por lo que seria multiplataforma, también pretendo hacer un fork en apache cordoba para correrlo en moviles.

Ajax

Creado por   el 2014-05-20 21:26:03



AJAX, acrónimo de Asynchronous JavaScript And XML (JavaScript asíncrono y XML), es una técnica de desarrollo web para crear aplicaciones interactivas o RIA (Rich Internet Applications). Estas aplicaciones se ejecutan en el cliente, es decir, en el navegador de los usuarios mientras se mantiene la comunicación asíncrona con el servidor en segundo plano. De esta forma es posible realizar cambios sobre las páginas sin necesidad de recargarlas, mejorando la interactividad, velocidad y usabilidad en las aplicaciones.
http://es.wikipedia.org/wiki/AJAX

index.php
code: js
// Devuelve un objeto XMLHttpRequest
function Ajax(){
var xmlhttp = false;
try{
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
}catch (e){
try{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}catch (E){
xmlhttp = false;
}
}
if(!xmlhttp && typeof XMLHttpRequest != 'undefined'){
xmlhttp = new XMLHttpRequest();
}
return xmlhttp;
}

function test()
{
var v1 = "uno";
var v2 = "dos";

ajax = getXMLHttpRequest();
ajax.open("POST", "file.php", true);
ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
ajax.send("v1="+v1+"&v2="+v2);

ajax.onreadystatechange = function()
{
if (ajax.readyState == 4)
{
showResult(ajax.responseText);
}
}
}

function showResult(str)
{
document.getElementById('contenedor').innerHTML = str;
}
index.php
code: html
<div id="contenedor">
</div>
<input type="button" value="cargar" onclick="javascript:test()" />

Ahora ya podemos probar el codigo, para esto creamos un archivo de prueba.
file.php
code: html
<pre>
<?php
print_r($_POST) ;
?>
</pre>

Hemos visto su implementacion, luego veremos como enviar un array y recibirlo como un objeto usando JSon
Servidor Web más utilizado, con mayor número de instalaciones a nivel mundial, es un proyecto de código abierto y uso gratuito, multiplataforma.
Conjunto de datos de un mismo contexto y almacenados sistemáticamente para su posterior uso.
Lenguajes que hacen referencia al codigo de marcado para la elaboración de páginas web.
Potente lenguaje de programación orientado a objetos, independiente del sistema operativo.
Lenguaje interpretado orientado a objetos desarrollado por Netscape que se utiliza en millones de páginas web y aplicaciones de servidor en todo el mundo
Sistema operativo de software libre inspirado en el sistema Unix, escrito por Linus Torvalds con la ayuda de miles de programadores en Internet
El modelado 3D es el proceso de desarrollo de una representación matemática de cualquier objeto tridimensional a través de un software especializado. Al producto se le llama modelo 3D
Lenguaje de programación principalmente orientado al desarrollo web, su código es ejecutado del lado del servidor.
Todo lo que no sea trabajo, solo temas recreativos para divertirse.