JavaScript: Imprimir los Parámetros y Variables de un Objeto en JavaScript

Cada vez que necesitamos conocer el valor de una variable en JavaScript podemos utilizar la sentencia alert.

Ej.

alert(varible);

Pero algunas veces nos encontramos con valores como los siguientes:

• undefined: Quiere decir que la variable no ha sido creada.
• null: Quiere decir que la variable ha sido definida, pero su valor es nulo.
• object: La variable es un objeto.

Cuando la variable es un objeto a través de un alert no podemos conocer los parámetros que componen el objeto. Existe una manera de conocer los parámetros que componen el objeto. Existe una manera de conocer los parámetros que componen el objeto y el valor que tiene el parámetro, para esto se utiliza el siguiente código:

var objeto = objeto_existente;

for(key in objeto){

alert(“objeto[“ + key + ”]: ” + objeto[key]);

}

La respuesta obtenida a través del alert para key representa el nombre del parámetro y objeto[key] indica el valor que contiene el parámetro del objeto.

"Gracias, por compartir tus conocimientos"

HTML: Codificación de Caracteres en un Sistema Web

Para que un sistema web funcione correctamente todas las partes que lo componen deben tener la misma codificación de caracteres, para lograr esto comenzaré con la definición de la codificación de caracteres de la base de datos.

Para el motor de base de datos MySql se debe crear una base de datos con las siguientes sentencias.

mysql > CREATE DATABASE nombre_base_datos

DEFAULT CHARACTER SET = nombre_charset

DEFAULT COLLATE = nombre_collation;

o

mysql > CREATE DATABASE nombre_base_datos

DEFAULT charset nombre_charset

DEFAULT COLLATE = nombre_collation;

Para saber cuales son los conjuntos de caracteres soportados por MySql se pueden utilizar cualquiera de las siguientes instrucciones.

mysql > show character set;

o

mysql > show charset;

Los conjuntos de caracteres más utilizados son iso-8859-1 (latin1) y utf-8 (utf8), pero con la sentencia anteriormente escrita se pueden ver todos los conjuntos de caracteres disponibles.

Para saber cuales son las colecciones de datos disponibles para un conjunto de caracteres se puede utilizar la siguiente función.

mysql > show collation like '%utf%';

o

mysql > show collation like '%latin%';

La primera sentencia permite ver las colecciones disponibles para utf8 mientras que la segunda muestra las colecciones disponibles para latin1.

Una vez que la base de datos ha sido creada se puede ver el conjunto de caracteres definido para ella utilizando la siguiente sentencia.

mysql > show create database nombre_base_datos;

Una vez creada la base de datos con la codificación deseada, se deben crear cada una de las tablas que componen la base de datos con la siguiente sentencia.

mysql > CREATE TABLE nombre_tabla

(…)

DEFAULT CHARACTER SET nombre_charset

COLLATE nombre_collation;

o

mysql > CREATE TABLE nombre_tabla

(…)

DEFAULT charset = nombre_charset

COLLATE nombre_collation;

(…) representa la creación de los campos de la tabla.

Luego se puede verificar la codificación de caracteres de la tabla utilizando la siguiente sentencia.

mysql > show create table nombre_tabla;

Ahora que tenemos nuestra base de datos configurada con la codificación de caracteres deseada se debe verificar que cada archivo que contiene los script php estén codificador con el mismo conjunto de caracteres de la base de datos, con esto usted se puede asegurar que cualquier carácter especial escrito en el archivo será interpretado correctamente en el cliente web.

En caso de utilizar VIM para la creación y edición de archivos se puede utilizar la sentencia que se muestra a continuación para definir el conjunto de caracteres que se utilizará en el nuevo archivo, en caso de ser un archivo existente permite modificar el conjunto de caracteres que se utilizará.

:set fenc=iso-8859-1

o

:set fenc=utf-8

La sentencia anterior debe ser ejecutada al interior del editor de textos VIM, es decir, primero se abre el archivo y luego se ejecuta la sentencia anterior. La siguiente sentencia permite crear un archivo o abrir un archivo existente con un conjunto de caracteres definido.

$vi “+e ++enc=iso-8859-1” nombre_archivo

o

$vi “+e ++enc=utf-8” nombre_archivo

La sentencia anterior es ejecutada en la consola de Linux y abre el archivo en VIM con un conjunto de caracteres definido.

En Linux existe una opción que permite saber cual es la codificación de caracteres definida para un archivo existente, de este modo puede decidir conservar el conjunto de caracteres del archivo o modificarla, a continuación se describe la sentencia.

$file –mime-encoding nombre_archivo

Alguna de las respuestas que podemos recibir de la sentencia anterior con una descripción del significado que tiene el conjunto de caracteres definido para el archivo.

iso-8859-1: Archivo con caracteres especiales en latin1.

utf-8: Archivo con caracteres especiales en utf-8.

us-ascci: Archivo sin caracteres especiales. Conjunto de caracteres entre 0 y 127.

binary: Archivo en blanco (sin datos).

Si desea cambiar la codificación de caracteres sin utilizar el editor de texto VIM, Linux permite realizar este cambio con la siguiente sentencia.

