¿Cómo agregar autoincrement a una llave primaria cuando ya está relacionada a otras tablas? #mysql #constraint #foreign

Cuando tenemos una llave primaria la cual está relacionada a otras tablas y deseamos ponerla como autoincrement (ya sea porque se nos pasó en el diseño o por x circunstancia), debemos poner el valor 0 a la variable de mysql FOREIGN_KEY_CHECKS y para ello lo podemos hacer de la siguiente manera:

SET FOREIGN_KEY_CHECKS = 0;

Y para volverla a activar:

SET FOREIGN_KEY_CHECKS = 1;

Y así nos quedaría nuestra instrucción completa, incluyendo la consulta que hace la llave primaria que se autoincremente:


SET FOREIGN_KEY_CHECKS = 0;

ALTER TABLE `nombreTabla`
MODIFY COLUMN `idTabla`  int(11) NOT NULL AUTO_INCREMENT;

SET FOREIGN_KEY_CHECKS = 1;

¿Cómo hacer que el middleware VerifyCsrfToken de #Laravel nos ignore rutas específicas?

Algunas veces tenemos la necesidad de que el middleware VerifyCsrfToken ignore rutas específicas, ya sea por una petición en la cual no enviemos el token o ya sea por utilizar algún framework externo a Laravel, para eso solo basta con ir al middleware VerifyCsrfToken y agregar en el arreglo $except las rutas deseadas:

namespace AppHttpMiddleware;

use IlluminateFoundationHttpMiddlewareVerifyCsrfToken as BaseVerifier;

class VerifyCsrfToken extends BaseVerifier
{
    /**
     * The URIs that should be excluded from CSRF verification.
     *
     * @var array
     */
    protected $except = [
        //
    	'ruta/pato',
        'ruta2/pato2'
    ];
}

Cambiar una imagen al dar clic en una imagen en miniatura con #jquery, #galería

Para crear una mini galería básica como la siguiente (den clic en las miniaturas):

Lo podemos hacer de la siguiente forma:

HTML

<div id="thumbs">
   <img style="width: 50px;" alt="" src="../img/images/at.jpg" data-img="../img/images/a.jpg" />
   <img style="width: 50px;" alt="" src="../img/images/bt.jpg" data-img="../img/images/b.jpg" />
</div>

<div>
    <img id="imagenGrande" style="width: 500px;" alt="" src="../img/images/a.jpg" />
</div>

Jquery

$(document).ready(function(){

	//selector de imagenes a aplicar la funcionalidad de click
	$("#thumbs img").click(function(){

		//obtenemos la imagen a mostrar
		urlImagenGrande=$(this).data("img");

		//asignamos la imagen por medio de prop
		$("#imagenGrande").prop("src",urlImagenGrande);

	})

});

Utilizando la propiedad prop procedemos a cambiar el atributo src de img al momento que se da clic en la miniatura. De esta manera queda la funcionalidad dinámica gracias al selector de jquery ($(“#thumbs img”)).

¿Cómo enviar un mail con archivos adjuntos desde C# .Net? #smtp

Para enviar un email desde .Net, lo podemos hacer muy fácil, ya que .Net ya nos proporciona lo necesario para realizarlo rápidamente.

A continuación plasmo el código de una clase improvisada que sirve para enviar el mail y a su vez tiene comentarios que van explicando parte por parte:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net.Mail;
using System.Text;
using System.Threading.Tasks;

namespace EnviaMail
{
     class Mail
    {

        string From = ""; //de quien procede, puede ser un alias
        string To;  //a quien vamos a enviar el mail
        string Message;  //mensaje
        string Subject; //asunto
        List<string> Archivo = new List<string>(); //lista de archivos a enviar
        string DE = "[email protected]"; //nuestro usuario de smtp
        string PASS = "tupass"; //nuestro password de smtp

        System.Net.Mail.MailMessage Email;

        public string error = "";

        /// <summary>
        /// constructor
        /// </summary>
        /// <param name="FROM">Procedencia</param>
        /// <param name="Para">Mail al cual se enviara</param>
        /// <param name="Mensaje">Mensaje del mail</param>
        /// <param name="Asunto">Asunto del mail</param>
        /// <param name="ArchivoPedido_">Archivo a adjuntar, no es obligatorio</param>
        public Mail(string FROM, string Para, string Mensaje, string Asunto, List<string> ArchivoPedido_ = null)
        {
            From = FROM;
            To = Para;
            Message = Mensaje;
            Subject = Asunto;
            Archivo = ArchivoPedido_;

        }

        /// <summary>
        /// metodo que envia el mail
        /// </summary>
        /// <returns></returns>
        public bool enviaMail()
        {

            //una validación básica
            if (To.Trim().Equals("") || Message.Trim().Equals("") || Subject.Trim().Equals(""))
            {
                error = "El mail, el asunto y el mensaje son obligatorios";
                return false;
            }

            //aqui comenzamos el proceso
            //comienza-------------------------------------------------------------------------
            try
            {
                //creamos un objeto tipo MailMessage
                //este objeto recibe el sujeto o persona que envia el mail,
                //la direccion de procedencia, el asunto y el mensaje
                Email = new System.Net.Mail.MailMessage(From, To, Subject, Message);

                //si viene archivo a adjuntar
                //realizamos un recorrido por todos los adjuntos enviados en la lista
                //la lista se llena con direcciones fisicas, por ejemplo: c:/pato.txt
                if (Archivo != null)
                {
                    //agregado de archivo
                    foreach (string archivo in Archivo)
                    {
                        //comprobamos si existe el archivo y lo agregamos a los adjuntos
                        if (System.IO.File.Exists(@archivo))
                            Email.Attachments.Add(new Attachment(@archivo));

                    }
                }

                Email.IsBodyHtml = true; //definimos si el contenido sera html
                Email.From = new MailAddress(From); //definimos la direccion de procedencia

                //aqui creamos un objeto tipo SmtpClient el cual recibe el servidor que utilizaremos como smtp
                //en este caso me colgare de gmail
                System.Net.Mail.SmtpClient smtpMail = new System.Net.Mail.SmtpClient("smtp.gmail.com");

                smtpMail.EnableSsl = false;//le definimos si es conexión ssl
                smtpMail.UseDefaultCredentials = false; //le decimos que no utilice la credencial por defecto
                smtpMail.Host = "smtp.gmail.com"; //agregamos el servidor smtp
                smtpMail.Port = 465; //le asignamos el puerto, en este caso gmail utiliza el 465
                smtpMail.Credentials = new System.Net.NetworkCredential(DE, PASS); //agregamos nuestro usuario y pass de gmail

                //enviamos el mail
                smtpMail.Send(Email);

                //eliminamos el objeto
                smtpMail.Dispose();

                //regresamos true
                return true;
            }
            catch (Exception ex)
            {
                //si ocurre un error regresamos false y el error
                error = "Ocurrio un error: " + ex.Message;
                return false;
            }

            return false;

        }
    }
}

Para utilizar la clase anterior lo podemos hacer de la siguiente manera:


           //creamos nuestra lista de archivos a enviar
            List<string> lstArchivos = new List<string>();
            lstArchivos.Add("c:/archivo1.txt");
            lstArchivos.Add("c:/archivo2.txt");

            //creamos nuestro objeto de la clase que hicimos
            Mail oMail = new Mail("[email protected]", "[email protected]",
                                "hola", "un mensaje bien chevere",lstArchivos);

            //y enviamos
            if (oMail.enviaMail())
            {
                Console.Write("se envio el mail");

            }
            else
            {
                Console.Write("no se envio el mail: "+oMail.error);

            }

Nota: si utilizan una cuenta Gmail, a veces va a tardar en conectarse, esto es porque Gmail tiene muchas restricciones de conexiones anónimas, en cambio sí utilizan una conexión smtp propia, no debe darles problema.

Pasar una función como parámetro en #javascript

Para los que aprendimos un lenguaje Orientado a Objetos antes que javascript algunas veces desconocemos la naturaleza dinámica de este lenguaje, y una de las cosas naturales es poder guardar una función en  una variable e igual enviarse esa función como parámetro.

Existen dos formas de hacerlo y la primera es haciendo una función anónima:


//creamos una función que recorre una lista
function recorreLista(funcionPasadaXParametro){

	//recorremos el arreglo/lista
	//utilizamos la palabra reservada this para referirnos al objeto que es dueño de este metodo.
	for(i=0;i<this.length;i++){

		//ejecutamos la función pasada como parametro, la cual se le envia el elemento actual
		funcionPasadaXParametro(this[i]);
	}

}

//creamos arreglo
arreglo=new Array(1,3,4,5);
//asignamos la funcion al metodo recorre
arreglo.recorre=recorreLista;

//ejecutamos la función pasandole una función anonima
arreglo.recorre(
				//FORMA 1 para pasar una función como paramétro
				//creamos la función anonima
				function(elemento){

					//mostramos el elemento actual
					alert(elemento)
				}
);

La segunda forma de pasar una función como parámetro, es pasando una función existente.


//creamos una función la cual enviaremos
function multiplicaX10(elemento){
	alert(elemento*10);
}

//FORMA 2 para pasar una función como parametro
arreglo.recorre(multiplicaX10);

Nota: Recuerden no poner los paréntesis cuando se pasa una función ya existente como parámetro, el hecho de poner los paréntesis ejecuta la función.

Listas en #javascript. (arreglos, matrices) #push, #pop, #sort, #reverse, #unshift, #forEach.

Las listas en javascript son un tema enorme pero que todo programador de javascript debe conocer a fondo. En esta entrada me enfocare a los aspectos básicos de las listas (arreglos, matrices).

Ver arreglos – curso básico de javascript.

Para crear una lista vacía se puede hacer de las siguientes dos formas:


//Forma 1: corchetes
var lista=[];

//Forma 2: new Array();
var lista=new Array();

Sea cual sea la forma que utilicen para crear una lista (arreglo) es irrelevante.

Ahora para crear una lista con elementos desde el inicio se puede hacer de la siguiente manera:


//Forma 1: corchetes
var lista=new Array("ganzo","perro");

//Forma 2: new Array();
var lista=["ganzo","perro"]

Ahora para recorrer una lista, la mejor manera es por medio del método forEach, el cual itera con cada elemento del arreglo. Este método recibe una función como parámetro, y se utiliza de la siguiente manera:


//creamos nuestra lista
var lista=["ganzo","perro"];

//recorre elemento por elemento y los muestra con alert()
//el atributo i es el elemento actual en cada iteración.

lista.forEach(function(i){
	alert(i)
});

Para agregar un elemento al final del arreglo se utiliza el método push(), y para agregar un elemento al inicio del arreglo se utiliza el método unshift(). En el siguiente ejemplo muestro como se utilizan:


var lista=["ganzo","perro"];

//agregamos pato al final de la lista
lista.push("pato");

//agregamos pez al inicio de la lista
lista.unshift("pez");

//si mostramos nuestra lista ahora se veria así
//>> pez, ganzo, perro, pato

La función pop() elimina el elemento que esta al final (una pila):


var lista=["ganzo","perro","palomo","gato"];

lista.pop();

//si mostramos nuestra lista ahora se veria así
//>> ganzo, perro, palomo

Y por último los métodos sort() y reverse() nos sirven para ordenar nuestra lista ya sea ascendente o descendentemente:


var lista=[5,4,1,9];

lista.sort();
//>> 1, 4, 5, 9

lista.reverse();
//>>9, 5, 4, 1

Todas estas funciones son básicas y nos sirven para el buen manejo de los objetos, y conocerla es obligación de todo programador de javascript.

Existen muchísimas funciones más de listas pero para eso habrá más entradas.

El método map de javascript (listas, matrices, arreglos)

El método map de javascript sirve para llamar una función la cual se ejecutara con cada uno de los elementos de un arreglo (matriz, lista). Este método recibe una función como argumento la cual ejecutara n veces (el número de elementos en nuestro arreglo), y regresara un nuevo arreglo con los resultados.

Su función es la siguiente:


//lista con numeros
var lista=[1,4,9,16,25]

//la función map es inmutable por lo cual debemos asignar lo que regresa a otra lista
//en este caso se lo asignamos a la misma lista
var lista=lista.map(function(elemento){
	//sacamos la raíz cuadrada del elemento
	return Math.sqrt(elemento);
});

//Ahora recorremos con foreach la lista
//foreach funciona de manera similar solo que no regresa la lista
lista.forEach(function(i){

	alert(i)
	//muestra 1,2,3,4,5
})

También podemos llamar una función existente la cual reciba un argumento el cual será nuestro elemento:


//lista con numeros
var lista2=[1,2,3,4,5]

//función que multiplica un numero por 10
function MultiplicaX10(elementoLista){

	return 	elementoLista*10
}

//la función mapa puede enviar parametros a la función que se ejecutara
//se hace de la siguiente manera
var lista2=lista2.map(MultiplicaX10,10);

//mostramos el resultado
lista2.forEach(function(i){

	alert(i)

	//muestra 10,20,30,40,50
})

Nota: La función foreach tiene un funcionamiento parecido, solo que no regresa un arreglo.

Codificar y decodificar base64 en #javascript

Para realizar la codificación y decodificación de base64 en javascript, vamos a utilizar el siguiente código comprimido que ya contiene todo lo necesario, pueden copiarlo en un archivo con extensión “js” o ponerlo en la página web donde va a utilizarlo.

Código Necesario, debe copiarse toda la siguiente línea:


//COPIAR ESTE CÓDIGO
//comienzo de código
var Base64={_keyStr:"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",encode:function(e){var t="";var n,r,i,s,o,u,a;var f=0;e=Base64._utf8_encode(e);while(f&amp;lt;e.length){n=e.charCodeAt(f++);r=e.charCodeAt(f++);i=e.charCodeAt(f++);s=n&amp;gt;&amp;gt;2;o=(n&amp;amp;3)&amp;lt;&amp;lt;4|r&amp;gt;&amp;gt;4;u=(r&amp;amp;15)&amp;lt;&amp;lt;2|i&amp;gt;&amp;gt;6;a=i&amp;amp;63;if(isNaN(r)){u=a=64}else if(isNaN(i)){a=64}t=t+this._keyStr.charAt(s)+this._keyStr.charAt(o)+this._keyStr.charAt(u)+this._keyStr.charAt(a)}return t},decode:function(e){var t="";var n,r,i;var s,o,u,a;var f=0;e=e.replace(/[^A-Za-z0-9+/=]/g,"");while(f&amp;lt;e.length){s=this._keyStr.indexOf(e.charAt(f++));o=this._keyStr.indexOf(e.charAt(f++));u=this._keyStr.indexOf(e.charAt(f++));a=this._keyStr.indexOf(e.charAt(f++));n=s&amp;lt;&amp;lt;2|o&amp;gt;&amp;gt;4;r=(o&amp;amp;15)&amp;lt;&amp;lt;4|u&amp;gt;&amp;gt;2;i=(u&amp;amp;3)&amp;lt;&amp;lt;6|a;t=t+String.fromCharCode(n);if(u!=64){t=t+String.fromCharCode(r)}if(a!=64){t=t+String.fromCharCode(i)}}t=Base64._utf8_decode(t);return t},_utf8_encode:function(e){e=e.replace(/rn/g,"n");var t="";for(var n=0;n&amp;lt;e.length;n++){var r=e.charCodeAt(n);if(r&amp;lt;128){t+=String.fromCharCode(r)}else if(r&amp;gt;127&amp;amp;&amp;amp;r&amp;lt;2048){t+=String.fromCharCode(r&amp;gt;&amp;gt;6|192);t+=String.fromCharCode(r&amp;amp;63|128)}else{t+=String.fromCharCode(r&amp;gt;&amp;gt;12|224);t+=String.fromCharCode(r&amp;gt;&amp;gt;6&amp;amp;63|128);t+=String.fromCharCode(r&amp;amp;63|128)}}return t},_utf8_decode:function(e){var t="";var n=0;var r=c1=c2=0;while(n&amp;lt;e.length){r=e.charCodeAt(n);if(r&amp;lt;128){t+=String.fromCharCode(r);n++}else if(r&amp;gt;191&amp;amp;&amp;amp;r&amp;lt;224){c2=e.charCodeAt(n+1);t+=String.fromCharCode((r&amp;amp;31)&amp;lt;&amp;lt;6|c2&amp;amp;63);n+=2}else{c2=e.charCodeAt(n+1);c3=e.charCodeAt(n+2);t+=String.fromCharCode((r&amp;amp;15)&amp;lt;&amp;lt;12|(c2&amp;amp;63)&amp;lt;&amp;lt;6|c3&amp;amp;63);n+=3}}return t}}

//fin de código

Ahora muestro un ejemplo para realizar la codificación y decodificación:

Codificar en base64:


//codificar en base64
//variable con contenido "patito"
var variable="patito"

//codificamos a base64 utilizando Base64.encode
var variableBase64=Base64.encode(variable)

//imprimimos el valor
document.writeln(variableBase64);
//imprime cGF0aXRv

Decodificar en base64:


//decodificar en base64
var variableBase64="cGF0aXRv"

//decodificamos a base64 utilizando Base64.decode
var variable=Base64.decode(variableBase64)

//imprimimos el valor
document.writeln(variable);

Marcar activa una opción de un menú al darle clic con #jquery

Ejemplo (da clic en una opción).

Para hacer que un menú nos indique cual es la opción activa, o la sección en que nos encontramos en una página web podemos hacer uso de los selectores de jquery y la función addClass y removeClass.

A continuación anexo el código que permite hacer esto.

Css


#menu .opcion{
	width:20%;
	float:left;
	cursor:pointer;
	background:#ddd;
	color:#000;
	padding:5px 0px 5px 0px;
	text-align:center;

}

#menu .opcionActiva{

	background:#000;
	color:#fff;
}

Html


<div id="menu">
    	<div class="opcion">opción 1</div>
       	<div class="opcion">opción 2</div>
        <div class="opcion">opción 3</div>
        <div class="opcion">opción 4</div>
        <div class="opcion">opción 5</div>
</div>

Javascript


$(document).ready(function(){

	//selector a la clase opcion para darle función al evento click
	$(".opcion").click(function(){

		//eliminamos la clase activa por si una opción la contiene
		$(".opcion").removeClass("opcionActiva");

		//asignamos la clase opcionActiva a la opción presionada
		$(this).addClass("opcionActiva")

	})
})

Simplemente hago uso de addClass y removeClass de jquery para añadir o remover la clase de CSS opcionActiva.

La función addClass sirve para agregar una clase de css a un elemento y la función removeClass sirve para lo contrario.