Controles estndar del Cuadro de herramientasEn los temas de esta seccin se describe cmo trabajar con los controles de servidor web ASP.NET que aparecen en la pestaa Estndar del Cuadro de herramientas de Visual Web Developer. Entre ellos se incluyen controles que permiten mostrar botones, listas, imgenes, cuadros, hipervnculos, etiquetas o tablas, as como controles ms complejos que trabajan con datos estticos y dinmicos, o controles que actan como contenedores de otros controles. Visual Studio 2008Los controles de servidor web ASP.NET son objetos de pginas web ASP.NET que se ejecutan cuando se solicita la pgina y que representan marcado en el explorador. Muchos controles de servidor web son similares a los conocidos elementos HTML, como botones y cuadros de texto. Otros controles abarcan comportamiento complejo, como los controles de un calendario, y controles que puede usar para conectar a orgenes de datos y datos de visualizacin. LabelEl control de servidor web Label permite establecer texto en una pgina web ASP.NET mediante programacin. Normalmente, se utiliza el control Label cuando se desea cambiar el texto de una pgina en tiempo de ejecucin, por ejemplo en respuesta a un clic en un botn. Puede establecer el texto del control Label en tiempo de diseo o en tiempo de ejecucin en un programa. Tambin puede enlazar la propiedad Text del control Label a un origen de datos para mostrar la informacin de la base de datos en una pgina. En el ejemplo siguiente se muestra el uso de un control Label como leyenda de un control TextBox. Cuando la pgina se represente, los usuarios podrn presionar ALT+N para navegar hasta el cuadro de texto. La letra N en Label est subrayada.

LiteralPuede utilizar un control Literal de servidor web como un contenedor para otros contenidos de la pgina. El control Literal representa una de las diferentes opciones que existen para agregar contenido a una pgina. Si se trata de contenido esttico, puede agregar el marcado directamente a una pgina como HTML, sin utilizar un contenedor. Sin embargo, si desea agregar el contenido dinmicamente, debe agregar el contenido a un contenedor. Los contenedores tpicos son el control Label, el control Literal, el control Panel y el control PlaceHolder. El control Literal se diferencia del control Label en que el control Literal no agrega ningn elemento HTML al texto. (El control Label representa un elemento span.) En consecuencia, el control Literal no admite ningn atributo de estilo, incluidos los atributos de posicin. Sin embargo, el control Literal permite especificar si el contenido est codificado. Los controles Panel y PlaceHolder se representan como elementos div, que crean bloques discretos en la pgina, en lugar de representarse en lnea como los controles Label y Literal. En general, utilice un control Literal cuando desee representar texto y controles directamente en una pgina sin ningn marcado adicional.En el siguiente ejemplo se muestra una pgina Web sencilla que muestra un titular en tiempo de ejecucin. El cuerpo de la pgina, incluido el control Literal, podra parecerse a ste:

En el ejemplo siguiente se muestra cmo se establece el texto y el cdigo del control Literal mediante programacin. La pgina contiene botones de radio que permiten al usuario elegir entre texto codificado y texto paso a travs.

protected void Page_Load(object sender, EventArgs e) { Literal1.Text = "This text is inserted dynamically."; if (radioEncode.Checked == true) { Literal1.Mode = LiteralMode.Encode; } if(radioPassthrough.Checked == true) { Literal1.Mode = LiteralMode.PassThrough; } }

