Posts Tagged ‘javascript’

1 08
05
2011

Comprobar si existe un elemento con jQuery

Domingo, mayo 8th, 2011

Comprobar si existe un elemento con jQuery es muy sencillo.

Simplemente tenemos que ejecutar el siguiente código indicando en el selector de jQuery el identificador, clase o condición del elemento que estamos buscando para conocer si existe.


// Comprueba si existe algún elemento con el identificador "identifier"

if ($('#identifier').length) {

// Do something

}


// Comprueba si existe algún elemento con la clase css "mycssclass" asociado

if ($('.mycssclass').length) {

// Do something

}


// Comprueba si existe algún elemento de tipo radio-button

if ($(':radio').length) {

// Do something

}

 

9 01
05
2011

Obtener el valor de un radio button con Javascript (con y sin jQuery)

Domingo, mayo 1st, 2011

Siempre se me olvida, no sé cómo lo hago pero cuando estoy programando y necesito recoger el valor del radio button seleccionado… me surge siempre la misma pregunta: ¿y esto cómo se hacía?

jQuery

jQuery

Así que comparto con vosotros y me lo anoto para mí mismo la forma de recoger el valor del radiobutton seleccionado con la ayuda de jQuery.

Disponemos del siguiente grupo de radio-buttons dentro de un formulario para indicar el género o sexo de un usuario, y deseamos conocer el valor del botón de tipo radio seleccionado:

</p>
<p><label><input type="radio" id="gender-male" name="gender" value="male"/> Hombre</label><br />
<label><input type="radio" id="gender-female" name="gender" value="female"/> Mujer</label></p>
<p>

Mediante jquery podemos obtener el valor actual del radio con cualquiera de las siguientes líneas:

</p>
<p>var gender = $("input:radio[name='gender']:checked'").val();<br />
var gender = $("input[@name='gender']:checked").val();</p>
<p>

Y para los nostálgicos, cómo recoger el valor del radiobutton con javascript, sin ayuda de la librería jQuery (ayns… que recuerdos me trae esta función…):

</p>
<p>function getValueRadio(nombreFormulario,nombreCampo){<br />
  var longitud = eval("document."+nombreFormulario+"."+nombreCampo+".length")<br />
  for (var l=0; l<longitud; l++){<br />
    if (eval("document."+nombreFormulario+"."+nombreCampo+"["+l+"].checked"))<br />
        return eval("document."+nombreFormulario+"."+nombreCampo+"["+l+"].value");<br />
  }<br />
  return null;<br />
}//getValueRadio<br />
0 21
04
2011

Character decoding failed

Jueves, abril 21st, 2011

Hace algunos días, programando unos scripts en los que enviaba una petición a un servlet de Java a través de AJAX, me encontré con el siguiente mensaje de error en la consola, en mi caso, de Apache Tomcat:

02-abr-2011 23:50:29 org.apache.tomcat.util.http.Parameters processParameters
ADVERTENCIA: Parameters: Character decoding failed.
Parameter skipped.{id=[Ljava.lang.String;@137c90d, id=[Ljava.lang.String;@1709902, nbsp; <span class=[Ljava.lang.String;@14d626e}java.io.CharConversionException: EOF

Lo que en un primer momento tenía pinta de ser uno de tantos problemas que te vuelven loco buscando soluciones por internet, pero sin embargo la solución era mucho más sencilla de lo esperado.

Dentro de la colección de parámetros que construía para enviar hacia el servlet de Java, podían existir en ocasiones caracteres especiales tales como ‘%’, ‘$’, etc, que generaban el error mencionado: Character decoding failed.

La solución a este problema pasaba simplemente por codificar la cadena a enviar por AJAX en formato unicode, y para ello utilizaremos la función de javascript escape.

El código quedaría parecido a estas líneas:

    var params = "id=" + textAreaName + "&value=" + escape(text);
    $.ajax({
        url: "/MyApp/ajax/http/edit?id=" + id,
        type: 'GET',
        data: params,
        success: function(){ // your code }
    });
0 20
10
2010

Trim en JavaScript

Miércoles, octubre 20th, 2010

De forma similar a como implementamos hace unos días nuestro método ReplaceAll en Javascript, hoy vamos a realizar lo propio con la función trim con javascript.

Para aquellos que no conozcáis la función trim, esta nos permitirá eliminar los espacios en blanco del comienzo y del final de una cadena.

La idea es parecida a la que utilizamos para crear nuestra función ReplaceAll en Javascript, es decir, utilizar expresiones regulares llamando al método replace.


function trim (text) {
    return text.replace(/^\s+|\s+$/g,'');
}

Como véis, simplemente hemos utilizado la expresión regular /^\s+|\s+$/ y la hemos reemplazado por un espacio vacío.

Fácil, rápido y efectivo.

0 12
10
2010

ReplaceAll en JavaScript

Martes, octubre 12th, 2010

Javascript cuenta con múltiples funciones relacionadas con el objeto string, entre las que podemos encontrar el método replace.

El método replace de javascript nos permite buscar una subcadena en un String para ser sustituida por otra subcadena. Tal y como conocemos y solemos utilizar este método, replace() únicamente nos reemplazará la primera ocurrencia que haya encontrado en la caden original.

La primera idea que puede venirse a la cabeza para implementar una función replaceAll con javascript es recorrer la cadena original y reemplazar el subcadena deseada tantas veces como apariciones puedan existir en la misma. Este código quedaría algo así:

        /**
         * Función que permite reemplazar TODAS las subcadenas encontradas
         * en un string por otra nueva subcadena.
         */
        function replaceAll(text, search, newstring ){
            while (text.toString().indexOf(search) != -1)
                text = text.toString().replace(search,newstring);
            return text;
        }

Sin embargo, esto no es necesario.
Lo que mucha gente no sabe o simplemente pasamos por alto, es que la función replace de javascript soporta expresiones regulares (suele pasar también con la mayoría de lenguajes).
Esta funcionalidad, nos permite implementar un nuevo método replaceAll mucho más sencillo utilizando nuestras queridas expresiones regulares.

El código quedaría ahora algo como:

        /**
         * Función que permite reemplazar TODAS las subcadenas encontradas
         * en un string por otra nueva subcadena.
         */
        function replaceAll(text, search, newstring ){
            var out = text.replace(new RegExp(search, 'g'), newstring);
            return out;
        }

o simplemente:

// El texto a reeplazar deberá indicarse entre barras
text = text.replace(/find/g,”replace”)

NOTA: No es ninguna errata, cuando queramos indicar una expresión regular en el primer parámetro de la función replace de javascript, el texto irá indicado entre barras y SIN comillas.

Veamos algunos ejemplos:

        // Resultado: a234ea234ea234e
        var ejemplo1 = "abcdeabcdeabcde".replace(/bcd/g, "234");
        // Resultado: 323232409121
        var ejemplo2 = "3232,32409,121".replace(/,/g, "");
        // Resultado: sn notcas del mundo
        var ejemplo3 = "sin noticias del mundo".replace(/i/g, "");

Hemos visto por lo tanto 2 formas para implementar nuestro propio método replaceAll en javascript utilizando 2 fórmulas diferentes:

  • – Utilizando un bucle para recorrer y reemplazar tantas veces como sea necesario la cadena original
  • – Haciendo uso de expresiones regulares

En próximas entradas, veremos más en profundidad cómo utilizar expresiones regulares en javascript.