$iconv -f codificacion_de_caracteres_actual -t codificacion_caracteres_nueva -o nombre_archivo_salida nombre_archivo_entrada

La codificación de caracteres puede ser:

• UTF-8
• ISO_8859-1

Ej.

$iconv -f UTF-8 -t ISO_8859-1 -o salida entrada

Una vez que se define la codificación de caracteres de la base de datos y los caracteres que contienen los script php, se debe definir la codificación de caracteres que utilizará por defecto el navegador web donde se desplegará la página. Para esto se debe utilizar la siguiente línea de código en el script php o html que contiene la página web.

<html>

<head>

<meta http-equiv=”Content-Type” content=”text/html” charset=”iso-8859-1” />

</head>

<body></body>

</html>

o

<html>

<head>

<meta http-equiv=”Content-Type” content=”text/html” charset=”utf-8” />

</head>

<body></body>

</html>

Ahora que el navegador estará configurado para reconocer la codificación de caracteres deseado queda un último paso, definir la codificación de caracteres que se desea utilizar en los formularios necesarios para almacenar los datos en la base de datos. La siguiente línea permite definir la codificación de caracteres del formulario.

<form id=”identificador” method=”post” action=”pagina_web” accept-charset=”iso-8859-1”>

</form>

o

<form id=”identificador” method=”post” action=”pagina_web” accept-charset=”utf-8”>

</form>

Es importante verificar que todos los elementos en los diferentes niveles de un desarrollo web se encuentren en una misma codificación de caracteres.

"Gracias, por compartir tus conocimientos"

HTML - JavaScript: Enviar las opciones de un campo select HTML a otro con JavaScript

El campo select de HTML permite enviar un parámetro de las opciones que el formulario tiene disponible. El campo select puede ser modificado para seleccionar más de una opción indicando que se trata de un select multiple.

Para este ejemplo veremos como enviar las opciones seleccionadas en un campo select a otro para luego enviarlas a un script php.

Primero se deben crear los dos select junto con los botones encargados de realizar el cambio de los parámetros de un select a otro.

<select name=”disponibles” multiple=”multiple” size=”4” id=”disponible”>

<option value=”1”>1</option>

<option value=”2”>2</option>

<option value=”3”>3</option>

</select>

</button type=”button” onclick=”pasar_parametro('disponible','seleccionado')”> >> </button>

</button type=”button” onclick=”pasar_parametro('seleccionado','disponible')”> << </button>

<select name=”seleccionados” multiple=”multiple” size=”4” id=”seleccionados”>

<option value=”4”>4</option>

<option value=”5”>5</option>

</select>

Es importante para el ejemplo que el select tenga las opciones size con valor >= 2 y debe contener el id pues lo utilizaremos para poder reconocer cual es el select seleccionado, a demás ese es el valor que se entrega a la función como parámetro.

• name: Nombre del campo select, se puede utilizar para capturar el valor del campo en el JavaScript.
  • getElementsByName: Permite acceder a una lista de elementos que tengan el nombre ingresado como parámetro.
• id: Identificador del campo select, se puede utilizar para capturar el valor del campo en el JavaScript.
  • getElementById: Permite obtener la referencia a un elemento de la página mediante el id del elemento.
• size: Permite que el select despliegue varias opciones a la vez, en lugar de ser un select desplegable.
• multiple: Permite realizar selecciones multiples sobre el campo select.

Ahora que tenemos los campos select y las opciones necesarios para realizar el cambio de opciones de un select a otro, se presenta el JavaScript que realiza el traspaso de opciones.

Function pasar_parametro(origen_id, destino_id){

obj = document.getElementById(origen_id);

if(obj.selectedIndex == -1){

return;

}

valor = obj.value;

txt = obj.options[obj.selectedIndex].text;

obj.options[obj.selectedIndex] = null;

obj2 = document.getElementById(destino_id);

opc = new Option(txt, valor);

eval(obj2.options[obj2.options.length] = opc);

return false;

}

La función anterior recibe como parámetros los ids del select origen (desde donde se cortará la opción seleccionada de campo select) y el valor destino (hacia donde se copiará la opción).

Luego se obtiene el objeto que contiene el select origen, se consulta si el índice de la opción seleccionada es igual a -1, de ser verdadero se retorna de la función debido a que no existen opciones seleccionadas. De lo contrario continúa la ejecución del JavaScript obteniendo el valor de la opción seleccionada en el select origen y se debe recuperar el texto de la opción seleccionada en el select origen, finalizando las operaciones sobre el select origen con la eliminación de la opción seleccionada.

El siguiente paso es obtener el objeto que contiene el select destino, se crea un objeto opción con los argumentos texto y valor, para finalmente utilizando la función eval que nos permite evaluar un texto como si se tratará de código JavaScript agregar el objeto opción al objeto select destino con un índice igual al último índice más uno.

Por ultimo la función retorna el valor false.

Nota: Esta función copia solo una de las opciones seleccionadas aún cuando existan varias opciones origen seleccionadas.

Nota: Para ver como se deben seleccionar todos los datos del campo select destino y poder enviarlo a través del formulario puede visitar el post Seleccionar Todos los Valores de un Campo Select con JavaScript.