lunes, 10 de marzo de 2008

mover elementos de un listBox



Varias veces eh visto algo como la imagen que esta a la derecha. esto por lo general lo hacia en javscript. ahora me propuse hacerlo a atraves de .NET sin nada de javascript.

Aqui dejo el codigo:
    Sub boton1_Click(sender As Object, e As EventArgs)
dim ElementosEliminar as Arraylist = new Arraylist
for each item as ListItem in List1.Items
If item.Selected Then
List2.items.Add(New ListItem(item.text,item.value))
ElementosEliminar.add(item)
End If
next
RemoveElements(List1,ElementosEliminar)
End Sub

Sub boton2_Click(sender As Object, e As EventArgs)
dim ElementosEliminar as Arraylist = new Arraylist
for each item as ListItem in List2.Items
If item.Selected Then
List1.items.Add(New ListItem(item.text,item.value))
ElementosEliminar.add(item)
End If
next
RemoveElements(List2,ElementosEliminar)
End Sub


private function RemoveElements( Byref ListBox as ListBox,byval Elements as Arraylist)
for each item as ListItem in Elements
listBox.items.remove(item)
next

Se realizo una funcion RemoveElements, para no tener problemas con los indices.


Este es el codigo en el aspx:



  <table>
<tbody>
<tr>
<td>
<asp:ListBox id="List1" runat="server" SelectionMode="Multiple" AutoPostBack="false">
<asp:ListItem Value="valorhola">hola</asp:ListItem>
<asp:ListItem Value="valorChao">chao</asp:ListItem>
<asp:ListItem>hola1</asp:ListItem>
<asp:ListItem>hola2</asp:ListItem>
<asp:ListItem>hola3</asp:ListItem>
</asp:ListBox>
</td>
<td>
<asp:button id="boton1" onclick="boton1_Click" runat="server" AutoPostBack="true" text=">>"></asp:button>
<br />
<asp:button id="boton2" onclick="boton2_Click" runat="server" AutoPostBack="true" text="<<"></asp:button>
</td>
<td>
<asp:ListBox id="List2" runat="server" SelectionMode="Multiple"></asp:ListBox>
</td>
</tr>
</tbody>
</table>