lunes, 27 de febrero de 2012

Libro de Patrones de Diseño en JavaScript

Quisiera recomendar este libro publicado de manera gratuita por Addy Osmani, reconocido JavaScript Ninja que aborda el tema de Patrones de Diseño en JavaScript. Apenas he comenzado a leerlo, pero hasta ahora da buenos signos de ser una buena lectura.

Existe una tendencia como desarrolladores en pensar que, como JavaScript no tiene un soporte robusto de POO, podemos programar sin mayor estructuración nuestra funcionalidad de Front-End. Lo básico es que las funciones de JavaScript se encuentren en archivos separados. No obstante es importante considerar que hay mecanismos para emular un desarrollo que haríamos con lenguajes más formales.



Publicado por en No hay comentarios:
Etiquetas: ,

jueves, 2 de febrero de 2012

Pasando selección entre formularios con JavaScript

Hace poco tuvimos que resolver un problema algo trivial pero que hasta ahora me había tocado resolver. Consiste en poder seleccionar un valor de un "dropdown list" en una página con un formulario, y que ese mismo valor se seleccione en otra página con otro formulario pero con el mismo "dropdown list". Todo con puro código HTML y JavaScript.


La solución propuesta, a sabiendas de que pueda existir otra mejor, consiste en utilizar el método GET en el primer formulario.

<form method="get" action="part-b.html">
<select name="perro">
 <option value="">Seleccion un perro...</option>
 <option value="boxer">Boxer</option>
 <option value="pastor">Pastor Aleman</option>
</select>
<input type="submit" />
</form>

De esta manera podemos leer el query string con una función que ya he utilizado varias veces, extraemos el parámetro y usamos una sentencia "abra kadabra" de JQuery para seleccionar el "dropdown list" con el parámetro.
<html>
<head>
<script src="jquery.min.js"></script>
<script type="text/javascript">
 function getUrlVars()
 {
  var vars = [], hash;
  var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
  for(var i = 0; i < hashes.length; i++)
  {
   hash = hashes[i].split('=');
   vars.push(hash[0]);
   vars[hash[0]] = hash[1];
  }
  return vars;
 }
</script>
</head>
<body>

<form method="get" action="d.html">

 <select name="perro" id="perros">
 <option value="boxer">Boxer</option>
 <option value="pastor">Pastor Aleman</option>
 </select>
 <input type="submit" />
</form>

<script type="text/javascript">
 var perro = getUrlVars()["perro"];
 $('#perros option[value=' + perro + ']').attr("selected", "selected");
</script>
</body>
</html>
Publicado por en No hay comentarios:
Etiquetas: ,
Suscribirse a: Entradas (Atom)