Framework para hacer aplicaciones para Mobiles/Celulares

Les voy a dejar una serie de frameworks para hacer aplicaciones.
No he analizado todos, ni puedo recomendar ninguno, ustedes podrían comentarnos para saber cual es mejor o peor y así dar ideas para que nuestros desarrollos sean más rápidos y fáciles.

Anuncios

Un buen “Cargando/Loading” para nuestras páginas

Yo soy uno que vive buscando cosas que sirvan para “algo” sin necesidad de meter mucha mano, así que buscando un loading para mi web me encontré con este plugin que es maravilloso, por lo menos para mí.

Les dejo 2 Links, 1 links con el js original y otro con la implementación de mi parte.

Original, Aquí viene toda la explicación de como usarlo.

Implementación, Para verla simplemente ejecuten Run 2 veces, 1 para que se cree el script 2 para ver el cargando cuando nos salimos de la página al querer recargarla.


Problemas con el Checkbox en “Bootstrap from Twitter”

A muchos les ha pasado que quieren usar el estilo Checkbox que vienen con Bootstrap y resulta que cuando lo ponen en un formulario pues “tachán” el formulario se ejecuta, claramente porqué es un button.

Aquí una sencillísima solución que liberará tus problemas.

Por ejemplo, un formulario con un check:

<form action="">
   <button data-toggle="button" class="btn btn-warning">Single Toggle</button><br>
   <input type="submit" value="Enviar Check">
</form>

Si ejecutamos esto veremos que el button “Single Toggle” será un checkbox estilo Bootstrap pero al hacer click para cambiarlo el formulario se ejecuta “TREMENDO PROBLEMA”. Ejemplo aquí: http://jsfiddle.net/juanmboehme/Dd2Mr/

Pues mirar que sencillo:

El Javascript:
$(document).ready(function($) {
    function BtnUpdate(btn, input) {
        btn.toggleClass('active', input.prop('checked'));
        btn.toggleClass('disabled');
    }

    $(document).live('change', '.btn-toggle input', function(e) {
        var input = $(e.target);
        var btn = input.parents('.btn-toggle');
        BtnUpdate(btn, input);     
    });     
}); 
El CSS:
.btn-toggle input {
    display: none;
} 
EL Formulario:
<form action="">
    <label class="btn btn-toggle btn-warning" for="check1">Single Toggle
    <input type="checkbox" id="check1">
    </label><br>
    <input type="submit" value="Enviar Check">
</form>

Que vemos:

  1. Que al cargar la página todo btn-toggle input estará oculto, es decir, todo lo que sea input dentro de un toggle no se verá.
  2. Que al cargar o cambiar de estado un btn-toggle se ejecutará un script que cambiará su css-class.

Se podría, para mejorar el Script, poner lo siguiente:

$(document).ready(function($) {
    function BtnUpdate(btn, input) {
        btn.toggleClass('active', input.prop('checked'));
        btn.toggleClass('disabled', input.prop('disabled'));
    }

    $(document).live('change', '.btn-toggle input', function(e) {
        var input = $(e.target);
        var btn = input.parents('.btn-toggle');
        BtnUpdate(btn, input);     
    });     
});

Aquí ponemos el check deshabilitado para que no se envíe. Su estado pasará de Check True a Check False igual que el anterior pero en este caso se deshabilita el input tambien. Ejemplo aquí: http://jsfiddle.net/juanmboehme/JDdGS/

Si puedes mejorar el Scrip siempre será bienvenido.


Simple confirmacion con jquery al eliminar registros

Algo que siempre queremos hacer es alertarle al usuario que esta a punto de eliminar un registro, cuidado, aqui no hay forma para volver atras, para ayudar a los nuevos en el mundo del CRUD , tenemos hoy un tip con jquery.

Jquery:


$('.borrar').click(function(){
var mensaje = confirm(jQuery(this).attr('title'));
return mensaje
});

Leer el resto de esta entrada »