Adsense

Mostrando entradas con la etiqueta jquery. Mostrar todas las entradas
Mostrando entradas con la etiqueta jquery. Mostrar todas las entradas

lunes, 20 de julio de 2015

Decodificar html entities con Jquery

Si tenemos una cosa como "<p>name<" y queremos mostrarlas en cristiano empleando Jquery hacemos una cosa tonta

var text = '<p>name&lt';
var decoded = $('
'
).html(text).text(); alert(decoded);
Las html entities van a quedar reemplazadas por su símbolo, como puede verse en el ejemplo.

Fuente

lunes, 30 de marzo de 2015

Serializar con jquery los inputs de la fila de una tabla

La validación en el Back End es obligatoria. Así que si eres vago como yo puedes dejarle todo al back end para que valide y no trabajas doble.

Si tuvieras el caso de una fila de una tabla que quisieras validar, y solamente validar esa fila, puedes usar una cosa maravillosa como es la serialización de Jquery.


var datos = $("#tabla tbody tr:first :input").serialize();
$.post('index.php', datos, function(data){
 if(data.error=true){
     alert(data.mensajeerror);
 }
});
De esta forma tenemos

#tabla el id de la tabla tobdy
tbody el cuerpo de la tabla
tr:first tomara la primera fila de la tabla
:input solo los campos de entrada

Con un post mágico pasamos toda la data de esa fila y allá en php, ruby, django, etc validas todo maravillosamente y si hay un error devuelves lo que necesites.

viernes, 29 de abril de 2011

evitar submit al oprimir enter en un formulario y hacer tab

El script hace lo siguiente, al pulsar enter, busca el proximo input de tipo text para y hace focus

$(function(){

$("input").keypress( function (event){
//aqui se ve si la tecla es enter
if(event.which == 13) {
//AQUI SE CANCELA EL SUBMIT AL PULSAR ENTER
event.preventDefault();
//AQUI SE BUSCA EL PROXIMO INPUT DE TIPO TEXTO
n = 1 + $("[type=text]").index(this);
//AQUI SE HACE EL FOCUS EL PROXIMO INPUT DE TIPO TEXTO
$("[type=text]:eq("+n+")").focus();
}
});
//ESTO ES UN BONUS: CAMBIA DE COMA A PUNTO DENTRO DE UN INPUT TEXT
$("input").keyup( function (event){
var num_coma = 188;
if(event.which==num_coma)
this.value =this.value.split(",").join(".");
});


});


EL SCRIPT TRAE BONUS: CAMBIA DE COMA A PUNTO DENTRO DE UN INPUT TEXT

martes, 12 de abril de 2011

jquery ui datepicker en español

El componente de calendario para seleccionar fechas en html más completo, documentado y gratis sin duda es datepicker de la gente de jquery ui.

Puede colocarse en diversos idiomas configurando su localización.

Basta con agregar

"/ui/i18n/jquery.ui.datepicker-es.js"

Y se coloca mágicamente en español

Para saber mas:


Otro post más descubriendo el agua tibia! XD

martes, 5 de abril de 2011

Jqueryui autocomplete usando posten vez de get

Soy un completo ignorante en el tema de JQuery y decidí emplear el componente autocomplete de jqueryui.

El componente es súper sencillo de usar. Basta con unos breves comandos en jquery y el mismo hace una petición con una variable term pasada por get.

El problema está en eso mismo. Es un parámetro GET... cosa que puede incomodar a algunos novatos como YO que estamos desarrollando en frameworks como codeigniter que no usan el pase de valores por GET y activarlo trae mas desventajas que ventajas.

Así que una solución muy básica que descubrí luego de consultar alguito fue tan simple. Si hubiera estudiado un poco más jquery ni siquiera hubiera molestado a nadie preguntando.

Para consultar los valores en tu pagina destino empleando post, basta con usar el objeto post de jquery! XD.



 $(function() {
$("#empleado").autocomplete({
//parte 1
source: function( request, respond) {
//parte 2
$.post( "controlador/funcion", { term: request.term },
function( response ) {
// check response for validiy, etc
respond( response );
}, 'json' );
},
//parte 3
minLength: 3,
select: function(event, ui) {
$('#campo1').val(ui.item.id);
$('#campo2').val(ui.item.id);
$('#dataempleado').val(ui.item.descripcion);
}

});

});



En la primera parte se define que la fuente de los datos para el autocompletar será los resultados de la parte 2 que es el Post. De esta manera el parametro term va a ser una simple referencia que contendrá el valor a buscar. Ya el componente solito no manda hacer la consulta.

La tercera parte del código es para volcar los resultados una vez seleccionados... eso es de mi caso.

Jquery es una nota, pero para gente como yo que viene de instrucciones de iteración, condicionales, tiende a hacerse algo confuso...

Esta pagina me ayudo mucho.

Y este es el link que te explica jQuery.post().