TextBoxEl control de servidor web TextBox proporciona a los usuarios un medio para escribir datos en una pgina Web ASP.NET, incluidos texto, nmeros y fechas. El control de servidor TextBox es un control de entrada que permite al usuario escribir texto. De forma predeterminada, la propiedad TextMode del control se establece en TextBoxMode.SingleLine, que muestra un cuadro de texto de una sola lnea. Sin embargo, puede establecer la propiedad TextMode en TextBoxMode.MultiLine para mostrar un cuadro de texto de varias lneas (que se representa como un elemento textarea ). Tambin puede cambiar la propiedad TextMode a TextBoxMode.Password para mostrar un cuadro de texto que enmascara los datos proporcionados por el usuario. El texto mostrado en el control TextBox est disponible mediante el uso de la propiedad Text. El control TextBox desencadena un evento TextChanged cuando el usuario abandona el control. De forma predeterminada, el evento no se produce inmediatamente, sino que se produce en el servidor cuando se enva la pgina. Sin embargo, es posible especificar que el control TextBox enve la pgina al servidor tan pronto como el usuario abandone el campo. El control TextBox de servidor web no desencadena un evento cada vez que el usuario presiona una tecla; slo lo hace cuando el usuario abandona el control. Puede hacer que los eventos del cliente desencadenados por el control TextBox se controlen desde un script de cliente, lo que puede resultar ser til para responder a las pulsaciones de las distintas teclas.En el ejemplo siguiente se muestra cmo se puede responder a los cambios en un control TextBox . El cdigo muestra el contenido del control en una etiqueta.

protected void TextBox1_TextChanged(object sender, EventArgs e){ Label1.Text = Server.HtmlEncode(TextBox1.Text);}

Button, LinkButton, ImageButton, ImageMapUtilice los controles de servidor web de botn de ASP.NET para permitir a los usuarios exponer una pgina en el servidor. Los controles de botn desencadenan un evento en el cdigo del servidor que puede controlar para responder al postback. Por ejemplo, un usuario puede indicar que ha completado un formulario o que desea ejecutar un comando concreto. El control Button tambin puede generar un evento en script de cliente que puede administrar antes de que se exponga la pgina o que se puede ejecutar y, a continuacin, cancelar el envo de la pgina.En el ejemplo de cdigo siguiente se muestra una pgina web ASP.NET que incluye un script de cliente que cambia el color del texto de un botn cuando el usuario pasa el puntero por encima de l.

Untitled Page var previousColor; function MakeRed() { previousColor = window.event.srcElement.style.color; window.event.srcElement.style.color = "#FF0000"; } function RestoreColor() { window.event.srcElement.style.color = previousColor; }

HyperLinkEl control de servidor web HyperLink crea vnculos en una pgina web que permite a los usuarios pasar de una pgina a otra en una aplicacin. La principal ventaja de utilizar un control HyperLink es que es posible establecer las propiedades de los vnculos en el cdigo del servidor. Por ejemplo, puede cambiar dinmicamente el texto o la pgina de destino del vnculo segn las condiciones de la pgina. Otra ventaja de utilizar el control HyperLink es que se puede utilizar el enlace de datos para especificar la direccin URL de destino del vnculo (y los parmetros que se transferirn con el vnculo, si es necesario).Un ejemplo tpico es crear controles HyperLink basndose en una lista de productos. La direccin URL de destino seala a una pgina donde el usuario puede leer ms detalles sobre el producto. En el ejemplo siguiente se muestra cmo se pueden establecer las propiedades de un control HyperLink en tiempo de ejecucin.El mtodo controla el evento Click de un control Button y establece el texto del vnculo y la pgina de destino del control.protected void Button1_Click (object sender, System.EventArgs e){ this.HyperLink1.Text = "Home"; this.HyperLink1.NavigateUrl = "http://www.microsoft.com/net/";}

