Controles de Servidor AJAX

Los controles de servidor AJAX añaden scripts a la pagina que se ejecuta y procesa dentro del navegador. Algunos de los scripts pueden interactuar con el servidor de alguna forma, pero se ejcutan del lado del cliente. Todo el proceso de los controles de servidor ASP.NET se realiza en el servidor.

Todos los controles de servidor AJAX dependen de un control en particular para que funcionen en la pagina, este es el ScriptManager.

AJAX Control Toolkit

Son controles para ahora si meterle la magia del AJAX a las aplicaciones, con mas de 40 controles.

Link donde se pueden descargar estos controles: http://ajaxcontroltoolkit.codeplex.com/

Una vez que se han descargado los controles hay que descomprimirlos, ya en visual studio en la seccion del toolbox

Se da click derecho, Add Tab, enseguida se nombra el tab creado como AJAX Toolkit, o el nombre que prefieran, se vuelve a dar click derecho sobre el Tab Creado y ahora se selcciona Choose Items…  Abre un nuevo cuadro de dialogo, el cual se presiona el boton Browse, navegando hasta la crpeta que se descomprimio y  seleccionar el dll

Una vez seleccionado, solo estar seguros que todos los componentes esten seleccionados, un tip es que sean ordenados por Namespaces

Despues cerramos el cuadro de dialogo dandole OK,  mostrando nuestro Toolbox, de la siguiente manera.

DEMO SENCILLO AJAX

1. Se va crear un nuevo proyecto llamado AJAXDemo, en teoria solo se debe agregra un nuevo formulario web AJAX, no se por que razon no me permitio agregarlo desde visual studio 2010, asi que se hara de la siguiente forma.
2. Una forma ajax debe de contener como se comento un ScriptManager, adicionalmente se agrego un Updatepanel que es el recuadro que en el que estan los componentes TextBox, Boton y literal, en caso de que no se encuentre dentro del Toolbox, nosotros podemos codificarlo desde la opcion que dice Source en la parte de abajo de la pantalla

Asi se veria el source del webform (con un codigo adicional que se ira explicando)

Los conroles que se encuenctran dentro del Update panel , se le agregan extensores, estos se representan atravez de un SmartTag, este aparece cuando seleccionamos el boton, como se muestra en la imagen, se da un click sobre el SmartTag, para que muestre sus posibles opciones, seleccionando Add Extender

aEn este cuadro de dialogo aparecen los posibles extensores que se pueden aplicar al Boton, por lo pronto se va seleccionar el ConfirmButtonExtender

Para saber que realmente el objeto tiene un extensor, se le agraga una cruz verde asi como se muestra, el parte superior a la derecha

Al cambiar a vista de codigo, se muestra como se agrega el extensor

En el atributo ConfirmText se le indica el mensaje que se quiere mostrar al realizar la opcion del click. para este ejemplo se utilizo el mensaje  “Are you sure about this?”

Dar doble click en el boton y poner el siguiente codigo

Ejecutar la aplicacion y presionar el boton.

Que es lo que pasa, que al momento de dar OK, la pagina hace su trabajo en caso de que se ponga cancel, la pagina no hace nada, cuando un control esta dentro de un UpdatePanel lanza un evento PostBack de la pagina parcial y solamente los objetos dentro del Upadatepanel se actualizan el restro de la pagina sigue igual.

Script Manager

Se ocupa del script del lado del cliente para todos los controles del lado del servidro, toda pagian que utliza ASP.NET AJAX requiere una sola instancia de ScriptManager

 

Primer Demo Sencillo ASP.NET

El primer Demo va ser algo sencillo y simple, vamos a mostrar una pagina con ciertos elementos weblo primero que se tiene que hacer es crear un ASP.NET Web Site, para este ejemplo se maneja el lenguaje C# con un Location File System en la ruta que ustedes desen y el nombre que tmb ustedes desen

Una vez creado el ide nos muestra una pantalla con un codigo generado por default

en el cual pondremos el siguiente codigo en la seccion <div> com se muestra a continuacion:

Bueno expliquemos un poco de codigo:

la primeras 2 secciones del <h1> y <h2> son etiquetas en HTML las cuales son titulos el numero determina el tamaño en que se va desplegar, aqui cabe mencionar que en la etiqueta 2 se hace uso del framework para que nos muestre la hora, que es un script es por ello que se usa el  <% =Script %> el cual lo que hace es mostrar la fecha y la hora en que se esta ejecutando, como el tipo que regresa es un Date, por eso se usa una conversion a String.

Enseguida se agregan 3 componentes del panel Toolbox o barra de Herramientas, estos componentes son : Un TextBox, Un Boton, un Literal.

<asp:Control ID=”NombreControl” runat=”server” </asp:Control>

esta es la sintaxis de lo que son los controles que se van agregando a nuestra pagina, el cual se va complementando con las propiedades que se vayan agregando a los componentes.

Los &nbsp es otra etiqueta HTML quie indica espacios en blanco.

<asp:Button ID=”btnNombre” runat=”server”
Text=”Mostrar Nombre” onclick=”btnNombre_Click”></asp:Button>

El siguiente codigo es como configuramos como se muestra el boton, el ID es como se va manejar en el codigo del lado del servidor (CodeBehind) en el cual vamos a ir poniendo los eventos con los que va responder dicho boton, que accion va realizar, ahi tiene onclick que es lo que va hacer el boton al momento de presionarlo.

