Posted on 22-10-2008
Filed Under (Desarrollo, JavaScript) by Programlocura

Buenas,
Hoy vengo con un Tip más que interesante para aquellos, que por ejemplo están haciendo un listado de personas (en un ABM por ejemplo) y desean eliminar varias personas, clickeando en varios checkboxes (Digo personas, pero obviamente puede ser cualquier cosa).

JavaScript:
  1. function knowChecked() {
  2.         var chk = document.getElementsByName("chk_Ids_A_Borrar");
  3.         var cnt = chk.length;
  4.         var result = "";
  5.        
  6.         for(var i=0; i<cnt; i++) {
  7.             if (chk[i].checked == true) {
  8.                 if (i == 0) {
  9.                     result += "chk" + i + "=" + chk[i].value;
  10.                 }else{
  11.                     result += "&chk" + i + "=" + chk[i].value;
  12.                 }
  13.             }
  14.         }
  15.        
  16.         alert(result);
  17.     }

La explicación luego del salto! :)
Read the rest of this entry »

(0) Comments    Read More   
Posted on 13-08-2008
Filed Under (Desarrollo, JavaScript) by Programlocura

Muy pero muy buenas, hoy les traigo un MUY BÁSICO (Incluso alguna se va a reír de mi >_<) ejemplo de validación en Javascript, es como para ir comenzando a familiarizarse con el lenguaje y algunos de sus usos más comunes.

JavaScript:
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <title>Titulo Aqui</title>
  5. <script language="javascript">
  6.     function comprobar() {
  7.         error = "";
  8.        
  9.         var doc_1 = document.getElementById("txtNombre").value;
  10.         var doc_2 = document.getElementById("txtApellido").value;
  11.         var doc_3 = document.getElementById("txtComentario").value;
  12.         var doc_4 = document.getElementById("txtTel").value;
  13.         var doc_5 = document.getElementById("txtMail").value;
  14.        
  15.         if (doc_1 == "") {
  16.             error += "- Complete Nombre\n";
  17.         }
  18.        
  19.         if (doc_2 == "") {
  20.             error += "- Complete Apellido\n";
  21.         }
  22.         if (doc_3 == "") {
  23.             error += "- Complete Comentario\n";
  24.         }
  25.        
  26.         if (doc_4 == "") {
  27.             error += "- Complete Telefono\n";
  28.         }else{
  29.             if (isNaN(doc_4)) {
  30.                 error += "- El Telefono es un dato numerico\n";
  31.             }
  32.         }
  33.        
  34.         if (doc_5 == "") {
  35.             error += "- Complete Email\n";
  36.         }else{
  37.             if (doc_5.indexOf("@") == -1){
  38.                 error += "- La direccion es invalida\n";
  39.             }
  40.         }
  41.  
  42.         if(error != "") {
  43.             alert(error);
  44.         }else{
  45.             alert("Formulario enviado con Exito");
  46.         }
  47.     }
  48. </script>
  49. </head>
  50. <body>
  51. <form name="form1" id="formulario" method="post">
  52. <table border="0" width="600">
  53.     <tr>
  54.         <td>Nombre:</td>
  55.         <td><input type="text" id="txtNombre"/></td>
  56.     </tr>
  57.     <tr>
  58.         <td>Apellido:</td>
  59.         <td><input type="text" id="txtApellido"/></td>
  60.     </tr>
  61.     <tr>
  62.         <td>Comentario:</td>
  63.         <td><textarea id="txtComentario"></textarea></td>
  64.     </tr>
  65.     <tr>
  66.         <td>Tel:</td>
  67.         <td><input type="text" id="txtTel"/></td>
  68.     </tr>
  69.     <tr>
  70.         <td>Mail:</td>
  71.         <td><input type="text" id="txtMail"/></td>
  72.     </tr>
  73.     <tr>
  74.         <td><input type="button" onclick="comprobar()" value="Enviar" id="txtEnviar"/></td>
  75.         <td><input type="reset" value="Borrar" id="txtBorrar"/></td>
  76.     </tr>
  77. </table>
  78. </form>
  79. </body>
  80. </html>

Es parte del curso que estoy dando sobre PHP (En el Circulo Informático), es una muy pequeña parte. En próximas entradas pondré algo sobre:

  • Alerts
  • Prompt
  • Confirm
  • Manejo de controles
  • DOM y acceso a objetos HTML

Todo muy básico y simple de modo que sea entendible (Son solo 6 u 8 horas que hay que dedicarle al tema).

P.D: Recomiendo también, esta pagina: Funciones de Strings con JS. Ahi podrán encontrar una amplia lista sobre funciones para utilizar con cualquier String, encontrarán las usadas en el ejemplo para entenderlo mejor.
Espero sea util.

Si te gustó este POST comprame un café, o invitamelo vos. Tirame unos pesos xD

(0) Comments    Read More   
Posted on 02-05-2008
Filed Under (Desarrollo) by Programlocura

Prototype Logo

Prototype es un framework Javascript cuyo objetivo es hacernos mas simples el desarrollo de aplicaciones web. Quize empezar hablando sobre esto ya que me llamó mucho la atención en cuanto quise comenzar con AJAX. No me decidia aún si hacerlo manejando directamente el objeto XMLHttpRequest o hacerlo a través de un framework como este.

La utilización es realmente simple y muy facil para cualquier persona que quiera empezar. No tiene porque usarse para AJAX únicamente sino que para facilitar el manejo de Javascript en general.

La forma en que se invoca el Script es simple:

JavaScript:
  1. <script type="text/JavaScript" src="prototype.js"></script>;
  2. // Reemplazas por el Path al archivo en el atributo "src".

Una vez hecho esto podemos comenzar a manejarnos con el. Como utilidades que se pueden destacar pueden ser:

JavaScript:
  1. // Hace referencia a un elemento con el ID "nombre_capa"
  2. $("nombre_capa")

Que como podemos ver reemplaza al clásico "document.getElementById()".
No busco entrar en mucho detalle en esto así que trataré de ir al grano, veamos como maneja Prototype al objeto XMLHTTPRequest:

JavaScript:
  1. function mostrarMensaje() {
  2. var url = "url_que_ejecuta_la_accion.php";
  3. var pars = "x=1";
  4. var Ajax = new Ajax.Updater("id_capa_muestra_msg", url, {method: "GET", parameters: pars} );
  5. }

En este simple ejemplo vemos como podemos mostrar un mensaje devuelto por una (por ejemplo) consulta a un server hecha desde un PHP. Como vemos en la primer parte creamos una variable URL a la que le daremos la dirección del archivo que ejecutara la consulta, luego una variable PARS que guardará los parámetros que necesitemos pasarle al archivo PHP, y para terminar instanciamos un objeto AJAX.UPDATER y le pasamos como parámetro: la capa donde queremos mostrar los resultados del server, la url donde se ejecutará la consulta y el tipo de método junto con los parámetros (En notación JSON).

El archivo PHP podría ser de cualquier tipo y lo único que debería es de devolver un mensaje. (utilizando 'echo' por ejemplo)

Como ven es útil, fácil y rápido.

(0) Comments    Read More