viernes, 8 de enero de 2010

ASP.NET Llamar JavaScript desde C#

Voy a explicarte un ejemplo con un par de posibilidades para llamar a un método JavaScript desde tu código de servidor C#. La clave está en el método "RegisterStartupScript" que nos permite registrar un código JavaScript desde el código de C# y que éste sea interpretado por el navegador. Te puedes descargar el código de ejemplo aquí.

La primera posibilidad es que quieras invocar un método JavaScript desde el Page_Load de tu página ASPX, para ello puedes hacer lo siguiente:


 

///<summary>

/// Evento de carga de la página

///</summary>

///
<param name="sender"></param>

///
<param name="e"></param>

protected
void Page_Load(object sender, EventArgs e)

{

//Se llama a un javascript cuando la página carga

string mensaje = "Este mensaje se genera desde c#";

ClientScript.RegisterStartupScript(this.GetType(), "myScript", "<script>javascript:mostrarMensaje('" + mensaje + "');</script>");

}


 

La segunda posibilidad es que quieras ejecutar un método JavaScript desde el evento de un control de tu página ASPX:


 

///<summary>

///El botón va a ejecutar un código javascript

///</summary>

///<param name="sender"></param>

///<param name="e"></param>

protected
void btnClick_Click(object sender, EventArgs e)

{

//Se genera el código javascript que se quiere ejecutar

System.Text.StringBuilder sb = new System.Text.StringBuilder();

sb.Append(@"<script language='javascript'>");

sb.Append(@"var lbl = document.getElementById('lblMensaje');");

sb.Append(@"lbl.style.color='red';");

sb.Append(@"alert(lbl.innerText);");

sb.Append(@"</script>");


 

if (!ClientScript.IsStartupScriptRegistered("JSScript"))

{

ClientScript.RegisterStartupScript(this.GetType(), "JSScript", sb.ToString());

}

}


 

Espero que te sea de utilidad y recuerda que puedes descarte el código aquí.

ASP.NET Depurar JavaScript

En este post te voy a explicar cómo depurar un Java Script.

Depurarlo no es complicado, basta simplemente con incluir una instrucción "debugger;" dentro de tu código de JavaScript, de esta forma, cuando este código pase a ejecutarse el depurador de Visual Studio se parará tal como lo hace en un break-point de tu código C#.


 

<script language="javascript" type="text/javascript">

function mostrarMensaje(mensaje)

{

debugger;

alert(mensaje);

}

</script>


 

Como puedes ver en la siguiente imagen Visual Studio te permite incluso de explorar los valores de tus variables dentro de tu JavaScript:



 

Espero que te sirva!

miércoles, 6 de enero de 2010

ASP.NET Ajax - Añadir triggers a un UpdatePanel dinámicamente

Este post te será útil en el caso de que estés interesado en añadir eventos como triggers de Update Panels programáticamente en tiempo de ejecución.

Cuando se añaden Triggers a un update panel en tiempo de diseño, el aspecto de nuestra página será el siguiente:


 

<asp:UpdatePanel
ID="UpdatePanel1"
runat="server"
ChildrenAsTriggers="False"
UpdateMode="Conditional">

<ContentTemplate>

<asp:Button
ID="BtnAcceptar"
runat="server"
Text="Aceptar"
OnClick="BtnAcceptar_Click"
/>

</ContentTemplate>

<Triggers>

<asp:AsyncPostBackTrigger
ControlID="BtnAcceptar"
EventName="Click"
/>

</Triggers>

</asp:UpdatePanel>


 

Si tus necesidades precisan que estos triggers sean añadidos en tiempo de ejecución utiliza el siguiente código:


 

AsyncPostBackTrigger Trigger = new
AsyncPostBackTrigger();

//ControlID = ID del control que provoca el evento.

Trigger.ControlID = ControlID;

//EventName = Nombre del evento, p.e: Click, SelectedIndexChange.

Trigger.EventName = EventName;

//Se añade el trigger al update panel

UpdatePanel1.Triggers.Add(Trigger);


 

Espero que te sea de utilidad!

.NET Log en el Visor de Sucesos (Event Viewer)

En este post quiero mostrarte como utilizar el visor de sucesos como para persistir los eventos de tu aplicación.

El soporte de Microsoft dice lo siguiente:

"Los registros de sucesos proporcionan un medio estándar y centralizado para que las aplicaciones graben sucesos (eventos) de software y hardware importantes. Windows suministra una interfaz de usuario estándar para ver los registros: el Visor de sucesos" (aquí)

No quiero contradecirlos pero, en mi opinión, no tendríamos que abusar del uso del registro de sucesos por las siguientes razones:

  1. El registro de sucesos se llena. A mí ya me ha ocurrido en una máquina XP, entiendo que en un servidor el tamaño será mucho más grande.
  2. La explotación de estadísticas. Es habitual querer obtener estadísticas de los eventos que provocan nuestras aplicaciones.
  3. Mantenimiento de aplicaciones. El Visor de Sucesos muestra los eventos escritos por todas las aplicaciones del sistema, por tanto es más difícil encontrar el evento que buscamos.