quedando la pantalla en modo de disenio de la siguiente manera

En el boton se debe dar doble click para que abra el Default.aspx.cs en el cual pondremos el siguiente codigo:

protected void btnNombre_Click(object sender, EventArgs e)
    {
        litNombre.Text = txtNombre.Text;
    }

Esto hara que el codigo que pongamos en el Texbox, sera asignado al objeto Literal.

Compilamos el codigo con F5 o con el “Play” de color verde de nuestro IDE, mostrando el siguiente mensaje, solo hay que indicarle OK

Mostrando la siguiente Pagina

Este es el primer demo con el que se da la bienvenida al ASP.NET

 

Conceptos Basicos ASP.NET Parte 2

Eventos Postback Frente a Eventos No Post Back

Los eventos Postback son aquellos que se publican en el servidor inmediatamente estos son tales como el Button.Click por otro lado estan los NoPostBack son los que no se publican inmediatamente en el servidor como TextBox.TextChanged, o eventos o eventos de seleccion como los CheckBox.CheckedChanged, en su lugar el control se guarda en cache estos eventos hasta la siguiente vez que ocurra una aplicacion, claro que este comportamiento puede cambiar (elementos nopostback ponerlos como postback) su propiedad AutoPostBack en true.

Controles Postback y no postback

Postback	No-PostBack
Button	BulletedList
Calendar	CheckBox
DataGrid	CheckBoxList
DataList	DataPager
FileUpload	DropDownList
GridView	ListBox
ImageButton	Panel
ImageMap	RadioButtonList
LinkButton	RadioButton
ListView	ScriptManager*
Menu	ScriptManagerProxy*
Repeater	TextBox
	Timer*
	UpdatePanel*
	UpdateProgress*

Tipos de Post Back

Hay 2 tipos de PostBack, uno de ellos es en “normal” asincrono ocurre cuando todos los eventos no postback se recompilan junto con el estado de la vista y valores de formulario para ser enviados al servidor y se genera una nueva pagina HTML para ser visualisada en el navegador, esto era antes de que apareciera el AJAX, los usuarios lo visualizan cuando dan un boton send por ejemplo se pone la pantalla blanca y carga una pantalla nueva.

Con AJAX esta el postback asincrono, es donde el servidor actualiza solo el componete como lo son los combos que traen por ejemplos los paises, a simple vista ya no pone la pagina en blanco aunque haga un postback al servidor solo actualiza el control, pero a simple vista ya que el post back lo hace completo solo el control se devuelve.

IsPotsBack

El Objeto Page presenta la propiedad IsPostBack, la cual es una propiedad Booleana de solo lectura que inidca si la pagina se carga por primera vez o si se carga en respuesta a un postback del cliente. Existen muchas operaciones costosas que solo se necesitaran cargar una sola vez. evitando que vuelva a generarse esa operacion costosa

mipagina.aspx.cs
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
Label1.Text = “Esta es la operacion Costosa Que se ejecuta”;
}

else

{

Label1.Text = DateTime.Now.ToString();

}

}

En este ejemplo es solo para dar entender el concepto, la primera vez muestra un mensaje, despues muestra la Hora.

 

Conceptos Basicos en ASP.NET

Eventos de Aplicacion y Sesion

• Aplication_Start: Se lanzan cuando se incia el Sitio Web y empieza a recibir peticiones por medio del  servidor Web que lo alberga, este s un buen momento para incializar recursos que se utilizaran en toda la aplicacion, como cadenas de conexion de base de datos.
• Aplication_Ends : Se lanza cuando se detiene el servicio WEB, por cualquier razon, ya sea por que se reinicio el servidor Web o por que el servicio es impedido a recibir mas peticiones para el sitio web, o por cualquier otro motivo aqui la recoleccion  de basura se ocupa de liberar recursos tales como la memoria a excpecion de los componente que fuero creados y no gestionados por el .NET

Los eventos de sesion son algo similares, estas se ejecutan cuando un usuario solicita primero una pagina de su aplicacion y termina cuando la aplicacion cierra la sesion o la sesion expira por ejmplo una sesion de una transaccion bancaria, estos  eventos lanzados son :

• Session_Start: El cual maneja eventos exclusivos de la sesion, por ejemplo como abrir la conexion a la base de datos.
• Session_End: Este evento se ejecuta cuando termina la sesion Eventos de pagina y control

Eventos de Pagina y Control

Una pagina ASP.NET y el control que contiene, tienen eventos heredados de la claseControl( o la clase TemplateControl en caso del evento Error) Todos estos eventos pasan un argumento de Tipo EventArgsque no presentan propiedades, los mas comunes

• DataBinding
  Ocurre cuando el control vincula una Base de Datos
• Disposed
      Ocurre cuando el Contro se libera de memoria
• Error
  Este Aplica solo para la pagina cuando lanza una excepcion no gestionada
• Init
     Ocurre cuando se inicializa el control
• Load
     Ocurre cuando se carga el control en el objeto Page
• PreRender
  Ocurre cuando el control esta apunto de mostrarse
•   Unload
  Ocurre cuando el control se descarga de memoria.

Para mayor informacion de mas eventos visiten la pagina :http://msdn.microsoft.com/en-us/library/default.aspx

esta mucho mejor en ingles asi que por eso les dejo el link ese