Category Archives: javascript

xpath

By on visto 18.106 veces

Partimos del siguiente xml:






  Everyday Italian
  Giada De Laurentiis
  2005
  30.00



  Harry Potter
  J K. Rowling
  2005
  29.99



  XQuery Kick Start
  James McGovern
  Per Bothner
  Kurt Cagle
  James Linn
  Vaidyanathan Nagarajan
  2003
  49.99



  Learning XML
  Erik T. Ray
  2003
  39.95

 

y trabajamos con javascript para utilizar xpath y ver los resultados

Y vemos como resultado:

/bookstore/book/author
Giada De Laurentiis
J K. Rowling
James McGovern
Per Bothner
Kurt Cagle
James Linn
Vaidyanathan Nagarajan
Erik T. Ray

//title
Everyday Italian
Harry Potter
XQuery Kick Start
Learning XML

//book/author[1]
Giada De Laurentiis
J K. Rowling
James McGovern
Erik T. Ray

//book[@category="web"]/title
XQuery Kick Start
Learning XML

Se puede interactuar y probar desde la url: aquí

Añadir contador de caracteres restantes a caja de texto

By on visto 14.844 veces

La idea es teniendo una caja de texto o un elemento input añadir un contador de los caracteres que faltan y que se vaya actualizando a medida que escribimos.


para ello utilizamos JQuery y la siguiente libreria:

(function($) {
'use strict';

$.fn.countChar = function() {

return this.each(function(i, element) {
$(element).keyup(function updateCharCounter() {

var $me = $(this);
var maxLength = parseInt($me.attr('maxlength'), 10);
var charCount = $me.val().length;
var nombrecajalimite=$me.prop('id')+"_limit";
var cajalimite = $('#'+nombrecajalimite);

cajalimite.text('' + maxLength + '/' + (maxLength - charCount));
});

var $me = $(this),
maxLength = parseInt($me.attr('maxlength'), 10),
charCount = $me.val().length;
var nombrecajalimite=$me.prop('id')+"_limit";
var cajalimite = $('#'+nombrecajalimite);
if (cajalimite){
$me.after('
');
}
cajalimite = $('#'+nombrecajalimite);
cajalimite.text('' + maxLength + '/' + (maxLength - charCount));

});
};


$( "" ).appendTo( "head" )



}(jQuery));

Con esto lo único que tenemos que hacer es añadir una clase a nuestra caja de texto:

Y añadir al final del documento la linea que lo enlaza:

Ordenar columnas datatable jquery

By on visto 13.961 veces

Hay determinadas columnas que no se ordenan bien de manera nativa utilizando jquery.datatable.js
Por ejemplo las fechas

Las fechas en español no se ordenan bien, para ello tenemos que indicarle un valor con la fecha en formato americano de manera que no se vea pero que le sirva para ordenar:

Donde lo importante es poner un elemento <span style=”display:none”>valor util para ordenar</span> que en el caso de las fechas es con el formato americano.

 

Usar verify.js para validar un formulario usando AJAX

By on visto 13.249 veces

El plugin verify.js nos permite validar un formulario rápidamente, pero funciona cuando se envía el formulario con el botón submit.

Si el formulario lo queremos utilizar mediante ajax no se dispara el evento.

campoobligatorio

Para ellos vamos a utilizar el evento beforeSubmit

Detectar tecla mayusculas pulsada al hacer click en un enlace

By on visto 9.540 veces

Si queremos que al pulsar en un elemento se comporte de manera distinta si tiene la tacla mayusculas pulsada lo podemos conseguir con Javascript:







	Si quieres que se comporte distinto manten pulsado "Mayusculas"

Ejemplo funcinando https://jsfiddle.net/Lu252r5z/