Mi recomendación sería usar una base de datos para persistir nuestros logs del tipo que sean (auditoría, errores, informativos…), para poder explotar estos datos. Aún así, los eventos informados en el registro de sucesos dan un aspecto más profesional a nuestras aplicaciones, pudiendo seleccionar ciertos eventos de nuestra aplicación que deberíamos persistir en el registro de eventos.

El uso es sencillo lo podéis ver aquí.

Sólo tienes que crear un nuevo proyecto usando la plantilla de "Aplicación del Consola" y tener el código siguiente en tu clase Main:


 

static
void Main(string[] args)

{

string sSource;

string sLog;

string sEvent;


 

sSource = "Nombre de mi aplicación";

sLog = "Application";

sEvent = "Mensaje de nuestro evento";

//Se añade nuestra aplicación como generadora de eventos si esta no existe

if (!EventLog.SourceExists(sSource))

{

EventLog.CreateEventSource(sSource, sLog);

}


 

//Se escribe una Advertencia/Warning

EventLog.WriteEntry(sSource, sEvent, EventLogEntryType.Warning, 230);

//Se escribe un error

EventLog.WriteEntry(sSource, sEvent, EventLogEntryType.Error, 231);

//Se escribe un error

EventLog.WriteEntry(sSource, sEvent, EventLogEntryType.FailureAudit, 232);

//Se escribe un error

EventLog.WriteEntry(sSource, sEvent, EventLogEntryType.Information, 233);

//Se escribe un er

EventLog.WriteEntry(sSource, sEvent, EventLogEntryType.SuccessAudit, 234);

}


 

Una vez ejecutes la aplicación consulta el visor de sucesos de tu máquina: Inicio > Ejecutar >eventvwr. Este tendrá el aspecto que puedes ver en la imagen siguiente:


 



 

Espero que te sea útil este post y si tienes alguna duda realiza un comentario.

sábado, 2 de enero de 2010

ASP.NET WebParts

Échale un ojo a este vídeo, explica el uso de los WebParts. Imaginas como se puede mejorar la administración de un sitio si permitimos a un usuario administrador cambiar los paneles de un sitio a otro, cambiar sus propiedades…En mi opnión aún no sabemos sacarle todo el jugo a los WebParts, pero nos convendría pensar en ellos como una posible propuesta a nuestros clientes. De hecho SharePoint aprovecha todas las funcionalidades de estos WebParts para la administración de sus sitios.

Aquí tienes el vídeo, espero que te de algunas ideas de cómo utilizar los WebParts en tus aplicaciones.


 

jueves, 31 de diciembre de 2009

ASP.NET - Eventos de Controles de Usuario (ASCX)

El código completo del ejemplo lo puedes encontrar aquí.

A la hora de crear controles de usuario solemos necesitar capturar un evento que se produce dentro del mismo, en la página padre. Además, normalmente, necesitaremos acceder a alguna de sus propiedades desde la página padre. En el ejemplo que os presento tenemos un control de usuario (un buscador) incrustado en una página que mostrará los resultados de la búsqueda.

Para ello el control de usuario posee un evento que se lanza una vez la búsqueda ha finalizado, además, los resultados de dicha búsqueda se almacenan en una propiedad del control de usuario que recupera la página para mostrarlos en un GridView.

Pasemos al código. El control de usuario, en su parte visual se compone únicamente de un TextBox (donde introducir el criterio de búsqueda) y un Button (que realiza la búsqueda).


 



 

La generación del evento se realiza desde el code-behind:


 

#region Eventos del control

public event
EventHandler AceptarClicked;

protected
virtual
void OnClick(object sender)

{

if (this.AceptarClicked != null)

{

this.AceptarClicked(sender, new EventArgs());

}

}

#endregion


 

Este código declara el evento (cuyo nombre será AceptarClicked) e implementa el método que invoca el evento.


 

#region Propiedades publicas

private
List<string> resultados;

public List<string> Resultados

{

get { return resultados; }

set { resultados = value; }

}

#endregion


 

El código anterior declara una propiedad pública dentro del control donde se almacenarán los resultados de la búsqueda.

En el evento del botón del control de usuario realizamos la llamada al evento público que será capturado por la página:


 

protected
void btnBuscar_Click(object sender, EventArgs e)

