Archivo del sitio

Obtener valores de formulario en JSF con JQUERY

En esta entrada explicare un poco el conflicto que tiene JQuery con JSF,  todos sabemos obtener el valor de un elemento del DOM con javascript. Por ejemplo de un input llamado nombre:

<input type="text" id="nombre" />

Suponiendo que el codigo anterior es html puro y esta bajo un formulario cualquiera, vamos a obtener el valor a través de javascript.


function obtenerValor(){

var valor = document.getElementById("nombre").value;

alert(valor);

}

Ahora vamos a lo mismo, pero con JQUERY

$(document).ready(function(){
var nombre =$("#nombre").value;
alert(nombre);
});

Ahora veremos lo mismo pero con JSF.

Formulario JSF:

<h:form id="formulario">

<h:inputText id="nombre" value="#{managedBean.nombre}" />

</h:form>

Ahora obtenderemos el valor de JSF con javascript:

function obtenerValor(){
var nombre = document.getElementById("formulario:nombre").value;
alert(nombre);
}

Se dan cuenta la diferencia entre JSF y HTML? en javascript debemos tener el valor del id del formulario mas el id del input, de esta forma obtendremos el valor del input en jsf, ahora veremos la gran diferencia entre JQUERY y javascript a la hora de hablar sobre JSF con el mismo formulario anterior; en JQUERY se obtiene de esta forma:

$(document).ready(function(){
var nombre = $("#formulario\\:nombre").value;
alert(nombre);
});

La razón del conflicto es por los dos puntos, por alguna razón JQuery tiene problemas al procesar los dos puntos y debemos aplicar el doble back slash, para que tome los dos puntos como literales.
De esta forma podremos obtener el valor de un elemento JSF con JQuery, cualquier consulta me la pueden hacer en los comentarios, saludos!.

Anuncios
A %d blogueros les gusta esto: