Tu Portal de Programacion

Controladores MVC de diferentes DLL

2015-03-31T10:17:00.001-06:00

¡Buenos días!

El día de hoy les compartiré un pequeño código de MVC de como mapear los controladores que se encuentran en diferentes DLL o carpetas dentro del mismo sitio.

MVC trabaja con un archivo de configuración llamado RouteConfig, dentro de la carpeta App_start en el cual se mapean las rutas de nuestros controladores, por default, este busca en la carpeta Controllers, que es donde MVC reconoce los controladores creados.

Supongamos que tenemos un sitio modular, donde tenemos diferentes DLL, en la cual puede haber controladores que necesitamos utilizar o incluso APIControllers, para ello en el método static que se encuentra en el archivo antes mencionado, agregamos el atributo namespace a lo que ya viene por default, y agregamos los namespaces de las demás DLL donde buscara las rutas y/o bien el namaspace de nuestro mismo proyecto donde alojamos los controladores pero en diferente carpeta.

Código Editado:

public static void RegisterRoutes(RouteCollection routes)

{

//declaracion de rutas

routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

routes.MapRoute(

url: "{controller}/{action}/{id}",

defaults: new { controller = "Authentication", action = "Login", id = UrlParameter.Optional },

namespaces: new[] { "DLL1.Controllers", "DLL2.Controllers", "ProyectoPrincipal.OtraCarpeta " }

//Se indican los namaspaces de donde va a tomar las rutas de los controladores

);

}

Espero les sea Util.

Saludos cordiales!

Concatenar un Array C#

2014-12-22T12:44:00.005-06:00

Hoy les traigo una pequeña utilidad.

Supongamos que necesitamos realizar quitarle la primera palabra a una cadena de texto, esto se pudiera realizar con un substring, pero no conocemos tamaño de esa primera palabra.

Para ellos podemos realizar un split a nuestro cadena, en mi caso estoy leyendo archivos y el nombre de mis archivos tienen una numeracion la cual no quiero mostrar al usuario mi cadena es archivo.Name, para lo cual le realizo un split con el espacio como separador de todo, es decir me regresara en un array todos las palabras separadas por un espacio en blanco.

Como notaran no lo agrego a un Array, lo hago de forma directa ya que Split me retorna un Array,
A esto le agrego la funcion Skip el cual toma el elemento de esa posicion y regresa los elementos restantes.

Todo esto dentro de un string.Join, como parametro le regreso un espacion en blanco que es con el cual separe, y ya con esto me regresa mi cadena sin la primera palabra.

string.Join(" ", Path.GetFileNameWithoutExtension(archivo.Name).Split(' ').Skip(1))

Saludos cordiales!

Peticiones Ajax en MVC Parte 2

2014-11-05T22:05:00.001-06:00

Bueno amigos Continuo con esta entrega de peticiones Ajax en MVC.

Lo que prosigue es crear nuestras peticiones Ajax para cada Botón, a lo cual tenemos dos opciones, crear un archivo .JS y agregar la referencia al archivo de configuración BundleConfig.cs. (Lo comentare en otro tema).

Para este ejemplo lo are de forma directa en mi vista agregando el script y creando dos funciones una para cada petición de mi ApiController.

A continuación el código con su respectivo comentario:

function saludar() {

$.ajax({

type: "POST",//Tipo de petición

url: 'api/SaludarApi/Saludar?nombre=Gustavo',//Url a la que se hará la petición, en este caso pasamos un parámetro directo en la ruta

contentType: "application/json; charset=utf-8",//Tipo en que irán nuestros datos

dataType: "json", //Se define el tipo de dato que nos regresara nuestra petición

beforeSend: function () {

//Se ocupa para mostrar un loading o cualquier otra función, este se ejecutara mientras se realiza la petición. Aquí ocupo el plugin mencionado con anterioridad

//Instrucion para indicar que muestre el loading

$.blockUI();

success: function (result) {

//Resultado de nuestra petición, dependiente de nuestro tipo de dato que regrese puede ser un objeto de tipo json, html, etc., donde el json puede ser un Array, un Objeto simple o un dato.

alert(result); //En este caso mi método saludar concatena mi nombre con otra frase por lo tanto es un dato directo y lo muestro en un aler

//Resultado: "¡Saludos Gustavo!"

//Instrucion para indicar que oculte el loading

$.unblockUI();

error: function (xhr, textStatus, errorThrown) {//Función que cacha los errores ocurrido en nuestra petición

//Este parámetro es el que cacha el error ocurrido es nuestra petición

alert(errorThrown);

//Instrucion para indicar que oculte el loading

$.unblockUI();

}

});

}

function saludar2() {

$.ajax({

type: "POST",//Tipo de petición

url: 'api/SaludarApi/Saludar2?nombre=Gustavo',//Url a la que se hará la petición, en este caso pasamos un parámetro directo en la ruta

contentType: "application/json; charset=utf-8",//Tipo en que irán nuestros datos

dataType: "json", //Se define el tipo de dato que nos regresara nuestra petición

beforeSend: function () {

//Se ocupa para mostrar un loading o cualquier otra función, este se ejecutara mientras se realiza la petición. Aquí ocupo el plugin mencionado con anterioridad

//Instrucion para indicar que muestre el loading

$.blockUI();

success: function (result) {

//Resultado de nuestra petición, dependiente de nuestro tipo de dato que regrese puede ser un objeto de tipo json, html, etc., donde el json puede ser un Array, un Objeto simple o un dato.

alert(result.Saludo + '\n Desde: ' + result.Desde);//En esta petición nos regresa un objeto con los propiedades y puedo acceder directos, aquí tendremos que conocer el nombre de nuestra propiedad

//Resultado: "¡Saludos Gustavo! Desde tu Portal de Programación!"

//Instrucion para indicar que oculte el loading

$.unblockUI();

error: function (xhr, textStatus, errorThrown) {//Función que cacha los errores ocurrido en nuestra petición

//Este parámetro es el que cacha el error ocurrido es nuestra petición

alert(errorThrown);

//Instrucion para indicar que oculte el loading

$.unblockUI();

}

});

}

</script>

Les comparto el código de este pequeño ejemplo, lo puedes descargar dando click aquí.

Y ya saben si tienen alguna duda no duden en comentar.

Saludos Cordiales!

Peticiones Ajax en MVC Parte 1

2014-11-05T20:48:00.000-06:00

Hola amigos!

El día de hoy les traigo la forma en como realizar una petición ajax. este ejemplo esta hecho con MVC, Razor y un ApiController, se utiliza Jquery un plugin llamado BlockUI que pueden descargar de aqui

Como les comente utilizaremos un ApiController que procese nuestra solicitud y nos retorne un mensaje.

A continuación les comparto dos métodos dentro de mi ApiController, el primero me regresa un string con un saludo, y el segundo me regreso un objeto con dos propiedades.

/// <summary>

/// Metodo de mi ApiController para saludar

/// </summary>

/// <param name="nombre">Nombre de a quien saluda</param>

/// <returns>Regresa string con un saludo</returns>

public string Saludar(string nombre)

{

return string.Format("!Saludos {0}!", nombre);

}

/// <summary>

/// Metodo de mi ApiController para saludar

/// </summary>

/// <param name="nombre">Nombre de a quien saluda</param>

/// <returns>Regresa un objeto con dos propiedades</returns>

public object Saludar2(string nombre)

{

return new

{

Saludo = string.Format("!Saludos {0}!", nombre),

Desde = "Tu portal de Programación!"

};

}

Para poder utilizar las llamadas api en un proyecto MVC existe un archivo de configuración llamado WebApiConfig.cs donde esta el tipo de rutas que manejara nuestro proyecto.

El siguiente codigo tiene la configuración por default de este archivo.

Esto en el caso de que solo tengamos un método dentro de nuestro ApiController:

public static void Register(HttpConfiguration config)

{

config.Routes.MapHttpRoute(

routeTemplate: "api/{controller}/{id}",

defaults: new { id = RouteParameter.Optional }

);

}

En mi caso editare esta configuración ya que mi ApiController tiene mas de un método, y realizare llamadas a diferentes métodos.

public static void Register(HttpConfiguration config)

{

config.Routes.MapHttpRoute(

routeTemplate: "api/{controller}/{action}/{id}",

defaults: new { id = RouteParameter.Optional }

);

}

Como ejemplo en mi vista creare dos botones con sus eventos onclick como se muestra a continuacion:

<button type="button" onclick="saludar();"> Saludar</button>

<button type="button" onclick="saludar2();"> Saludar Con Mensaje</button>

En esta segunda parte veremos la petición Ajax.

Saludos Cordiales!

Error durante la serialización o deserialización mediante JavaScriptSerializer de JSON. La longitud de la cadena supera el valor establecido en la propiedad maxJsonLength

2014-10-30T23:34:00.000-06:00

El dia de hoy les traigo dos formar de solucionar el error: "Error durante la serialización o deserialización mediante JavaScriptSerializer de JSON. La longitud de la cadena supera el valor establecido en la propiedad maxJsonLength"

Este surge al serializar un objeto (Lista, Arreglo, Etc) y este excede el maximo numero de caracteres configurado en el maxJsonLength.

Para ello tenemos dos opciones:

1.- La primera es agregar unas lineas a nuestro web config, de la aplicacion.

<system.web.extensions>

</webServices>

</scripting>

</system.web.extensions>

2.- La segunda es cambiar directamente el maxJsonLength en codigo (C# en este caso), al momento de utilizarlo,

//Se crear una referencia a JavaScriptSerializer

var serializer = new JavaScriptSerializer();

//Se cambia el Length directo a nuestra referencia

serializer.MaxJsonLength = 500000000;

Cualquier duda o comentario no duden.

Saludos cordiales!

Crear XML apartir de un archivo XSD (construccion del XSD) Primera Parte

2014-10-28T23:15:00.002-06:00

Buenas tardes!

El dia de hoy les traigo un pequeño tutoría de como crear un archivo XML apartir de un archivo XSD (XML Schema Definition).

Primero empecemos con la construcción de nuestro Esquema XML (.xsd).

En nuestro proyecto damos click derecho y damos agregar nuevo elemento, en el cuadro de búsqueda escribimos Esquema XML como se muestra a continuación (Imagen 1), le damos el nombre que queramos en mi caso le pondré Prueba.xsd

Imagen 1.

Una vez agregado nuestro archivo .xsd nos mostrara el diseñador de Esquema XML, damos click en el enlace como se muestra en la siguiente imagen (Imagen 2), para poder ya trabajar con nuestro archivo.

Imagen 2.

El cual se mostrara una ventana con código XML y un nodo pschema con el id Prueba, que fue el nombre de mi archivo,posteriormente en este agregaremos nuestros nodos, de acuerdo a como lo vallamos necesitando.

Mi nodo principal o raíz se llamara DatosUsuario y se agrega con xs:element.

Nuestros atributos se crean con xs:attribute, dentro de un nodo xs:complexType.

Los xs:annotation son opcionales, solo se usan para agregar un comentario a cada campo y especificar para que se utilizan.

El ejemplo a continuación (Imagen 3) construye un XML con un nodo padre "DatosUsuario" con los atributos de este (Nombre, ApellidoPaterno, ApellidoMaterno, Edad).

Este ejemplo es sencillo, se pueden construir archivos mas complejos, con nodos hijos que a su vez tenga atributos (si tiene duda de esto pueden consultarme por medio de un mensaje en este post).

Imagen 3.

Continua en el siguiente post.

Saludos cordiales!

Leer Archivos XML desde C#

2014-10-25T17:09:00.003-05:00

Buenas tardes, el día de hoy les traigo la forma de como leer un archivo XML desde código C#.

Esto es sencillo con una de las librerías que ya tiene Visual Studio integrada, System.Xml, para eso solo es necesario hacer un using en nuestro código “using System.Xml;” Y empezamos:

Tomando como base este pequeño XML con un nodo padre y uno hijo, donde hijo tiene una propieda, este debe de estar creado en una ruta y lo asignamos a una variable string ruta

Ejemplo:

string ruta = "C:\Prueba.xml";

<?xml version="1.0" encoding="UTF-8"?>

<Padre>

</Padre>

//Creamos un objeto de tipo XmlDocumento

XmlDocument xDoc = new XmlDocument();

//Pasamos la ruta de nuestro XML a leer

xDoc.Load(ruta);

//Obtenemos el elemento padre con GetElementsByTagName por el nombre del tag y tendríamos que recorrerlo con un foreach XmlElement pero un XMl no puede llevar dos Tag raiz, asi que es más fácil con la siguiente instruccion

XmlNodeList PadrePorNombre = xDoc.GetElementsByTagName("Padre");

//Obtenemos el elemento padre sin conocer el nombre del tag

XmlElement Padre = xDoc.DocumentElement; //Nos dara el tap Padre

//Obtenemos los hijos del padre

XmlNodeList Hijos = Padre.ChildNodes;

//Recorremos los hijos para obtener su informacion

foreach (XmlElement Child in Hijos)

{

//Accedemos al atributo del hijo con GetAttribute y el nombre del atributo Este es útil cuando conocemos el nombre de nuestros nodos

string hijo = Child.GetAttribute("Saludar"); //Nos da su valor “Saludos”

//Si no conocemos los atributos de nuestro hijo obtenemos sus atributos con .Attributes y lo asignamos a un XmlAttributeCollection

XmlAttributeCollection Listahijos = Child.Attributes;

//Recomorremos los atributos de nuestro hijo para obtener sus valores, en caso que tuviera mas de un atributo nuestro hijo recorredira el ciclo foreach cada uno

foreach (XmlAttribute att in Listahijos)

{

string campo = att.Name; //Nos da el nombre del atributo que sería Saludar

string hijoatt = att.Value; // Nos da el valor del atributo “Saludos”

//Nota nuestro hijo puede tener más hijos es decir que nuestro hijo sea padre y contenga hijos, para ellos seria cuestión de obtener los hijos Child.ChildNodes

}

Espero les sea de utilidad, y si tiene alguna duda no duden.

Saludos cordiales!

Ejecutar Cadena varchar como query

2014-08-09T22:21:00.004-05:00

Un pequeño tip de SQL server

Si alguna vez por necesidad necesitan hacer lo que hacemos en C# o en algun otro lenguaje, de ir concatenando en un string nuestro query y ejecutarlo, igual se puede hacer desde SQL ^^

Para ello tenemos esta pequeña instrucción de sql EXEC

--se declara la variable varchar dependiendo de cuanta informacion queramos utilizar le ponemos un tamaño

declare @sql varchar(1000)

--Se inicializa el query puede ser construido desde un cursor, o de validaciones, esta abierto a la imaginacion

SET @sqlt = 'Query'

--Con esta instrucción se ejecuta

EXEC (@sqlt)

Espero les sea util saludos cordiales

Creacion de PDF apartir de un GridView

2014-08-09T21:47:00.002-05:00

Hoy les traigo otra ayuda de ITextsharp ^^. Manos a la obra.

Me vi en la necesidad de crear un reporte en itextsharp desde una grid, hubiera sido fácil renderizar y enviarlo al pdf, pero debido a la información se dividía en dos partes la hoja y no la podia personalizar, por lo cual tuve que hacerlo de forma manual con ITextSharp, para lo cual cree una clase que lo realiza, la cual les comparto dos metodos a continuacion.

Nota: Lo menejo en clases por que se pudiera volver a ocupar en otros lados del proyecto o en otros proyectos.

Retomando mi post Anterior Crear reporte con ItextSharp en C# con tabla, utilizare la clase TablaPDF que tiene mi metodo celda para el llenado de las celdas de la tabla y tenemos lo siguiente:

//Esta es el metodo que realiza el trabajo, los parámetros los pueden manejar a su gusto, el primero si es importante

/// <summary>

///Clase para crear un PDF apartir de un grid

/// </summary>

/// <param name="gv">Parámetro importante, ya que a partir de este se realiza la creación del PDF</param>

/// <param name="titulo"></param>

/// <param name="fechacorte"></param>

/// <returns></returns>

public string GridToPdf(GridView gv, string titulo, string fechacorte)

{

//Creación de documento, como ya se ha visto en post anteriores

string ruta = "";

Document doc = new Document(iTextSharp.text.PageSize.A4.Rotate());

doc.AddAuthor("GUstavo Ortiz Gamez");

doc.AddKeywords("pdf, PdfWriter; Documento; iTextSharp");

doc.SetMargins(40.0f, 100.0f, 30.0f, 10f);

ruta = HttpContext.Current.Server.MapPath(@"~\" + "GridToPDF.pdf");

PdfWriter wri = null;

wri = PdfWriter.GetInstance(doc, new FileStream(ruta, FileMode.Create));

doc.Open();

//Esta clase es donde guardo mis metodos para crear las celdas.

TablaPDF tp = new TablaPDF();

iTextSharp.text.Rectangle page = doc.PageSize;

//Se obtiene el total de columnas del grid del row 0 que vendrían siendo las columnas

int totalc = gv.Rows[0].Cells.Count;

//Creación de la tabla, solo que aquí le pasamos el total previamente obtenido

PdfPTable table = new PdfPTable(totalc);

table.WidthPercentage = 100;

table.TotalWidth = page.Width - 95;

table.LockedWidth = true;

table.HorizontalAlignment = 0;

//Ocupo dos tablas por el encabezado, pero es a su gusto

PdfPTable table1 = new PdfPTable(3);

table1.WidthPercentage = 100;

table1.TotalWidth = page.Width - 95;

table1.LockedWidth = true;

table1.HorizontalAlignment = 0;

#region titulodocumento

//Aquí envió una imagen, eso lo puedes agregar en la clase previamente compartida y hacen una sobrecarga del método para que mapee la imagen en vez de texto con iTextSharp.text.Image en vez de paragraph:

//iTextSharp.text.Image imagen = iTextSharp.text.Image.GetInstance("Ruta Imagen");

//PdfPCell header = new PdfPCell(imagen, false);

string rutai = HttpContext.Current.Server.MapPath(@"~\" + @"themes\default\images\reportes\logotipopiasahorizontal.jpg");

table1.AddCell(tp.celdaimg(rutai, 3, 3, 1, 0, 348, 80));

table1.AddCell(tp.celda("\n", 8, 2, 6, 1, 0));

table1.AddCell(tp.celdanegrita(titulo, 3, 1, 14, 1, 0, "White", BaseColor.BLACK));

table1.AddCell(tp.celda("\n", 8, 2, 6, 1, 0));

table1.AddCell(tp.celdanegrita(fechacorte, 3, 1, 14, 1, 0, "White", BaseColor.BLACK));

doc.Add(table1);

doc.Add(new Paragraph("\n"));

#endregion

#region contenido

//cabecera del grid

for (int i = 0; i < totalc; i++)

{

//Con esta línea obtengo la cabecera de mi grid, para esto deben de configurar su grid como lo vallan a utilizar

//Utilizo un método para limpiar unos caracteres que al momento de extraer de mi grid los pone con código ascii

table.AddCell(tp.celdanegrita(LimpiaTexto(gv.HeaderRow.Cells[i].Text), 1, 1, 8, (i == 0 ? 0 : 1), 13, "#F29401", BaseColor.WHITE));

}

//contenido del grid

int cstyle = 1;

int bnd = 0;

//Empezamos a recorrer el grid para obtener los rows

foreach (GridViewRow row in gv.Rows)

{

//Este código es para ir entrelazando los colores de cada row,

string color = "";

if (cstyle == 0)

{

color = "white";

cstyle = 1;

}

else

{

cstyle = 0;

color = "#EFEFEF";

}

//Por cada row sacamos las celdas y vamos construyendo nuestra tabla pdf

for (int i = 0; i < row.Cells.Count; i++)

{

//Este es un método sobrecargado de acuerdo a mis requerimientos y lo maneje en una clase

table.AddCell(tp.celda(row.Cells[i].Text.Replace(" ", ""), 1, 1, 8, 1, 14, color, BaseColor.WHITE));

}

//Este parte es por si necesitan cerrar su tabla con algún pie de página o si tu grid tiene footer.

if (bnd == 0)

{

//pie

for (int i = 0; i < totalc; i++)

{

table.AddCell(tp.celda(" ", 1, 1, 8, (i == 0 ? 0 : 1), 14, "#F29401", BaseColor.WHITE));

}

doc.Add(table);

#endregion

doc.Close();

return ruta;

}

/// <summary>

/// Metodo para limpiar los códigos ASCII

/// </summary>

/// <param name="texto">Texto a Limpiar </param>

/// <returns> Regresa el texto con el carácter correspondiente</returns>

public string LimpiaTexto(string texto)

{

return texto.Replace("á", "á").Replace("é", "é").Replace("í", "í").Replace("ó", "ó").Replace("ú", "ú");

}

Ya con esto si lo manejamos en una clase solo la instanciamos o bien si la vuelven estatica solo la invocan y el gridview lo asignan ya sea de BD, de una lista, de una tabla o del proveedor de datos que elijan.

No olviden hacer lo siguiente en su Grid

Grid.DataSource= Datos;

Grid.DataBind();

Espero les sea util y ya saben cualquier duda, estoy a sus atencion.

Saludos Cordiales!

Crear reporte con ItextSharp en C# con tabla

2014-07-27T19:22:00.000-05:00

Un poco lejos desde mi último post. Les traigo la otra parte de cómo crear un reporte con ItextSharp pero ahora con uso de tablas de ItextSharp.

Útiles cuando se necesita crear un documento con texto en columnas o texto a diferentes sangrías sin estar colocándolo con coordenadas.

Los pasos para utilizar la herramienta de ITextsharp son los mismos que en el Post anterior, solo que ahora la construcción es diferente para lo cual utilizaremos la propiedad PdfPTable. Y utilizaremos el objeto doc.

Document doc = new Document(iTextSharp.text.PageSize.LETTER);

Empezamos declarando nuestro objeto tabla (Les pongo el código solo para copiar y pegar en su VS)

iTextSharp.text.Rectangle page = doc.PageSize; //Obtenemos el tamaño total de la pagina

PdfPTable table = new PdfPTable(8); //Declaramos el objeto PdfPTable y especificamos el ancho de las columas a utilizar

table.WidthPercentage = 80;//Le damos un tamaño a la tabla, esta tomara en porcierto el ancho que ucupara

table.TotalWidth = page.Width - 90; //Le damos el tamaño de la tabla

table.LockedWidth = true;//Decimos que se bloque el tamaño de la tabla, esto para que no creesca dependiendo de la información

float[] widths = new float[] { .8f, .8f, .8f, .8f, .8f, .8f, .8f, .8f }; //Declaramos un array con los tamaños de nuestras columnas deben de coincidir con el tamaño de columnas

table.SetWidths(widths); //Agregamos los anchos a nuestra tabla

Con estos pasos ya tenemos la construcción de nuestra tabla, ahora viene lo bueno, en el post anterior vimos cómo ir insertando texto en cada renglón, en este caso el proceso es igual de laborioso ya que iremos insertando celda por celda con ayuda de AddCell.

//Agregamos una valor a nuestra celda de nuestra tabla

table.AddCell(new PdfPCell(new Paragraph("Texto Celda 1")));

Aquí agregamos a nuestra tabla en la celda 1 un nuevo objeto de tipo PdfPCell lo cual dentro recibe un objeto de tipo Paragraph en cual vimos que se utiliza para agregar texto a nuestro formulario y en este caso a nuestra celda.

Ahora bien como recordaran declaramos nuestra tabla con 8 columnas, para ir agregando texto a cada celda, no hay que especificar en qué celda queremos insertar texto. Solo basta con ir escribiendo como se muestra a continuación:

table.AddCell(new PdfPCell(new Paragraph("Texto Celda 1")));

table.AddCell(new PdfPCell(new Paragraph("Texto Celda 2")));

table.AddCell(new PdfPCell(new Paragraph("Texto Celda 3")));

table.AddCell(new PdfPCell(new Paragraph("Texto Celda 4")));

table.AddCell(new PdfPCell(new Paragraph("Texto Celda 5")));

table.AddCell(new PdfPCell(new Paragraph("Texto Celda 6")));

table.AddCell(new PdfPCell(new Paragraph("Texto Celda 7")));

table.AddCell(new PdfPCell(new Paragraph("Texto Celda 8")));

Esto nos creara nuestra primera fila (row de la tabla). Para continuar en la siguiente fila solo basta con volver a crear otra instrucción con el nuevo texto, ItextSharp nos ira acomodando los textos en su respectivo lugar

Cabe mencionar que si queremos dejar un espacio vacío entre la celda 1 y 3 es decir en la celda 2, dentro de nuestro Paragraph le podemos poner (""), de igual forma si queremos un texto dentro de la misma celda con un salto de carro solo ponemos ("\n").

Ahora van las ventajas de uso de tablas para construir el reporte dentro de ItextSahrp. En mi caso particular me fue útil en muchos aspecto, a nuestro objeto de tipo PdfPCell le podemos especificar que queremos la celda con borde, la alineación vertical y horizontal, el color de la celda, etc. Para lo cual yo construí un método de tipo PdfPCell que me recibe los parámetros de configuración de mi celda, y este me regresara un objeto del mismo tipo. Les comparto mi código para facilitar su aprendizaje y les comentos cada uno de los atributos que tiene.

public PdfPCell celda(string Texto, int collspan, int rowspan, float tamaño, int alignment, int borde, BaseColor colorTexto, string colorCelda)

{

//Creamos un Objeto de tipo PdfPCell en el cual agregamos directo nuestro texto como vera utilizo Paragraph con un tipo de letra en mi caso fijo pero si lo desean pueden enviarlo como parametro, un tamaño y un color de letra que se envian como parametro

PdfPCell CeldaPDF = new PdfPCell(new Paragraph(Texto, FontFactory.GetFont("Calibri", tamaño, colorTexto)));

//Este codigo es referente a los border, como podran ver tengo varias combinancaciones para poner el borde deseado

#region "borde"

if (borde == 0)

{

CeldaPDF.Border = 0;

}

else

{

if (borde == 1)

{

CeldaPDF.Border = iTextSharp.text.Rectangle.BOTTOM_BORDER;

}

else

{

if (borde == 2)

{

CeldaPDF.Border = iTextSharp.text.Rectangle.TOP_BORDER;

}

else

{

if (borde == 3)

{

CeldaPDF.Border = iTextSharp.text.Rectangle.LEFT_BORDER;

}

else

{

if (borde == 4)

{

CeldaPDF.Border = iTextSharp.text.Rectangle.RIGHT_BORDER;

}

else

{

if (borde == 5)

{

CeldaPDF.Border = iTextSharp.text.Rectangle.BOTTOM_BORDER | iTextSharp.text.Rectangle.TOP_BORDER | iTextSharp.text.Rectangle.LEFT_BORDER | iTextSharp.text.Rectangle.RIGHT_BORDER;

}

else

{

if (borde == 6)

{

CeldaPDF.Border = iTextSharp.text.Rectangle.BOTTOM_BORDER | iTextSharp.text.Rectangle.LEFT_BORDER;

}

else

{

if (borde == 7)

{

CeldaPDF.Border = iTextSharp.text.Rectangle.BOTTOM_BORDER | iTextSharp.text.Rectangle.RIGHT_BORDER;

}

else

{

if (borde == 8)

{

CeldaPDF.Border = iTextSharp.text.Rectangle.TOP_BORDER | iTextSharp.text.Rectangle.LEFT_BORDER;

}

else

{

if (borde == 9)

{

CeldaPDF.Border = iTextSharp.text.Rectangle.TOP_BORDER | iTextSharp.text.Rectangle.RIGHT_BORDER;

}

#endregion

//Indicamos que queremos un color de fondo, el parametro enviado es un strign donde vendra nuestro color por default si no lo indican es blanco

CeldaPDF.BackgroundColor = new BaseColor(System.Drawing.ColorTranslator.FromHtml(colorCelda));

//En caso de querer poner un collspan indicamos el numero de columnas que abarcara

CeldaPDF.Colspan = collspan;

//Lo mismo si es un rowspan, indicaremos el numero de filar que abarcara

CeldaPDF.Rowspan = rowspan;

//Indicamos la alineacion horizontal

CeldaPDF.HorizontalAlignment = alignment;

//Indicamos la alineacion vertical

CeldaPDF.VerticalAlignment = alignment;

//Regresamos nuestra celda ya formateada

return CeldaPDF;

}

Ahora con este método solo basta con especificar lo siguiente:

table.AddCell(tp. celda ("Celda 1", 1, 1, 14, Element.ALIGN_CENTER, 0, BaseColor.BLACK, "White"));

Esto igual por cada celda a utilizar, y ya por último solo basta con agregar nuestra tabla a nuestro documento para que lo incruste y salga en nuestro impreso final:

doc.Add(table);

Es un proceso laborioso pero muy útil, ya que nos da control total sobre nuestro documento.

Eh estado un poco retirado por cuestiones laborales, espero les sea útil y ya saben si tiene duda con este información, no duden en comentarme.

Saludos cordiales.

Error: Sys.ArgumentNullException:value cannot be null,parameter name:panelsCreated[2]

2012-12-13T11:42:00.000-06:00

Problemas con este mensaje "Sys.ArgumentNullException:value cannot be null,parameter name:panelsCreated[2]" a la hora de publicar su aplicacion web en el IIS.

Solo basta con agregar a nuestro ScriptManager o ToolkitScriptManager según la versión de ajax que utilicen la propiedad ScriptMode = "Release" en vista diseño o en código en el Page_Load ScriptMode = Release;

y asunto arreglado.

Saludos cordiales!

Crear reporte con ItextSharp en C# sin tabla

2012-11-14T20:52:00.000-06:00

Veremos como crear un reporte PDF con ITextSharp en C# sin el uso de tablas, esto dejara el texto lineal y abra que ir acomodándolo. Para ello necesitamos importar la librería de ItextSharp a nuestro proyecto, podemos descargarlo de la red o bien desde el mismo vs a partir de la versión 2010 con el administrador de paquetes NuGet y luego agregar la referencia con using iTextSharp.text.

Primero empezamos declarando una variable de tipo document en el cual le agregamos el tamaño de nuestro documento en este caso es tipo carta, podemos elegir de otros tipos como A4, oficio, etc.

Document doc = new Document(iTextSharp.text.PageSize.LETTER);

Definimos al autor y el tipo de palabras claves al igual que los margenes

doc.AddAuthor("Gustavo Ortiz Gamez");

doc.AddKeywords("pdf, PdfWriter; Documento; iTextSharp");

doc.SetMargins(10.0f, 10.0f, 10.0f, 10f);

Aquí ocupamos una variable de tipo string con la ruta y nombde del archivo

string rut = @"C:\doc.pdf";

Procedemos a crear el documento en la ruta antes establecida

PdfWriter wri = PdfWriter.GetInstance(doc, new FileStream(rut, FileMode.Create));

Abrimos el documento a ocupar

doc.Open();

Y empezamos a escribir nuestro texto para lo cual declaramos una variable de tipo paragraph en la cual vamos a definir el formato de nuestro texto, como alignment para definir la justificacion, Font para el tipo y tamañao de letra, y con Add agregamos el texto que vamos a ocupar

Paragraph paragraph = new Paragraph();

paragraph.Alignment = Element.ALIGN_RIGHT;

paragraph.Font = FontFactory.GetFont("Arial", 9);

paragraph.Add("Esto es una prueba);

Y solo basta con agregar esta variable paragraph a nuestro documento.

Para continuar agregando texto es necesario ir agregando nuevos paragraph

doc.Add(paragraph);

Limpianos nuestro paragraph por si queremos definir otro tipo de formato o tipo de letra

paragraph.Clear();

paragraph.Font = FontFactory.GetFont("Arial", 14, Font.BOLD);

paragraph.Add("Prueba PDF");

doc.Add(paragraph);

paragraph.Clear();

Para agregar saltos de linea solo basta con agregar “\n” a nuestro documento

doc.Add(new Paragraph("\n"));

Podemos agregar imágenes a nuestro documento con la siguiente instruccion

iTextSharp.text.Image imgpfd = iTextSharp.text.Image.GetInstance(@"C:\images\imgprueba.jpg"); //Dirreccion a la imagen que se hace referencia

imgpfd.SetAbsolutePosition(50, 50); //Posicion en el eje carteciano de X y Y

imgpfd.ScaleAbsolute(200, 200);//Ancho y altura de la imagen

doc.Add(imgpfd); // Agrega la imagen al documento

Una vez terminado de escribir nuestro documento procedemos a cerrar el documento con:

doc.Close();

y con esto tendremos nuesotr documento en la ruta que definimos al principio

Este es un pequeñop tip para poder abrir nuestro documento desde la pagina web donde nos dara la opcion de descargarlo

Response.Clear();

Response.ClearContent();

Response.ClearHeaders();

Response.AddHeader("Content-Disposition", "attachment; filename=Nombrearchivo.pdf");

Response.ContentType = "application/pdf";

Response.TransmitFile(rut);

Response.End();

Con esto terminamos este pequeño tutorial, la continuacion de este es como crear el reporte pero con una el uso de tablas, que a mi me a funcionado mejor que estar escribiendo el texto plano.

Cualquier duda o comentario estoy a sus ordenes.

Saludos cordiales!

Denegado el acceso al archivo del informe. Es posible que esté abierto en otro programa.

2012-10-25T00:15:00.003-05:00

¿Les a parecido este mensaje una vez publicado su proyecto web en el servidor IIS "Denegado el acceso al archivo del informe. Es posible que esté abierto en otro programa."?

Para corregir este detalle necesitamos darlos los permisos de escritura sobre la carpeta Temp, que es donde se crea este archivo por default antes de mostrarse en nuestra pagina, y la carpeta se encuentra en C:\Windows\, solo basta con darle los permisos al usuario de IIS_IUSRS.

Saludos cordiales!

Crear reporte con Sap Crystal Reports

2012-10-24T23:54:00.001-05:00

El día de hoy les traigo la forma de crear un reporte con Sap Crystal Reports desde c#, que es una muy buena herramienta con los controles mejorados y muy vistosos. Pero vallamos al grano como siempre.

Desde nuestro Visual Studio en nuestro proyecto previamente creado, agregamos un nuevo archivo de tipo de datos, el cual será nuestro DataSet, el cual contendrá la estructura de nuestra tabla de BD que vamos a utilizar. Una vez abierto el diseñador agregamos una TablaAdapter con el clic derecho de nuestro mouse o desde el cuadro de herramientas (Imagen 1), una vez agregada la TablaAdapter, procedemos a configurar nuestra conexión a BD, o bien seleccionamos la que se esté utilizando en el proyecto.

Imagen 1.

Una vez ingresada nuestra nueva conexión o seleccionada, nos muestra 3 opciones, donde podemos escoger:

· Usar instrucciones SQL: podemos utilizar un select de alguna tabla.

· Crear nuevos procedimientos almacenados: podemos crear un procedimiento almacenado directamente.

· Usar un procedimiento almacenado: Nos muestra los procedimientos que existen en nuestra BD.

Para este ejemplo utilizaremos usar instrucción SQL, e la cual podemos poner Select * from unidades, donde en mi BD tengo la tabla unidades con los campos idunidad, Nombre, Activo, fechaAlta y usuario, y damos en finalizar. Una vez creada la tabla tendrá la siguiente forma.

Imagen2

Una vez creado nuestro dataset, vamos a nuestra pagina.aspx a la cual le pondré Reporte1.aspx, y agregamos un control CrystalReportViewer que esta en el cuadro de herramientas, en el apartado creación de informes, en caso de que no este, una vez instalado el Sap Cryrtal report en nuestro cuadro de herramientas y no lo de en automático, con clic derecho y la opción “elegir elementos” y buscamos y seleccionamos en componentes de .Net Framework los elementos CrystalReportViewer, CrystalReportSoruce, una vez hecho esto deben de aparecer los elementos en nuestro cuado de herramientas (Imagen 3).

Imagen 3

Solo basta con arrastrar el control a nuestro diseñador, una vez en él nos muestra por default la ventana de Tareas de Crystal ReportViewer donde nos da la opción de crear nuestro informe en la opción elegir un origen de informe (Imagen 4), damos clic sobre <Nuevo origen de informe…>

Imagen 4

Y nos creara el informe en automático, una vez creado el reporte podemos manipularlo con los datos de nuestro dataset que se encuentra en el explorador de campos (Imagen 5).

Imagen 5

Para ello solo basta con arrastrarlos a nuestro reporte en la sección de detalles (Imagen 6), de forma automática se agrega el nombre del campo en el encabezado de página, estos encabezados se puede editar a nuestro gusto, o bien podemos agregar líneas o cuadros, según nuestras necesidades.

Imagen 6

Una vez configurado nuestro reporte volvemos a nuestra pagina Reporte.aspx y agregamos un control CrystalReportSource, el cual nos dará la opción de configurar el origen del informe, y seleccionamos el que creamos previamente (Imagen 7).

Imagen 7

Una vez hecho esto, agregamos un control ObjectDataSource el cual configuraremos el origen de datos, en el combo Elegir un objeto comercial, nos pondrá las TablaAdapter que tenemos en nuestro dataset, damos siguiente y nos mostrara las funciones que podemos realizar (Imagen 8) en nuestro caso como fue un select nos da de primera instancia en Elegir un método: el GetData() que se configuro en nuestra TablaAdapter, en las demás pestañas si no se va a interactuar con ellas podemos dejar ninguno, paso siguiente damos finalizar, en este paso cuando seleccionamos un vez de un select normal, y ponemos un procedimiento que reciba parámetros, este mismo nos da la opción de escoger un control de donde tomar los datos parámetro, ya sea un combo o un hidden.

Imagen 8

Una vez configurado nuestro ObjectDataSource, volvemos a nuestro control CrystalReportSoucer, y en vista Código agregamos después de <Report > una etiqueta <DataSources> como se muestra a continuación:

<CR:CrystalReportSource ID="CrystalReportSource1" runat="server">

<CR:DataSourceRef DataSourceID="ObjectDataSource1" TableName="Unidades" />

</DataSources>

</Report>

</CR:CrystalReportSource>

Con esto vinculamos nuestro ObjectDataSource con nuestro reporte, paso seguido podemos correr nuestra aplicación.

Les dejo el código de nuestra pagina Reporte1.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Reporte1.aspx.cs" Inherits="SapCrystalReports.Reporte1" %>

<%@ Register Assembly="CrystalDecisions.Web, Version=13.0.2000.0, Culture=neutral, PublicKeyToken=692fbea5521e1304"

Namespace="CrystalDecisions.Web" TagPrefix="CR" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

</head>

<body>

<div>

<CR:CrystalReportViewer ID="CrystalReportViewer1" runat="server" AutoDataBind="True"

GroupTreeImagesFolderUrl="" Height="1202px" ReportSourceID="CrystalReportSource1"

ToolbarImagesFolderUrl="" ToolPanelWidth="200px" Width="1104px" />

<CR:CrystalReportSource ID="CrystalReportSource1" runat="server">

<CR:DataSourceRef DataSourceID="ObjectDataSource1" TableName="Unidades" />

</DataSources>

</Report>

</CR:CrystalReportSource>

<asp:ObjectDataSource ID="ObjectDataSource1" runat="server" OldValuesParameterFormatString="original_{0}"

SelectMethod="GetData" TypeName="SapCrystalReports.DataSet1TableAdapters.UnidadesTableAdapter">

<%-- Cuando es un procedimiento, o alguna funciones que lleve parametros, al configurar el objectdatasource muestra que necesita los parametros y los tipos de datos.

Ejemplo, el control saldria asi, haciendo referencia a tres combobox, que al cambiar uno ese actualizara el reporte.

<asp:ControlParameter ControlID="DropDown1" Name="unidad" PropertyName="SelectedValue"

Type="Int32" />

<asp:ControlParameter ControlID="DropDown2" Name="año" PropertyName="SelectedValue"

Type="Int32" />

<asp:ControlParameter ControlID="DropDown3" Name="activo" PropertyName="SelectedValue"

Type="Int32" />

</SelectParameters>

--%>

</asp:ObjectDataSource>

</div>

</form>

</body>

</html>

Y aquí el link de descarga del proyecto que esta en Visual Studio 2010.

Descarga de ejemplo.

Espero les halla sido de utilidad, cualquier duda o comentario no duden en realizarla.

Saludos cordiales!

Abrir un archivo (Excel, Word, PDF, Etc.) desde aspx

2012-10-19T16:50:00.000-05:00

Les traigo otro código para asp.net, que es como poder abrir un archivo desde c# .net, básicamente es abrir, por que anteriormente con el IE6 lo mostraba en la misma pagina como la hace Google con cierto archivos, ahora en las nuevas versiones de IE7 en adelante lo da como descarga de archivo.

Vamos a nuestro cometido.

Para poder realizar este proceso, es necesario contar con la ruta del archivo y las siguientes referencias a nuestro proyecto:

using System;

using System.Web;

using System.IO;

y luego solo poner el siguiente codigo

Asignamos la ruta del archivo o una variable o bien pasarlo directa

string ruta = "Ruta archivo";

Definimos un arreglo de tipo Byte

Byte[] arrContent;

Una variable FileStream

FileStream FS;

Inicializamos nuestra variable

FS = null;

Y ahora si extraemos la informacion de nuestro archivo y lo guardamos en nuestra variable FS

FS = new FileStream(ruta, FileMode.Open, FileAccess.Read, FileShare.ReadWrite);

Ahora procedemos a obtener nuestro archivo en bytes lo guardamos en otro arreglo de tipo Byte

Byte[] Input = new byte[FS.Length];

Ahora es hora de empezar a leer el archivo y lo guardamos en nuestroarreglo de typo byte y este a su bez a arrContent

FS.Read(Input, 0, int.Parse(FS.Length.ToString()));

arrContent = (byte[])Input;

Aquí declaramos el tipo de archivo con el cual estamos trabajando

string conType = "application/pdf"; //Aqui dependemos de los mime types que necesitemos, en este caso es un pdf, mas abajo encontraran la lista de los mime types.

Agregamos a nuestro response el contentype

Response.ContentType = conType;

Y Ahora si procedemos a lanzar el archivo a pantalla, como comente arriba, con IE6 mostraba el archivo en pantalla, ahora lo lanza como una descarga de archivo

Response.OutputStream.Write(arrContent, 0, arrContent.Length);

Limpiamos y cerramos nuestra variable FS por que si no, no suelta el archivo y nos muestra un error de que el archivo esta siendo ocupado por otro proceso.

FS.Close();

FS.Dispose();

FS = null;

Listado de MimeTypes de Microsfot.

Tipo de MIME	Extensión
application/msword	.doc
application/msword	.dot
application/vnd.openxmlformats-officedocument.wordprocessingml.document	.docx
application/vnd.openxmlformats-officedocument.wordprocessingml.template	.dotx
application/vnd.ms-word.document.macroEnabled.12	.docm
application/vnd.ms-word.template.macroEnabled.12	.dotm
application/vnd.ms-excel	.xls
application/vnd.ms-excel	.xlt
application/vnd.ms-excel	.xla
application/vnd.openxmlformats-officedocument.spreadsheetml.sheet	.xlsx
application/vnd.openxmlformats-officedocument.spreadsheetml.template	.xltx
application/vnd.ms-excel.sheet.macroEnabled.12	.xlsm
application/vnd.ms-excel.template.macroEnabled.12	.xltm
application/vnd.ms-excel.addin.macroEnabled.12	.xlam
application/vnd.ms-excel.sheet.binary.macroEnabled.12	.xlsb
application/vnd.ms-powerpoint	.ppt
application/vnd.ms-powerpoint	.pot
application/vnd.ms-powerpoint	.pps
application/vnd.ms-powerpoint	.ppa
application/vnd.openxmlformats-officedocument.presentationml.presentation	.pptx
application/vnd.openxmlformats-officedocument.presentationml.template	.potx
application/vnd.openxmlformats-officedocument.presentationml.slideshow	.ppsx
application/vnd.ms-powerpoint.addin.macroEnabled.12	.ppam
application/vnd.ms-powerpoint.presentation.macroEnabled.12	.pptm
application/vnd.ms-powerpoint.template.macroEnabled.12	.potm
application/vnd.ms-powerpoint.slideshow.macroEnabled.12	.ppsm

Listado de MimeTypes existentes.

Tipo de MIME	Extensión
application/acad	.dwg
application/arj	.arj
application/base64	.mm
application/base64	.mme
application/binhex	.hqx
application/binhex4	.hqx
application/book	.boo
application/book	.book
application/cdf	.cdf
application/clariscad	.ccad
application/commonground	.dp
application/drafting	.drw
application/dsptype	.tsp
application/dxf	.dxf
application/envoy	.evy
application/excel	.xl
application/excel	.xla
application/excel	.xlb
application/excel	.xlc
application/excel	.xld
application/excel	.xlk
application/excel	.xll
application/excel	.xlm
application/excel	.xls
application/excel	.xlt
application/excel	.xlv
application/excel	.xlw
application/fractals	.fif
application/freeloader	.frl
application/futuresplash	.spl
application/gnutar	.tgz
application/groupwise	.vew
application/hlp	.hlp
application/hta	.hta
application/i-deas	.unv
application/iges	.iges
application/iges	.igs
application/inf	.inf
application/java	.clas
application/java-byte-code	.clas
application/lha	.lha
application/lzx	.lzx
application/mac-binary	.bin
application/mac-binhex	.hqx
application/mac-binhex40	.hqx
application/mac-compactpro	.cpt
application/macbinary	.bin
application/marc	.mrc
application/mbedlet	.mbd
application/mcad	.mcd
application/mime	.aps
application/mspowerpoint	.pot
application/mspowerpoint	.pps
application/mspowerpoint	.ppt
application/mspowerpoint	.ppz
application/msword	.doc
application/msword	.dot
application/msword	.w6w
application/msword	.wiz
application/msword	.word
application/mswrite	.wri
application/netmc	.mcp
application/octet-stream	.a
application/octet-stream	.arc
application/octet-stream	.arj
application/octet-stream	.bin
application/octet-stream	.com
application/octet-stream	.dump
application/octet-stream	.exe
application/octet-stream	.lha
application/octet-stream	.lhx
application/octet-stream	.lzh
application/octet-stream	.lzx
application/octet-stream	.o
application/octet-stream	.psd
application/octet-stream	.save
application/octet-stream	.uu
application/octet-stream	.zoo
application/oda	.oda
application/pdf	.pdf
application/pkcs-12	.p12
application/pkcs-crl	.crl
application/pkcs10	.p10
application/pkcs7-mime	.p7c
application/pkcs7-mime	.p7m
application/pkcs7-signature	.p7s
application/pkix-cert	.cer
application/pkix-cert	.crt
application/pkix-crl	.crl
application/plain	.text
application/postscript	.ai
application/postscript	.eps
application/postscript	.ps
application/powerpoint	.ppt
application/pro_eng	.part
application/pro_eng	.prt
application/ringing-tones	.rng
application/rtf	.rtf
application/rtf	.rtx
application/sdp	.sdp
application/sea	.sea
application/set	.set
application/sla	.stl
application/smil	.smi
application/smil	.smil
application/solids	.sol
application/sounder	.sdr
application/step	.step
application/step	.stp
application/streamingmedia	.ssm
application/toolbook	.tbk
application/vda	.vda
application/vnd.fdf	.fdf
application/vnd.hp-hpgl	.hgl
application/vnd.hp-hpgl	.hpg
application/vnd.hp-hpgl	.hpgl
application/vnd.hp-pcl	.pcl
application/vnd.ms-excel	.xlb
application/vnd.ms-excel	.xlc
application/vnd.ms-excel	.xll
application/vnd.ms-excel	.xlm
application/vnd.ms-excel	.xls
application/vnd.ms-excel	.xlw
application/vnd.ms-pki.certstore	.sst
application/vnd.ms-pki.pko	.pko
application/vnd.ms-pki.seccat	.cat
application/vnd.ms-pki.stl	.stl
application/vnd.ms-powerpoint	.pot
application/vnd.ms-powerpoint	.ppa
application/vnd.ms-powerpoint	.pps
application/vnd.ms-powerpoint	.ppt
application/vnd.ms-powerpoint	.pwz
application/vnd.ms-project	.mpp
application/vnd.nokia.configuration-message	.ncm
application/vnd.nokia.ringing-tone	.rng
application/vnd.rn-realmedia	.rm
application/vnd.rn-realplayer	.rnx
application/vnd.wap.wmlc	.wmlc
application/vnd.wap.wmlscriptc	.wmls
application/vnd.xara	.web
application/vocaltec-media-desc	.vmd
application/vocaltec-media-file	.vmf
application/wordperfect	.wp
application/wordperfect	.wp5
application/wordperfect	.wp6
application/wordperfect	.wpd
application/wordperfect6.0	.w60
application/wordperfect6.0	.wp5
application/wordperfect6.1	.w61
application/x-123	.wk1
application/x-aim	.aim
application/x-authorware-bin	.aab
application/x-authorware-map	.aam
application/x-authorware-seg	.aas
application/x-bcpio	.bcpi
application/x-binary	.bin
application/x-binhex40	.hqx
application/x-bsh	.bsh
application/x-bsh	.sh
application/x-bsh	.shar
application/x-bytecode.elisp	.elc
application/x-bytecode.python	.pyc
application/x-bzip	.bz
application/x-bzip2	.boz
application/x-bzip2	.bz2
application/x-cdf	.cdf
application/x-cdlink	.vcd
application/x-chat	.cha
application/x-chat	.chat
application/x-cmu-raster	.ras
application/x-cocoa	.cco
application/x-compactpro	.cpt
application/x-compress	.z
application/x-compressed	.gz
application/x-compressed	.tgz
application/x-compressed	.z
application/x-compressed	.zip
application/x-conference	.nsc
application/x-cpio	.cpio
application/x-cpt	.cpt
application/x-csh	.csh
application/x-deepv	.deep
application/x-director	.dcr
application/x-director	.dir
application/x-director	.dxr
application/x-dvi	.dvi
application/x-elc	.elc
application/x-envoy	.env
application/x-envoy	.evy
application/x-esrehber	.es
application/x-excel	.xla
application/x-excel	.xlb
application/x-excel	.xlc
application/x-excel	.xld
application/x-excel	.xlk
application/x-excel	.xll
application/x-excel	.xlm
application/x-excel	.xls
application/x-excel	.xlt
application/x-excel	.xlv
application/x-excel	.xlw
application/x-frame	.mif
application/x-freelance	.pre
application/x-gsp	.gsp
application/x-gss	.gss
application/x-gtar	.gtar
application/x-gzip	.gz
application/x-gzip	.gzip
application/x-hdf	.hdf
application/x-helpfile	.help
application/x-helpfile	.hlp
application/x-httpd-imap	.imap
application/x-ima	.ima
application/x-internett-signup	.ins
application/x-inventor	.iv
application/x-ip2	.ip
application/x-java-class	.clas
application/x-java-commerce	.jcm
application/x-javascript	.js
application/x-koan	.skd
application/x-koan	.skm
application/x-koan	.skp
application/x-koan	.skt
application/x-ksh	.ksh
application/x-latex	.late
application/x-latex	.ltx
application/x-lha	.lha
application/x-lisp	.lsp
application/x-livescreen	.ivy
application/x-lotus	.wq1
application/x-lotusscreencam	.scm
application/x-lzh	.lzh
application/x-lzx	.lzx
application/x-mac-binhex40	.hqx
application/x-macbinary	.bin
application/x-magic-cap-package-1.0	.mc$
application/x-mathcad	.mcd
application/x-meme	.mm
application/x-midi	.mid
application/x-midi	.midi
application/x-mif	.mif
application/x-mix-transfer	.nix
application/x-mplayer2	.asx
application/x-msexcel	.xla
application/x-msexcel	.xls
application/x-msexcel	.xlw
application/x-mspowerpoint	.ppt
application/x-navi-animation	.ani
application/x-navidoc	.nvd
application/x-navimap	.map
application/x-navistyle	.stl
application/x-netcdf	.cdf
application/x-netcdf	.nc
application/x-newton-compatible-pkg	.pkg
application/x-nokia-9000-communicator-add-on-softw	.aos
application/x-omc	.omc
application/x-omcdatamaker	.omcd
application/x-omcregerator	.omcr
application/x-pagemaker	.pm4
application/x-pagemaker	.pm5
application/x-pcl	.pcl
application/x-pixclscript	.plx
application/x-pkcs10	.p10
application/x-pkcs12	.p12
application/x-pkcs7-certificates	.spc
application/x-pkcs7-certreqresp	.p7r
application/x-pkcs7-mime	.p7c
application/x-pkcs7-mime	.p7m
application/x-pkcs7-signature	.p7a
application/x-pointplus	.css
application/x-portable-anymap	.pnm
application/x-project	.mpc
application/x-project	.mpt
application/x-project	.mpv
application/x-project	.mpx
application/x-qpro	.wb1
application/x-rtf	.rtf
application/x-sdp	.sdp
application/x-sea	.sea
application/x-seelogo	.sl
application/x-sh	.sh
application/x-shar	.sh
application/x-shar	.shar
application/x-shockwave-flash	.swf
application/x-sit	.sit
application/x-sprite	.spr
application/x-sprite	.spri
application/x-stuffit	.sit
application/x-sv4cpio	.sv4c
application/x-sv4crc	.sv4c
application/x-tar	.tar
application/x-tbook	.sbk
application/x-tbook	.tbk
application/x-tcl	.tcl
application/x-tex	.tex
application/x-texinfo	.texi
application/x-troff	.roff
application/x-troff	.t
application/x-troff	.tr
application/x-troff-man	.man
application/x-troff-me	.me
application/x-troff-ms	.ms
application/x-troff-msvideo	.avi
application/x-ustar	.usta
application/x-visio	.vsd
application/x-visio	.vst
application/x-visio	.vsw
application/x-vnd.audioexplosion.mzz	.mzz
application/x-vnd.ls-xpix	.xpix
application/x-vrml	.vrml
application/x-wais-source	.src
application/x-wais-source	.wsrc
application/x-winhelp	.hlp
application/x-wintalk	.wtk
application/x-world	.svr
application/x-world	.wrl
application/x-wpwin	.wpd
application/x-wri	.wri
application/x-x509-ca-cert	.cer
application/x-x509-ca-cert	.crt
application/x-x509-ca-cert	.der
application/x-x509-user-cert	.crt
application/x-zip-compressed	.zip
application/xml	.xml
application/zip	.zip
audio/aiff	.aif
audio/aiff	.aifc
audio/aiff	.aiff
audio/basic	.au
audio/basic	.snd
audio/it	.it
audio/make	.funk
audio/make	.my
audio/make	.pfun
audio/make.my.funk	.pfun
audio/mid	.rmi
audio/midi	.kar
audio/midi	.mid
audio/midi	.midi
audio/mod	.mod
audio/mpeg	.m2a
audio/mpeg	.mp2
audio/mpeg	.mpa
audio/mpeg	.mpg
audio/mpeg	.mpga
audio/mpeg3	.mp3
audio/nspaudio	.la
audio/nspaudio	.lma
audio/s3m	.s3m
audio/tsp-audio	.tsi
audio/tsplayer	.tsp
audio/vnd.qcelp	.qcp
audio/voc	.voc
audio/voxware	.vox
audio/wav	.wav
audio/x-adpcm	.snd
audio/x-aiff	.aif
audio/x-aiff	.aifc
audio/x-aiff	.aiff
audio/x-au	.au
audio/x-gsm	.gsd
audio/x-gsm	.gsm
audio/x-jam	.jam
audio/x-liveaudio	.lam
audio/x-mid	.mid
audio/x-mid	.midi
audio/x-midi	.mid
audio/x-midi	.midi
audio/x-mod	.mod
audio/x-mpeg	.mp2
audio/x-mpeg-3	.mp3
audio/x-mpequrl	.m3u
audio/x-nspaudio	.la
audio/x-nspaudio	.lma
audio/x-pn-realaudio	.ra
audio/x-pn-realaudio	.ram
audio/x-pn-realaudio	.rm
audio/x-pn-realaudio	.rmm
audio/x-pn-realaudio	.rmp
audio/x-pn-realaudio-plugin	.ra
audio/x-pn-realaudio-plugin	.rmp
audio/x-pn-realaudio-plugin	.rpm
audio/x-psid	.sid
audio/x-realaudio	.ra
audio/x-twinvq	.vqf
audio/x-twinvq-plugin	.vqe
audio/x-twinvq-plugin	.vql
audio/x-vnd.audioexplosion.mjuicemediafile	.mjf
audio/x-voc	.voc
audio/x-wav	.wav
audio/xm	.xm
chemical/x-pdb	.pdb
chemical/x-pdb	.xyz
drawing/x-dwf	.dwf
i-world/i-vrml	.ivr
image/bmp	.bm
image/bmp	.bmp
image/cmu-raster	.ras
image/cmu-raster	.rast
image/fif	.fif
image/florian	.flo
image/florian	.turb
image/g3fax	.g3
image/gif	.gif
image/ief	.ief
image/ief	.iefs
image/jpeg	.jfif
image/jpeg	.jpe
image/jpeg	.jpeg
image/jpeg	.jpg
image/jutvision	.jut
image/naplps	.nap
image/naplps	.napl
image/pict	.pic
image/pict	.pict
image/pjpeg	.jfif
image/pjpeg	.jpe
image/pjpeg	.jpeg
image/pjpeg	.jpg
image/png	.png
image/png	.x-pn
image/tiff	.tif
image/tiff	.tiff
image/vasa	.mcf
image/vnd.dwg	.dwg
image/vnd.dwg	.dxf
image/vnd.dwg	.svf
image/vnd.fpx	.fpx
image/vnd.net-fpx	.fpx
image/vnd.rn-realflash	.rf
image/vnd.rn-realpix	.rp
image/vnd.wap.wbmp	.wbmp
image/vnd.xiff	.xif
image/x-cmu-raster	.ras
image/x-dwg	.dwg
image/x-dwg	.dxf
image/x-dwg	.svf
image/x-icon	.ico
image/x-jg	.art
image/x-jps	.jps
image/x-niff	.nif
image/x-niff	.niff
image/x-pcx	.pcx
image/x-pict	.pct
image/x-portable-anymap	.pnm
image/x-portable-bitmap	.pbm
image/x-portable-graymap	.pgm
image/x-portable-greymap	.pgm
image/x-portable-pixmap	.ppm
image/x-quicktime	.qif
image/x-quicktime	.qti
image/x-quicktime	.qtif
image/x-rgb	.rgb
image/x-tiff	.tif
image/x-tiff	.tiff
image/x-windows-bmp	.bmp
image/x-xbitmap	.xbm
image/x-xbm	.xbm
image/x-xpixmap	.pm
image/x-xpixmap	.xpm
image/x-xwd	.xwd
image/x-xwindowdump	.xwd
image/xbm	.xbm
image/xpm	.xpm
message/rfc822	.mht
message/rfc822	.mhtm
message/rfc822	.mime
model/iges	.iges
model/iges	.igs
model/vnd.dwf	.dwf
model/vrml	.vrml
model/vrml	.wrl
model/vrml	.wrz
model/x-pov	.pov
multipart/x-gzip	.gzip
multipart/x-ustar	.usta
multipart/x-zip	.zip
music/crescendo	.mid
music/crescendo	.midi
music/x-karaoke	.kar
paleovu/x-pv	.pvu
text/asp	.asp
text/css	.css
text/html	.acgi
text/html	.htm
text/html	.html
text/html	.htx
text/html	.shtm
text/mcf	.mcf
text/pascal	.pas
text/plain	.c
text/plain	.c++
text/plain	.cc
text/plain	.com
text/plain	.conf
text/plain	.cxx
text/plain	.def
text/plain	.f
text/plain	.f90
text/plain	.for
text/plain	.g
text/plain	.h
text/plain	.hh
text/plain	.idc
text/plain	.jav
text/plain	.java
text/plain	.list
text/plain	.log
text/plain	.lst
text/plain	.m
text/plain	.mar
text/plain	.pl
text/plain	.sdml
text/plain	.text
text/plain	.txt
text/richtext	.rt
text/richtext	.rtf
text/richtext	.rtx
text/scriplet	.wsc
text/sgml	.sgm
text/sgml	.sgml
text/tab-separated-values	.tsv
text/uri-list	.uni
text/uri-list	.unis
text/uri-list	.uri
text/uri-list	.uris
text/vnd.abc	.abc
text/vnd.fmi.flexstor	.flx
text/vnd.rn-realtext	.rt
text/vnd.wap.wml	.wml
text/vnd.wap.wmlscript	.wmls
text/webviewhtml	.htt
text/x-asm	.asm
text/x-asm	.s
text/x-audiosoft-intra	.aip
text/x-c	.c
text/x-c	.cc
text/x-c	.cpp
text/x-component	.htc
text/x-fortran	.f
text/x-fortran	.f77
text/x-fortran	.f90
text/x-fortran	.for
text/x-h	.h
text/x-h	.hh
text/x-java-source	.jav
text/x-java-source	.java
text/x-la-asf	.lsx
text/x-m	.m
text/x-pascal	.p
text/x-script	.hlb
text/x-script.csh	.csh
text/x-script.elisp	.el
text/x-script.guile	.scm
text/x-script.ksh	.ksh
text/x-script.lisp	.lsp
text/x-script.perl	.pl
text/x-script.perl-module	.pm
text/x-script.phyton	.py
text/x-script.rexx	.rexx
text/x-script.scheme	.scm
text/x-script.sh	.sh
text/x-script.tcl	.tcl
text/x-script.tcsh	.tcsh
text/x-script.zsh	.zsh
text/x-server-parsed-html	.shtm
text/x-server-parsed-html	.ssi
text/x-setext	.etx
text/x-sgml	.sgm
text/x-sgml	.sgml
text/x-speech	.spc
text/x-speech	.talk
text/x-uil	.uil
text/x-uuencode	.uu
text/x-uuencode	.uue
text/x-vcalendar	.vcs
text/xml	.xml
video/animaflex	.afl
video/avi	.avi
video/avs-video	.avs
video/dl	.dl
video/fli	.fli
video/gl	.gl
video/mpeg	.m1v
video/mpeg	.m2v
video/mpeg	.mp2
video/mpeg	.mp3
video/mpeg	.mpa
video/mpeg	.mpe
video/mpeg	.mpeg
video/mpeg	.mpg
video/msvideo	.avi
video/quicktime	.moov
video/quicktime	.mov
video/quicktime	.qt
video/vdo	.vdo
video/vivo	.viv
video/vivo	.vivo
video/vnd.rn-realvideo	.rv
video/vnd.vivo	.viv
video/vnd.vivo	.vivo
video/vosaic	.vos
video/x-amt-demorun	.xdr
video/x-amt-showrun	.xsr
video/x-atomic3d-feature	.fmf
video/x-dl	.dl
video/x-dv	.dif
video/x-dv	.dv
video/x-fli	.fli
video/x-gl	.gl
video/x-isvideo	.isu
video/x-motion-jpeg	.mjpg
video/x-mpeg	.mp2
video/x-mpeg	.mp3
video/x-mpeq2a	.mp2
video/x-ms-asf	.asf
video/x-ms-asf	.asx
video/x-ms-asf-plugin	.asx
video/x-msvideo	.avi
video/x-qtc	.qtc
video/x-scm	.scm
video/x-sgi-movie	.movi
video/x-sgi-movie	.mv
windows/metafile	.wmf
www/mime	.mime
x-conference/x-cooltalk	.ice
x-music/x-midi	.mid
x-music/x-midi	.midi
x-world/x-3dmf	.3dm
x-world/x-3dmf	.3dmf
x-world/x-3dmf	.qd3
x-world/x-3dmf	.qd3d
x-world/x-svr	.svr
x-world/x-vrml	.vrml
x-world/x-vrml	.wrl
x-world/x-vrml	.wrz
x-world/x-vrt	.vrt
xgl/drawing	.xgz
xgl/movie	.xmz

Abrir ventana emergente con javascript y ajax desde c#

2012-10-19T10:32:00.004-05:00

Anteriormente publique un articulo llamado Abrir popup con JavaScript donde se abre el popup utilizando javascript, con la función ya incrustada desde el lado del cliente. Existen otras formas de poder realizar esto, una es escribir el código directo en una variable y ejecutarlo con un response.write desde nuestra pagina aspx.cs o aspx.vb, dependiendo del lenguaje.

Pues bien ahora les traigo otra forma de lograrlo, dentro de una pagina que tiene controles Ajax, si han utilizado Ajax en sus paginas web, habrán notado que no se lleva muy bien con los scripts de javascript. Para ello existe una solución de realizar el cometido.

Una pagina que utiliza Ajax, necesita de un ScriptManager, esto nos impide ejecutar los códigos de Ajax, y si lo hacemos desde un response.write, se ejecuta la acción pero la pagina se desconfigura. Para ello existe la siguiente solución.

Dentro de la clase ScriptManager, viene un método llamado RegisterClientScriptBlock, con el cual podemos ejecutar nuestro window.open.

String Clientscript = "window.open(‘pagina.aspx')";

ScriptManager.RegisterClientScriptBlock(this, this.GetType(),"newWindow", Clientscript, true);

Como podrán darse cuenta si han ejecutado un response.write con la función de abrir una ventana lleva antes del window.open la instrucción de que es script

Con este sencillo comando se ejecuta nuestro script y no habrá problema con la pagina de que se llegue a cuatrapear.

Otra forma de abrir una nueva ventana, sin necesidad de utilizar el response.write y la página no tiene Ajax es con el ClientScript

String Clientscript = "<script>window.open('pagina.aspx"')</script>";

Me.ClientScript.RegisterStartupScript(this.GetType(), "WOpen", Clientscript, true);

Se podrán dar cuenta que es similar pero aquí se ejecuta dentro del cliente, y es el mismo efecto, no afecta para nada la pagina, como lo aria un response.write y la instrucción es diferente al abrir la ventana en vez de "newWindow" ahora es "WOpen"

Sin mas por el momento espero les halla sigo util, ya saben si tienen dudas o comentarios no duden en publicarlo.

Saludos cordiales!

Crear excel desde asp, web, c#

2012-10-18T23:28:00.001-05:00

Después de hace tiempo sin publicar nada, por fin me llego la inspiración, mentira jeje, eh tenido algo de trabajo, y adquiriendo nuevos conocimientos de los cuales estoy gusto a compartir con ustedes, pues bien vamos al grano.

¿Se han topado con la necesidad de crear un Excel desde web? si es así, supongo que han probado con interop la vendita herramienta que nos da Microsoft, que si bien le e utilizado en varias ocasiones en aplicaciones de escritorio mas que nada, donde no existe ningún problema, pues bien al querer hacerlo nos topamos con muchos problemas de seguridad y configuración que no nos lo permiten, bueno a mi en lo personal eh tratado de echar a andar esa herramienta en un server 2008 sin éxito.

Pues bien después de buscar por mucho tiempo y haciendo investigación sobre las nuevas tecnologías que van saliendo, pude diseñar una dll para poder realizar el cometido con éxito, Tomando en cuenta que solo trabaja con archivos xlsx es decir versión de office 2010 en adelante.

Pues bien les describiré las características de la herramienta que cree brevemente.

Trabaja sobre una plantilla, no necesaria mente pero en este caso lo utilicé así por cuestiones de un requerimiento en mi trabajo. puede ser un archivo en blanco siempre y cuando este en un lugar de la pc y claro se tenga acceso.
El uso de la herramienta es sencilla recibe una lista que igual ofrece la dll con los siguientes datos.

Se inicializa una hoja en la cual se va a trabar, ejemplo Hoja 1, sheet 1 .
Como en interop se trabaja con posición, es decir se le envía la posición en la cual queremos trabajar, Ejemplo A1.
Se le envía el texto a mostrar en la celda tomando en cuenta que pueden ser valores numéricos, texto y formulas, en las formulas soporta cualquiera ejemplo (=Sum(A1:B1)
Recibe como parámetro el tipo de texto, 1 para string, 2 para numérico y 3 para formula.

Podrán encontrar la descripción de la explicación en forma de código mas adelante, ahora bien para inicializar el llamado, es como instancias una clase, y asignarle los parámetros que necesita.

Para utilizar esta herramienta solo basta con importarla al proyecto la dll y hacer la referencia con el código

Using CreaExcel;

CreaExcel.CreaExcel reporte = new CreaExcel.CreaExcel ("nombre archivo.xlsx", "c:\reportes", "nombre templete.xlsx");

Una vez creado el archivo procedemos a hacer el llenado del Excel, para ello utilizamos la clase DatosExcel que contiene la dll

Declaramos primero una lista de tipo DatosExcel, ya que la función que trae reporte recibe una lista con las posiciones, texto y tipo de dato.

List<DatosExcel> listadatos = new List<DatosExcel>();

Luego declaramos una variable de tipo DatosExcel, esto lo tendremos que hacer por cada celda, ahora si la información viene de un dataset o de una consulta, podemos meter esto en un ciclo e ir ingresando los datos hasta tener la lista llena.

DatosExcel listdatos = new DatosExcel();
listdatos.Hoja = "Hoja1";
listdatos.Posicion = "A1";
listdatos.Texto = "Ejemplo"; // listdatos.Texto = "=SUM(A1:B1)" // listdatos.Texto = 12345
listdatos.Tipo = 1; // listdatos.Tipo=3 // listdatos.Tipo = 2

listadatos.Add(listdatos)

Una vez llenada la lista procedemos a crear el reporte con la variable antes creada reporte de tipo CreaExcel.CreaExcel.

Solo accedemos al método CreateReport y pasamos la lista con los valores a ingresar. Este método regresa la ruta donde se creo el archivo.

reporte.CreateReport(listadatos);

Este método viene sobrecargado, ya que en el caso de utilizar plantillas como fue mi caso, que necesitaba una grafica y ciertos cálculos que no fue necesario ordenar desde la creación, se sobrecarga con otra lista.

List<DatosExcel> Actualizadatos = new List<DatosExcel>();

Donde por ejemplo, supongamos que llenamos la celda A1 a la C1, con los valores numéricos 10, 23,50, si utilizamos la llamada con un solo parámetro, tendríamos que poner un elemento mas en la lista indicando una suma “=SUM (A1:C1)” en la celda D1 de tipo 3, pues bien si tenemos ya una plantilla donde en la celda D1 tiene ya la formula indicada de suma, con la lista Actualizadatos solo basta con agregarle un elemento con la hoja de trabajo y la posición donde se encuentra la formula, esto actualizara la formula y ara que se ejecute.

listdatos = new DatosExcel();
listdatos.Hoja = "Hoja1";
listdatos.Posicion = "A1";
Actualizadatos.Add(listdatos);

Y de esta forma hacemos el llamado para poder llenar los datos sobre la plantilla.

reporte.CreateReport(listadatos, Actualizadatos);

Aqui el link de descarga de la dll, espero les sea Util.
Descarga haciendo clic aqui.
o Aqui (Nuevo Link)

Si tienen alguna duda o comentario no olviden dejarlo en el apartado correspondiente.

Saludos cordiales y disculpen la ausencia!

Acceder a un control con JavaScript dentro de un ContentPlaceHolder

2012-01-16T13:58:00.000-06:00

Uno de los problemas que enfrente a la hora de trabajar con paginas maestras, de querer validad un formulario dentro de un ContentPlaceHolder es obtener el Id del control.
como este ejemplo que normalmente ocupamos en nuestros códigos

document.getElementById("txtnombre").value

Probando varios ejemplo lo intente hacerlo con el código que aparece en html de nuestra caja de texto

ctl00_ContentPlacePaginaMaestra_txtnombre

Una de las opciones en javascript es acceder con este nombre directamente

document.getElementById('ctl00_ContentPlacePaginaMaestra_txtnombre').value

Aquí arriesgamos un poco nuestras validaciones ya que si cambiamos el nombre la pagina maestra afectaría nuestro código.

la manera mas sencilla es utilizando el Id de nuestro control con un ClientId para que nos lo reconosca

document.getElementById('<%=txtnombre.ClientID %>').value

Canvas en HTML 5 (degradado)

2011-05-20T00:01:00.000-05:00

CANVAS es un elemento no estándar que permite dibujar gráficos directamente sobre el HTML. es decir podemos realizar por medio de trazos. lineas, colores, etc imagenes desde código JavaScript. Inicialmente lo implementó Apple para Safari, pero ahora es WHATWG (Web Hypertext Application Technology Working Group) quien se encarga de su estandarización.

Al no ser un estándar, se han levantado voces en contra de ello, sobre todo existiendo el SVG que realizaría la misma función. La cuestión sobre cual es más correcto, si el SVG o CANVAS, es algo de lo que ya se ha tratado y aunque en ambos casos se puede hacer lo mismo, parece que el SVG gana por ser un estándar y sobre todo cuando se quiere que haya interacción con el usuario, aunque CANVAS sea más útil a la hora de dibujar.

Bien con esta breve descripción de lo que es CANVAS, les traigo el siguiente ejemplo de lo que podemos realizar con HTML 5 y JavaScript.

Ejemplo:

Descripcion:
Bien para ello tenemos lo siguiente, dentro de nuestro cuerpo (body) de HTML la etiqueta llamada canvas podemos definir el alto y ancho de nuestra elemento así como un estilo para el borde como se muestra a continuación:

<canvas height="400px" id="gradiente" style="border: 1px solid black;" width="400px">
Tu navegador no soporta canvas
</canvas>

Dentro de nuestra etiqueta podemos colocar un texto. A lo cual nuestro elemento si no es soportado por nuestro navegador mostrara el mensaje en vez del contenido.

Es importante notar que le coloque un id a mi elemento canvas, esto para poder manejarlo en mi siguiente código.

Declaramos un script de tipo javascript para poder realizar una gradiente dentro de nuestro elemento, para ellos declaramos variables donde obtenemos el control de nuestro gradiente, otro variable donde obtenemos un contexto en 2d ( aun no existe 3d) para poder realizar nuestro cometido.

<script type="text/javascript">
var c=document.getElementById("gradiente");
var cxt= c.getContext("2d");
Seguido por otra variable donde empezamos a crear una linea de gradiente y le asignamos los valores que deseamos, para ello tenemos 4 posiciones en nuestra propiedad createLinearGradient donde los primero significan dos significan a partir de que punto de X y Y empieza nuestra transformación, las siguientes posiciones a partir de que tramo se inicializa nuestro gradiente, podemos jugar con ellos para poder ir viendo como interactúa.
var grd= cxt.createLinearGradient(0,0,400,400);

Bueno una vez declarado nuestros valores, empezamos a dibujar nuestros gradientes, para ello con la propiedad addColorStop, con sus dos valores o parámetros, donde 0 a 1 es área de dibujo, es decir de 0 a 400, seguido por el color que deseamos dibujar.
grd.addColorStop(0,"White");
grd.addColorStop(.125,"darkblue");
grd.addColorStop(.25,"blue");
grd.addColorStop(.375,"darkred");
grd.addColorStop(.5,"red");
grd.addColorStop(.625,"darkgreen");
grd.addColorStop(.75,"green");
grd.addColorStop(.875,"yellow");
grd.addColorStop(1,"Black");

Una vez declarado los valores procedemos a asignar nuestro gradiente a nuestro control y así poder imprimirlo en nuestro canvas.
cxt.fillStyle=grd;
cxt.fillRect(0,0,400,400);

</script>

Nótese que si damos click derecho a nuestro canvas con la gradiente, este lo reconoce como una imagen, y nos da la opción de poder guardarlo como tal.

Espero les halla sido claro este pequeño ejemplo y si tienen dudas no duden en comentarlo.
Saludos Cordiales.

Atte.
LSCA Gustavo Ortiz Gámez.

Formulario en HTML 5 y CSS3

2011-05-19T15:07:00.000-05:00

Practicando con nuevas tecnologías encontré estas mancuerna que me dejo sorprendido, y mas por el alcancé que se manejan con ellas, algo similar a lo que nos ofrece AJAX y Flash. En este caso les traigo un formulario creado con puro HTML y CSS, el único inconveniente es que no todos los navegadores lo soportan (Firefox4, Internet Explorer 9, Chrome, Opera), es una lastima que aun no cuenten con el soporte al 100% para esta tecnología de punta.

Bueno lo que les traigo como lo había mencionado es un formulario, donde los primeros campos es decir nombre y apellido tiene un validador con CSS donde nos pone una sombra de color verlo los campos requeridos. continuando con el campo Email, con un otro tipo de validador, en este caso pone un asombra de color rojo el control donde se escribe, en caso de que estuviera incorrecto o no tenga el formato deseable (Algo similar a un post anterior donde se valida con JavaScript).
Posteriormente sigue un campo fecha, en este caso no se aprecia de forma correcta, ( a decir verdad a partir de este campo ya no se aprecia lo que quería mostrarles a no ser que utilizen Opera como navegador).

Para desgracia o ventaja de muchos estas funciones solo son compatibles con Opera 11.

Se los explicare de forma breve lo que realizan los siguientes campos con los controles input, con diversos tipos de Type.

Fecha (type="date"): Despliega un calendario donde se puede escoger la fecha que se refleja en nuestro control.

Rating (type="range"): Este control puede ser muy útil, ya que nos prime escoger un valor que va de un máximo a un minino sin necesidad de escribirlo.

Escoge un Color (type="color"): Este control en lo particular me agrado mucho, nos ofrece un despliegue como el que trae flash, en el cual nos permite escoger el color que seleccionemos.

¿Que te parece esta Blog? (type="number"): Este control es muy similar al que utilizo en rating, pero nos muestra las flechitas para subir o bajar el numero, de igual forma con un max y min.

Formulario con HTML 5 y CSS 3
Nombre:
Apellido:
Email:
Fecha:
Rating:
Escoge un Color:
¿Que te parece esta Blog?

Espero les halla gustado este post sobre un poco de html, si necesitan el código de este formulario no duden en pedírmelo.

Para visualizar mejor este formulario y vean lo sorprendente que es HTML 5 y CSS 3, les recomiendo instalar Opera 11 en el siguiente link Clic para Descargar.

Atte.

LSCA:. Gustavo Ortiz Gamez.

Abrir popup con JavaScript

2011-05-03T13:40:00.000-05:00

El día de hoy les hablare como poder abrir una nueva venta con JavaScript independiente de la que ya tenemos abierta, es decir un popup.
Esto es muy simple, solo invocamos una función de window llamada open, la cual recibe 3 parámetros importantes de tipo string:

El primero es el nombre de la página que deseamos abrir entre comillas, puede ser una página html, aspx, etc.
Seguido por el nombre de la venta o popup.
Paso seguido las características de la ventana es decir:

alto y ancho de la ventana (width, height)
resizable: con yes o no dependiendo si permitiremos que la venta se puede hacer mas grande.
toolbar: con yes o no si no queremos mostrar la barra de herramientas.
menubar: para esconder la barra de menus,
status: para determinar si mostraremos la barra de status.
scrollbars: esta en caso de que nuestro contenido tenga cierto tamaño y no sea necesaria las barras de desplazamiento.

Les comparto el código con el cual realizo esta acción.

<script type="text/javascript">
function abrir()
{
window.open("close.html","ventana","width=900, height=600, resizable=no, toolbar=yes, menubar=yes, status= yes, scrollbars=yes")
}
</script>

Con este código dentro de nuestro <head> como siempre, lo podemos asignar a nuestro botón html, o algún otro control de nuestro agrado.

<input onclick="abrir()" type="button" value="abrir ventana" />

Ejemplo funcionando:

PD. En esta popup encontraran la forma de como cerrar la ventana abierta por medio de JavaScript.

Si tienen algún problema con el código para cerrar la ventana, con el navegador FIREFOX, les dejo los pasos que seguí para que me aceptara la función, estos pasos aclaro fueron copiados de un foro, solo paso el tip para que puedan comprobar su funcionamiento. Con Internet Explorer no ahí problema alguno.

Pasos en firefox:
1. Abrir Mozilla
2. en la bara de direccion ingresas el siguiente texto
de la misma forma que esta escrito, sin comillas 'about:config'
3. luego dan enter.
4. Aceptamos tener cuidado.
5. En la ventana carga todas la variables de configuracion y hay buscamos la siguiente: 'dom.allow_scripts_to_close_windows';
6. cambianos el estado de false a true, asiendo clic sobre esta opcion.
7. cerramos mozilla.
8. ya podemos probar el codigo.

Si tienen alguna duda no duden en comentarlo,
Saludos cordiales!

Atte.

LSCA.Gustavo Ortiz Gámez.

Validar formulario con JavaScript

2011-05-02T23:24:00.000-05:00

El día hablaremos de como poder validar un formulario de HTML, como por ejemplo una página donde nos piden un registro para ingresar, todo esto en HTML ya que si lo hiciéramos con algún lenguaje de programación con C# o VB, lo podríamos realizar por medio de código.

Bien para ello recordemos que nuestro código de javascript, normalmente va dentro de <head></head> bueno para ello les dejo un código con el cual se puede realizar lo comentado con todo y mis comentarios.

<head>

// JavaScript Document en este apartado especificamos que es un script dentro de nuestra pagina html y definimos de que tipo es

function valida() {

// declaramos el nombre de nuestra funcion y a su vez declaramos una variable que funcionara como bandera para determinar si es verdadero o falso.

var banOK = true;

//recordando que con document.getElementById("idcontrol") buscamos dentro el formulario o pagina el control deseado y poder acceder asi a sus atributos que nos proporciona, recordando que idcontrol es el id de nuestro control

//validar la longitud del texto de un control text

if (document.getElementById("idcontrol").value.length < 1) {

banOK = false;

}

//validar si nuestro control text esta vacío

if (document.getElementById("idcontrol").value != "") {

banOK = false;

}

//validar que el texto de nuestro control sea de tipo numérico

if (isNaN(document.getElementById("idcontrol").value)) {

banOK = false;

}

//validar un control check box

if (document.getElementById("idcontrol").checked) {

banOK = false;

}

//validar si el texto de nuestro texto tiene formato de email con un expresión regular

var expresion = /^[0-9a-z_\-\.]+@[0-9a-z\-\.]+\.[a-z]{2,4}$/i;

if (!expresion.test(document.getElementById("idcontrol").value)) {

banOK = false;

}

//en todos los casos si entraba por las validaciones se cambia el valor de la bandera a false, esto quiere decir que la validación encontró algún dato mal.

if (!BanOK) {

//y por último, esto sería un plus mandar un mensaje de alerta donde si no pasaba la validación, se envía un mensaje

alert("Error en formulario");

}

return banOK;

//El return de nuestra función, cuando regresa un falso la página no realiza ningún cambio.

}

</script>

</head>

<body>

//dentro de form declaramos nuestra llamada por medio de onsubmit a nuestra función de javascript

</form>

</body>

Espero les sea de utilidad este código, y si tienen dudas, no duden en comentarlo.....

Un saludo Cordial y que tengan un excelente inicio de semana....

Atte.

LSCA Gustavo Ortiz Gámez.

Imagen de Sustitución con CSS y JavaScript

2011-04-29T02:04:00.000-05:00

El dia de hoy les mostrare como crear una imagen de sustitución, que es el efecto que se muestra al pasar el mouse por enzima de una imagen o texto. y para ello les traigo dos formar de lograrlo.

La primera es utilizando CSS, para lo cual tenemos el siguiente codigo:

.caja{

background: url(Imagen 1) no-repeat;

height:80px;

width:80px;

text-align:center;

}

.caja:hover{

background: url(Imagen 2) no-repeat;

}

</style>

que pegaremos antes del </head> de nuestro codigo html.

donde vemos que ya tenemos nuestro estilo caja, donde definimos nuestro fondo, el tamaño, la alineacion, etc. como se puede observar en background estoy poniendo la url de mi imagen que sera la primera que se mostrara al cargar nuestra pagina. Cabe aclarar que toy utilizando una imagen con fondo trnasparente, si gustaran ponerle un color de fondo para apreciar mejor el efecto seria de la siguiente forma:

background:#E8F4C1 url(Imagen 1) no-repeat;

Donde como paso primero se le asigna el color deseado y posteriormente dentro de la misma declaracion la url de nuestra imagen.

Paso seguido a esto pones una pseudo-clase de caja con hover (similar a rollover de flash) para poder realizar el cambio o sustitucion de nuestra imagen por otra, a lo cual queda de la siguiente forma

.caja:hover{

background: url(https://sites.google.com/site/jdxtavo/files/3.png) no-repeat;

}

</style>

Teniendo nuestro estilo ya definido procedemos a crear el efecto, para ello utilizo un div al cual le asigno la clase caja para que herede sus propiedades.

</div>

con ello ya tenemos nuestro efecto creado, que se veria asi:

si quisieramos perzonalizar nuestro efeco, dentro de nuestro div, podriamos poner otra imagen con un link a otra pagina, para ello tenemos el siguiente codigo.

</a>

</div>

y con ello tendriamos el efecto como se muestra a continuacion.

La segunda forma es utilizando javascript.

En esta parte lo podemos realizar mediante Dreamweaver, ya que nos proporciona en vista diseño la forma de realizarlo. para ello solo basta ir a nuestro barra de menus - insertar - Objetos de imagen - Imagen de sustitución (Ver imagen 1).

Imagen1

Imagen 1.

Paso seguido a esto nos muestra la siguiente ventana (Ver imagen 2):

Imagen 2

Imagen 2.

Donde:

En nombre de imagen: le damos un nombre a nuestra imagen.

Imagen origen: la primera imagen que se muestra al cargar nuestra pagina.

Imagen de sustitución: la imagen que se mostrara al pasar el mouse sobre la primera.

Texto alternatico: el texto que muestra nuestra imagen. como submenu y por ultimo.

Al hacerse clic, ir a URL: aqui especificamos la direccion o link al cual queremos que nos dirija una vez que demos clic.

Pasando a la parte de código en Dreamweaver, podemos observar que nos creo el siguiente script:

function MM_swapImgRestore() { //v3.0

var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;

}

function MM_preloadImages() { //v3.0

var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();

var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)

if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}

}

function MM_findObj(n, d) { //v4.01

var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {

d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}

if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];

for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);

if(!x && d.getElementById) x=d.getElementById(n); return x;

}

function MM_swapImage() { //v3.0

var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)

if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}

}

</script>

y dentro de nuestra etiqueta <Body> realiza lo siguiente

<body onload="MM_preloadImages('Imagen 1')">:

esto para cargar el efecto una vez que se inicie la pagina ()y el codigo que realiza la animacion en texto html queda de la siguiente forma:

<img src="Imagen 1" alt="Hi :)" name="Nombre" width="70" height="85" border="0" id="Id Imagen" /> .

Descarga el ejemplo.

Con estos sencillos pasos tenemos terminado nuetra imagen de sustitución de forma mas rapida.

cualquier duda o comentario no duden en comentarlo.

Un saludo Cordial!

Atte.

LSCA. Gustavo Ortiz Gamez.

Enviar correo con SMTP en C#.

2011-04-28T00:12:00.001-05:00

El envió de correo por medio de SMTP (Simple Mail Transfer Protocol) desde nuestra aplicación win y web form es muy sencillo, para ello necesitamos dos librerías importantes para lograrlo: System.Net.Mail y System.Net en nuestro código, utilizando un Using.

Para ello necesitamos un servidor de correo, podemos utilizar los servidores de Gmail, Hotmail, o si tenemos uno propio de igual forma. (les dejo el SMTP de estos dos con sus respectivos puertos)
/*
* Cliente SMTP
* Gmail: smtp.gmail.com puerto:587
* Hotmail: smtp.liva.com puerto:25
*/

Bien adentrándonos a lo importante, crearemos una nueva clase llamada Correos, en la cual are una instancia de SmtpClient para poder trabajar con nuestro cliente de correo, la cual utilizaremos mas adelante.
SmtpClient server = new SmtpClient("smtp.gmail.com", 587);
Ahora utilizare el método publico Correos donde ya empezaremos a proporcionarle la información necesaria para el envió, donde ingresaremos la cuenta de correo origen o credencial de una cuenta existente.

server.DeliveryMethod = SmtpDeliveryMethod.Network;
server.Credentials = new NetworkCredential ("CorreoOrigen", "Contraseña");
server.EnableSsl = true;

Nota: podemos dejar fijo el correo y la contraseña, o bien hacer que nuestros método reciba estos dos parámetros cuando se invoca la clase.
Como paso siguiente declare un método llamada MandarCorreo el cual recibirá el cuerpo del mensaje de tipo MailMessage.
server.Send(mensaje);

Y enviaremos el correo. mensaje es mi variable donde guardo el cuerpo del correo, puede ser un texto plano o bien podemos elaborar un cuerpo mas sofisticado, armándolo por medio de código HTML, con imágenes, link, y dándole un formato mas personalizado, para ello lo hacemos de la siguiente forma:

mensaje.Subject = "Correo Prueba"; // Es el titulo del correo o asunto.
mensaje.Body = cuerpo; // Aquí utilizo una variable de tipo string donde guardo mi codigo html o texto plano que viene siendo el cuerpo del correo.
mensaje.IsBodyHtml = true; // Esta instrucción es para indicarle a nuestro código que acepte el cuerpo del correo en formato HTML.
mensaje.BodyEncoding = System.Text.Encoding.UTF8; // Por ultimo solo podemos la codificación del correo, por eso de los acentos. con esto tenemos armado nuestra variable ahora solo faltaría invocar nuestro método y enviar el correo.

Bien después de esta breve explicación les dejo el código que utilizo.

class Correos
{
     SmtpClient server = new SmtpClient("smtp.gmail.com", 587);

public Correos()
   {
   server.DeliveryMethod = SmtpDeliveryMethod.Network;
   server.Credentials = new NetworkCredential("CorreoOrigen", "Contraseña");
   server.EnableSsl = true;
   }
public void MandarCorreo(MailMessage mensaje)
{
     try
        {
         server.Send(mensaje);
        }
     catch (SmtpException smtpe)
        {
         throw smtpe;
        }
}

Con esto ya solo invocamos en nuestro código nuestra clase de la siguiente forma: y le pasamos el parámetro con nuestro mail ya construido.
Correos mail = new Correos();
mail.MandarCorreo(mensaje);

Espero les sirva este pequeño ejemplo, si tienen alguna duda no duden en comentarlo y con gusto les daré una respuesta.

Atte.

LSCA Gustavo Ortiz Gamez.

Hablando de Entity Framework y LINQ.

2011-04-23T22:40:00.000-05:00

Esto es el comiezo de todo el mundo que contiene Entity Framework y LINQ, para ello empezaremos citando a MSDN de Microsoft donde tenemos las definiciones para Entity Framework y LINQ, respectivamente.

Entity Framework: "Entity Framework es un conjunto de tecnologías de ADO.NET que permiten el desarrollo de aplicaciones de software orientadas a datos. Los arquitectos y programadores de aplicaciones orientadas a datos se han enfrentado a la necesidad de lograr dos objetivos muy diferentes. Deben modelar las entidades, las relaciones y la lógica de los problemas empresariales que resuelven, y también deben trabajar con los motores de datos que se usan para almacenar y recuperar los datos. Los datos pueden abarcar varios sistemas de almacenamiento, cada uno con sus propios protocolos; incluso las aplicaciones que funcionan con un único sistema de almacenamiento deben equilibrar los requisitos del sistema de almacenamiento con respecto a los requisitos de escribir un código de aplicación eficaz y fácil de mantener."

LINQ: "Language-Integrated Query (LINQ) es una innovación introducida en Visual Studio 2008 y .NET Framework versión 3.5 que elimina la distancia que separa el mundo de los objetos y el mundo de los datos.
Tradicionalmente, las consultas con datos se expresan como cadenas sencillas, sin comprobación de tipos en tiempo de compilación ni compatibilidad con IntelliSense. Además, es necesario aprender un lenguaje de consultas diferente para cada tipo de origen de datos: bases de datos SQL, documentos XML, servicios Web diversos, etc. LINQ convierte una consulta en una construcción de lenguaje de primera clase en C# y Visual Basic. Las consultas se escriben para colecciones de objetos fuertemente tipadas, utilizando palabras clave del lenguaje y operadores con los que se está familiarizado. La ilustración siguiente muestra una consulta LINQ parcialmente completada en una base de datos SQL Server en C#, con comprobación de tipos completa y compatibilidad con IntelliSense."

En los dos casos trabajamos sobre consultar fuera de SQL SERVER, más bien dentro de nuestro ID Visual Studio, es decir nuestro Entity Framework trabaja en directo con los entidades creados por nuestro modelador de entidades, una vez asociado nuestras entidades y relaciones podemos acceder a los datos por medio de consultas.

Supongamos que tenemos una tabla en nuestra base de datos llamada Tienda con los siguientes campos.

[idtienda] [int] NOT NULL,

[tienda] [varchar](50) NOT NULL,

[direccion] [varchar](200) NOT NULL,

[telefono] [varchar](10) NULL,

[ciudad] [varchar](30) NULL,

[cp] [varchar](6) NULL,

[descripcion] [varchar](150) NULL

Por medio de la entidad Tienda podemos realizar una consulta directa. Por ejemplo si queremos tener todos los registros de tiendas que la ciudad sea orizaba seria de esta forma.

Tienda.Where(t => t.ciudad == "Orizaba")

De esta forma tenemos por medio de la entidad tienda todas las tiendas que pertenecen a Orizaba

Ahora supongamos lo queremos hacer pero con listas, tendriamos primero crear nuestra clase de conexión para enlazarnos con la base de datos. Y crear un query donde pongamos la sintaxis de lo que queremos, en este caso seria traer todos los datos de la tabla tienda con un "select * from tiendas", regresar el resultado en un dataset o datareader, dependiendo como se maneje la clase de conexión.

En este caso es muy util por si se piensa estar realizando consultas a la misma tabla para poder explotar la informacion, ya que los datos regresados de nuestro select, lo estariamos almacenando en una lista y con ella poder explotar los datos sin volver a realizar la consulta.

Para ello utilizariamos una clase con los datos de nuestra tabla con el mismo tipo y declararimos la lista de la siguiente forma:

List<Tienda> lstienda = con.query("select * from tiendas");

Donde:

con es el identificador de mi conexión a sql y query el metodo que ejecuta mi consulta y me regresa los datos.

Una vez hecho esto ya podriamos empezar a trabajar con la lista como podemos observer a continuacion:

lstienda.Where(t => t.ciudad== "Orizaba");

espero esto les halla sido de utilidad, muy pronto voy a subir los post de como crear la clase de conexión, crear las entidades, y todo lo necesario para realizar nuestro proyecto con Entity Framework y LINQ.

Un saludo Cordial.

Atte.

LSCA Gustavo Ortiz Gamez.