{

//Hardcode para simular una búsqueda

this.resultados = new
List<string>();

if (String.IsNullOrEmpty(this.txtPalabraClave.Text))

{

this.resultados.Add("No se han encontrado resultados");

}

else

{

this.resultados.Add("Resultado1 para " + this.txtPalabraClave.Text);

this.resultados.Add("Resultado2 para " + this.txtPalabraClave.Text);

this.resultados.Add("Resultado3 para " + this.txtPalabraClave.Text);

this.resultados.Add("Resultado4 para " + this.txtPalabraClave.Text);

}

//Se invoca el evento público una vez la función del control ha terminado

OnClick(sender);

}


 

La página debe capturar el evento, esto se hace de igual forma que se captura el evento de un botón o cualquier control de .NET. Así, en la presentación de la página tendremos:


 

<uc1:Buscador ID="Buscador1"
runat="server" OnAceptarClicked="Buscador1_AceptarClicked"/>


 

Así el método de tratar el evento del control de usuario, dentro de la página padre será Buscador1_AceptarClicked y se codificará así:


 

protected
void Buscador1_AceptarClicked(object sender, EventArgs e)

{

if (this.Buscador1.Resultados != null)

{

this.GridView1.DataSource = this.Buscador1.Resultados;

this.GridView1.DataBind();

}

}


 

El código completo del ejemplo lo puedes encontrar aquí.

Y esto es todo, espero que te sirva

ASCX - Creación de Controles de Usuario

Una buena práctica, y en mi opinión necesaria para cualquier desarrollo Web, es plantearse qué secciones de las páginas de la aplicación se mostrarán en varias páginas. Estas secciones serán susceptibles de desarrollarse como controles de usuario (User Controls .NET).

Así, podríamos definir (a alto nivel) un control de usuario como una sección de una página que se repite en varias páginas. El hecho de crear un control de usuario nos evitará hacer Copy-Paste (tanto de la parte de presentación como del codebehind del control) de esta sección a lo largo de toda nuestra aplicación, además, a la hora de cambiar algo dentro de esta sección de la página, esta se encuentra en un solo punto y no en varias páginas de nuestra solución.

Para añadir un control de usuario a nuestra sitio Web, botón derecho sobre nuestro proyecto -> Agregar Nuevo Elemento > Control de Usuario Web.


 

En función del número de controles de usuario que preveamos que vamos a precisar convendrá pensar si debemos distribuirlos en carpetas dentro de nuestra solución. Yo normalmente creo una carpeta de "Controles" dentro de mi solución, donde voy almacenando mis controles de usuario.

Bien, ya tenemos nuestro control de usuario en nuestra solución, aquí puedes encontrar el ejemplo de una aplicación en que utilizo un control de usuario y será en esta solución en la que me base de aquí en adelante (en esta solución no he creado ninguna carpeta de controles ya que sólo tengo un control). Este control se corresponde con el menú de mi aplicación y, por tanto, se encontrará en todas las páginas y por ello está incluido en la página master de la solución. El código de mi ascx es el siguiente:

 
 

<%@ Control Language="C#" AutoEventWireup="true"
CodeBehind="LoginControl.ascx.cs" Inherits="AutenticacionFormulario.LoginControl" %>

<asp:HyperLink ID="HyperLink1" runat="server" Text="Inicio" NavigateUrl="~/Default.aspx" /> |

<asp:HyperLink ID="HyperLink2"
runat="server"
Text="Administracion"
NavigateUrl="~/Admin/Admin.aspx" /> |

<asp:HyperLink ID="HyperLink3"
runat="server"
Text="Usuario"
NavigateUrl="~/User/User.aspx"
/> |

<asp:HyperLink ID="hyp1" runat="server" Text="Pagina segura" NavigateUrl="~/Secure/Administracion.aspx"/> |

<asp:LoginView ID="lv1"
runat="server">

<AnonymousTemplate>

Bienvenido, invitado

</AnonymousTemplate>

<LoggedInTemplate>

Bienvenido <asp:LoginName
runat="server"
ID="ln1"
ForeColor="Green"
Font-Bold="true"
/>,

</LoggedInTemplate>

</asp:LoginView>

<asp:LoginStatus
runat="server"
id="ls1"
/>

 
 

Cómo puedes ver un Control de Usuario se codifica exactamente igual que una página ASPX.

Para utilizar un Control de Usuario en una de tus páginas únicamente tendrás que arrastrarlo desde el "Explorador de Soluciones" hasta la página (esta debe estar abierta y en modo diseño). Esta acción generará lo siguiente en la página donde incluyes el control de usuario:

 
 

- Registro del control de usuario dentro de la página:

 
 

<%@ Register
src="LoginControl.ascx"
tagname="LoginControl"
tagprefix="uc1"
%>

 
 

- Inclusión del control de usuario en la página:

 
 

<uc1:LoginControl
ID="LoginControl1"
runat="server"
/>

 
 

Esto es todo no olvides pensar en crear controles de usuario, te facilitarán tanto el desarrollo como el mantenimiento de tus aplicaciones.