Está en la página 1de 16

Crear Elementos Agrupados

Elementos Agrupados
Conjunto de opciones o elementos html que estn dentro de una misma lista, estos elementos pueden ser tratados de manera independiente o conjunta. Ejemplo: Listas Listas desplegables (DropDownList) Checkbox Radiobuttons DataGrid DataList Repeater

Crearlos como controles


Para hacerlos control se le agregara entre las tags del tipo de lista deseado: runat con valor de server: runat="server" ademas de un identificador: id="ColorList" La declaracion para los diferentes elementos agrupados es la siguiente: <asp:xxxxx id="ColorList" runat="server"> <asp:ListItem Value=Elemento">Elemento1</asp:ListItem> </asp:xxxxx> Donde xxxxx es el tipo de lista. Para agregar cada uno de los elementos que la formaran se utliza <asp:ListItem>

Listas Desplegables
Es una lista desplegable donde se selecciona un nico elemento.
<form id="form1" runat="server"> <asp:DropDownList id="ColorList" runat="server"> <asp:ListItem Selected="True" Value="White"> White </asp:ListItem> <asp:ListItem Value="Silver"> Silver </asp:ListItem> <asp:ListItem Value="DarkGray"> Dark Gray </asp:ListItem> <asp:ListItem Value="Khaki"> Khaki </asp:ListItem> <asp:ListItem Value="DarkKhaki"> Dark Khaki </asp:ListItem> </asp:DropDownList> </form>

Listas
Representa un control de cuadro de lista que permite la seleccin de uno o varios elementos.
<asp:ListBox id="ListBox1" Rows= " 3" SelectionMode="Single" runat="server"> <asp:ListItem>Item 1</asp:ListItem> <asp:ListItem>Item 2</asp:ListItem> <asp:ListItem>Item 3</asp:ListItem> </asp:ListBox> </form>

CheckBoxList
Es vista como una lista de opciones las cuales se trata individualemente dentro del codigo, puede tener dos valores marcado o desmarcado. Puede realizar multiples elecciones.
<asp:CheckBoxList id="checkboxlist1" runat="server"> <asp:ListItem>Peliculas</asp:ListItem> <asp:ListItem>Musica</asp:ListItem> <asp:ListItem>Videojuegos</asp:ListItem> </asp:CheckBoxList>

RadioButton
Al igual que checkbox sirve como seleccin, teniendo la diferencia de que en los radiobuttons solamente pueden seleccionar solo un elemento de la lista ya que llevan el mismo nombre en conjunto.
<asp:RadioButtonList id="RadioButtonList1" runat="server"> <asp:ListItem>Terror</asp:ListItem> <asp:ListItem>Comedia</asp:ListItem> <asp:ListItem>Accion</asp:ListItem> </asp:RadioButtonList>

Repeater
Control de lista con enlace a datos que permite especificar un diseo personalizado aplicando la misma plantilla a cada uno de los elementos mostrados en la lista.

DataList
Control de lista enlazada a datos que muestra los elementos mediante el uso de plantillas.

DataGrid
Control de lista enlazada a datos que muestra los elementos del origen de datos en una tabla.

ListControl
Se deriva de WebControl, define las propiedades, mtodos y eventos comunes a todos los controles de tipo de lista.

Propiedades
AutoPostBack: Obtiene o establece un valor que indica si se producir una devolucin automtica al servidor cuando el usuario cambie la seleccin de la lista. DataValueText: Obtiene o establece el campo del origen de datos que proporciona el valor de cada elemento de lista. SelectedIndex: Obtiene o establece el ndice ordinal inferior de los elementos seleccionados en la lista. SelectedItem: Obtiene el elemento seleccionado con el ndice inferior en el control de lista.

Evento ListControl
El evento SelectedIndexChanged se produce cuando la seleccin del control de lista cambia entre cada envo al servidor.

Propiedades especificas CheckBoxList y RadioButtonList


Se crean en una tabla sencilla, y puede establecer las propiedades de formato a estas dos listas.
CellSpacing: Obtiene o establece la distancia entre las celdas de la tabla.
CellPadding: Obtiene o establece la cantidad de espacio entre el contenido de la celda y el borde de la misma.

RepeatColumns: Valor entero usado para designar el nmero de columnas que va a tener la tabla. RepeatDirection: Determina en qu direccin los artculos sern alineados, y pueden tener valores de vertical y horizontal. RepeatLayout: Obtiene o establece el diseo . TextAlign: Obtiene o establece la alineacin del texto.

Crear elementos agrupados con controles de lista


1. Determinar tipo de lista a usar ya sea seleccionar un solo elemento o multiples. 2. Colocar dentro de las etiquetas del formulario, la etiqueta con el tipo de lista seleccionada. <form id="form1" runat="server"> <asp:CheckBoxList id=checkBoxList" runat="server"> <asp:ListItem>Item 1</asp:ListItem> <asp:ListItem>Item 2</asp:ListItem> <asp:ListItem>Item 3</asp:ListItem> </asp:CheckBoxList> </form>

3. Si se trata de checkbox o RadioButton se puede o no aplicar las propiedades especificas de una tabla o de ListControl.
<asp:CheckBoxList id="checkboxlist1" AutoPostBack="True" CellPadding="5"CellSpacing="2" RepeatColumns="2" RepeatDirection="Vertical" RepeatLayout="Flow" TextAlign="Right"runat="server"> <asp:ListItem>Item 1</asp:ListItem> <asp:ListItem>Item 2</asp:ListItem> <asp:ListItem>Item 3</asp:ListItem> </asp:CheckBoxList>

Resultado

También podría gustarte