DropDownListEl control de servidor web DropDownList permite a los usuarios seleccionar un nico elemento en un cuadro de lista desplegable predefinido. El control DropDownList de servidor web permite a los usuarios seleccionar uno o varios elementos de una lista predefinida. Se diferencia del control ListBox de servidor Web en que la lista de elementos permanece oculta hasta que los usuarios hacen clic en el botn desplegable. Adems, el control DropDownList no admite el modo de seleccin mltiple. Para trabajar mediante programacin con elementos de lista, utilice la coleccin Items del control DropDownList. La coleccin Items es una coleccin estndar, por lo que es posible agregar objetos de elementos, eliminar elementos, borrar la coleccin, etc. El elemento que se encuentra seleccionado est disponible en la propiedad SelectedItem del control DropDownList. El control DropDownList provoca el evento SelectedIndexChanged cuando los usuarios seleccionan un elemento. De forma predeterminada, este evento no expone la pgina en el servidor. Sin embargo, puede hacer que el control fuerce un envo inmediato estableciendo la propiedad AutoPostBack en true. En el ejemplo siguiente se muestra cmo se puede comprobar qu elemento est seleccionado en un control RadioButtonList. El cdigo determina primero si existe una seleccin, para lo cual lee el valor de la propiedad SelectedIndex, que ser -1 hasta que el usuario seleccione un elemento. A continuacin, obtiene el objeto SelectedItem y muestra la propiedad Text de este objeto. protected void Button1_Click (object sender, System.EventArgs e){ // Is anything selected? The index is -1 if nothing is selected. if (RadioButtonList1.SelectedIndex > -1) { Label1.Text="You chose: " + RadioButtonList1.SelectedItem.Text; }}

ListBoxEl control de servidor Web ListBox permite a los usuarios seleccionar uno o varios elementos de una lista predefinida. Use el control de servidor web ListBox cuando desee mostrar varios elementos a la vez y permitir a los usuarios seleccionar uno o ms elementos en una lista predefinida. El control ListBox se diferencia de un control DropDownList en que puede mostrar varios elementos a la vez y, de manera opcional, permite al usuario seleccionar varios elementos. Para trabajar con elementos mediante programacin, utilice la coleccin Items del control ListBox. La coleccin Items es una coleccin estndar, por lo que es posible agregar objetos de elementos, eliminar elementos, borrar la coleccin, etc. El elemento que se encuentra seleccionado est disponible en la propiedad SelectedItem del control ListBox. Si el control est establecido en modo de seleccin nica, esta propiedad devuelve el elemento seleccionado. Si el control est establecido en modo de seleccin mltiple, obtiene los elementos seleccionados recorriendo toda la coleccin Items y examinando la propiedad Selected de cada elemento. En el ejemplo siguiente se muestra cmo se agregan objetos ListItem a un control ListBox; este procedimiento es idntico para todos los controles de lista de servidor web.protected void Button1_Click (object sender, System.EventArgs e){ ListBox1.Items.Add(new ListItem("Carbon", "C")); ListBox1.Items.Add(new ListItem("Oxygen", "O"));}

CheckBox y CheckBoxListLos controles CheckBox y CheckBoxList proporcionan una manera para que los usuarios especifiquen opciones de tipo s/no (verdadero/falso). Puede emplear dos tipos de controles de servidor web para agregar casillas a una pgina web de ASP.NET: controles CheckBox individuales o un control CheckBoxList. Ambos controles proporcionan una manera para que los usuarios especifiquen opciones de tipo s/no (verdadero/falso).Puede agregar controles CheckBox individuales a una pgina y usarlos por separado .Como alternativa, puede usar el control CheckBoxList, que es un control nico que acta como control primario de una coleccin de elementos de lista de casillas. Este control deriva de la clase base ListControl y, por tanto, funciona como los controles de servidor web ListBox, DropDownList, RadioButtonList y BulletedList. Muchos de los procedimientos que se usan al trabajar con el control CheckBoxList son los mismos que se emplean con otros controles de lista de servidor.Ambos tipos de controles ofrecen una serie de ventajas. Al utilizar controles CheckBox individuales, tendr mayor control sobre la distribucin de las casillas en la pgina que si utiliza el control CheckBoxList. Por ejemplo, puede incluir texto no perteneciente a las casillas entre las casillas. Tambin puede controlar la fuente y el color de cada casilla.Es preferible usar el control CheckBoxList si se desea crear una serie de casillas a partir de datos de un origen de datos. (Puede enlazar un control CheckBox individual a datos.)

RadioButton y RadioButtonListLos controles RadioButton y RadioButtonList permiten a los usuarios seleccionar opciones de entre un pequeo conjunto de opciones predefinidas mutuamente excluyentes. Puede utilizar dos tipos de controles de servidor web para agregar botones de radio a una pgina Web ASP.NET: controles RadioButton individuales o un control RadioButtonList. Ambos controles permiten a los usuarios seleccionar opciones de entre un pequeo conjunto de opciones predefinidas mutuamente excluyentes. Los controles permiten definir cualquier nmero de botones de radio con etiquetas y organizarlos de forma horizontal o vertical.Puede agregar controles RadioButton individuales a una pgina y usarlos por separado. Normalmente, agrupar dos o ms botones individuales.Como alternativa, puede usar el control RadioButtonList, que es un control nico que acta como control primario de una coleccin de elementos de lista de botones de radio.Se deriva de la clase ListControl base.Por lo tanto, funciona como los controles de servidor web ListBox, DropDownList, BulletedList y CheckBoxList. Muchos de los procedimientos que se usan al trabajar con el control RadioButtonList son los mismos que se usan con otros controles de lista de servidor web.Ambos tipos de controles ofrecen una serie de ventajas. Si usa controles RadioButton individuales, tendr un mayor control sobre el diseo del grupo de botones de radio que si usa el control RadioButtonList.Por ejemplo, puede incluir texto que no pertenezca a botones de radio entre los botones de radio.Es preferible que use el control RadioButtonList si desea crear un grupo de botones de radio basado en datos de un origen de datos. Tambin resulta algo ms fcil escribir cdigo que determine qu botn se ha seleccionado.Si desea presentar a los usuarios una lista ms larga de opciones o una lista cuya longitud pueda variar en tiempo de ejecucin, utilice un control de servidor web ListBox o DropDownList.Los botones de radio rara vez se utilizan solos. Se suelen agrupar para proporcionar un conjunto de opciones mutuamente excluyentes. Dentro de un grupo de botones de radio, slo es posible seleccionar los botones de uno en uno. Para crear botones de radio agrupados, puede seguir uno de los siguientes procedimientos: Agregue controles RadioButton de servidor web a una pgina y, a continuacin, agrguelos todos a un grupo manualmente. El nombre de grupo es arbitrario; todos los botones de radio que tienen el mismo nombre de grupo se consideran parte de un solo grupo. Agregue un control RadioButtonList de servidor Web a la pgina. Los elementos de lista del control se agrupan automticamente.

ImageEl control de servidor web Image permite mostrar imgenes en pginas web ASP.NET y administrar estas imgenes en su propio cdigo.Puede especificar mediante programacin el archivo de grficos para un control Image en tiempo de diseo o en tiempo de ejecucin. Tambin puede enlazar la propiedad ImageUrl del control a un origen de datos para mostrar grficos procedentes de la informacin de una base de datos.A diferencia de la mayora de los dems controles de servidor web, el control Image no admite ningn evento. Por ejemplo, el control Image no responde a los clics del mouse. En su lugar, puede crear una imagen interactiva utilizando los controles ImageMap o ImageButton de servidor web.Adems de mostrar grficos, el control Image permite especificar varios tipos de texto para la imagen, como los siguientes: ToolTip El texto que se muestra en la informacin sobre herramientas de algunos exploradores. AlternateText El texto que aparece si no se encuentra el archivo de grficos.Si no se especifica ninguna propiedad ToolTip, algunos exploradores utilizarn el valor AlternateText como una informacin sobre herramientas.Si la propiedad GenerateEmptyAlternateText se establece en true, el atributo alt del elemento de imagen representado se establecer en una cadena vaca.

Table, TableRow y TableCellEl control de servidor web Table permite crear tablas en pginas ASP.NET que puede programar en el cdigo del servidor.Los controles de servidor web TableRow y TableCell proporcionan un medio para mostrar el contenido del control Table.Normalmente, las tablas no slo se utilizan para presentar informacin tabular, sino como un medio para dar formato a la informacin de una pgina Web. Hay diferentes maneras de crear tablas en pginas ASP.NET: Tabla HTML. Si est creando una tabla esttica (una tabla en la que no agregar contenido ni lo cambiar en tiempo de ejecucin), debe utilizar una tabla HTML y no un control Table. HtmlTable. ste es un elemento HTML table que se ha convertido en un control de servidor HTML agregando el atributo runat=server.Puede programar este control en el cdigo del servidor.Para obtener informacin detallada sobre los controles de servidor HTML, vea Informacin general sobre los controles de servidor web ASP.NET. Table. En un control web que permite crear y manipular tablas (por ejemplo, agregando filas y celdas de tabla) mediante un modelo de objetos coherente con otros controles web.En general, los controles Table de servidor Web se utilizan cuando se desea agregar filas y celdas (columnas) a la tabla en el cdigo en tiempo de ejecucin.Aunque este control puede usarse como una tabla esttica, con filas y columnas predefinidas, en ese caso es ms sencillo trabajar con el elemento table.El control Table de servidor Web puede ser ms fcil de programar que el control HtmlTable, porque ofrece un modelo de objetos con propiedades con tipo que resulta coherente con otros controles de servidor Web.(El modelo tambin es coherente entre los controles Table, TableRow y TableCell.)Algunas de las funciones que se podran realizar con un control Table de servidor Web tambin se pueden llevar a cabo con los controles de lista de servidor Web, en particular, con los controles Repeater, DataList y GridView.Todos estos controles se representan (o tienen la opcin de representarse) como tablas HTML.stas son las diferencias que existen entre los controles de lista y el control Table: Los controles de lista estn enlazados a datos. Los controles de lista slo funcionan con un origen de datos, mientras que el control Table puede mostrar cualquier combinacin de texto HTML y controles, estn o no enlazados a datos. Los controles de lista utilizan plantillas para especificar el diseo de sus elementos. El control Table admite el control secundario TableCell, que puede llenarse igual que cualquier elemento HTML td. En el ejemplo siguiente se muestra cmo se puede agregar filas y celdas a un control Table.El nmero de filas y columnas est determinado por lo que escribe el usuario en dos cuadros de texto.Cada celda muestra el nmero de fila y el nmero de celda como texto esttico.protected void Button1_Click (object sender, System.EventArgs e){ // Total number of rows. int rowCnt; // Current row count. int rowCtr; // Total number of cells per row (columns). int cellCtr; // Current cell counter int cellCnt;

rowCnt = int.Parse(TextBox1.Text); cellCnt = int.Parse(TextBox2.Text);

for(rowCtr=1; rowCtr Personalizar otros aspectos del control WizardEl control Wizard muestra automticamente un ttulo y el paso actual del control.El ttulo se personaliza con la propiedad HeaderText.Puede ajustar la plantilla del encabezado mediante la propiedad HeaderTemplate.Si lo desea, puede mostrar un botn de cancelacin estableciendo la propiedad DisplayCancelButton en true.Mediante la propiedad NavigationButtonStyle del control Wizard resulta sencillo que todos los botones tengan un estilo comn, aunque esta propiedad tambin proporciona flexibilidad para personalizar cada botn individualmente.La propiedad NavigationButtonStyle se aplica a todos los botones representados.Sin embargo, puede reemplazar este estilo estableciendo la propiedad de estilo de cada botn.

ImageMapEl control ImageMap de ASP.NET le permite crear una imagen con regiones individuales en las que los usuarios pueden hacer clic, denominadas zonas activas.Cada una de estas zonas activas puede ser un hipervnculo independiente o un evento de devolucin de datos.El control ImageMap est formado por dos elementos.El primero es una imagen, que puede ser un grfico en cualquier formato estndar grfico Web, como un archivo .gif, .jpg o .png.El segundo elemento es una coleccin de controles HotSpot.Cada control de zona activa es un elemento diferente que es de tipo CircleHotSpot, RectangleHotSpot o PolygonHotSpot.Para cada control de zona activa, defina las coordenadas que especifican la ubicacin y el tamao de la zona activa.Por ejemplo, si crea un control CircleHotSpot, defina las coordenadas x e y del centro y del radio del crculo.Puede definir todas las zonas activas necesarias para la imagen.No es necesario definir zonas activas para que se cubra todo el grfico.Puede especificar lo que ocurre cuando un usuario hace clic en una zona activa.Se puede configurar cada zona activa como un hipervnculo que va a una direccin URL proporcionada para esa zona activa.O bien, puede configurar el control para que se realice un postback cuando un usuario haga clic en una zona activa y proporcionar un valor nico para cada zona activa.La devolucin de datos provoca el evento Click del control ImageMap.En el controlador de eventos, puede leer el valor nico asignado a cada zona activa.