Thursday, March 29, 2012

List Box help

I have a web application where I have two List boxes side by side on the form. The first one lists all the available projects. When a project is selected, and a button is clicked, the data is transfered into the other list box. I know I could just set the selection mode of the list box to multiple but I am trying to make it easier for my users. On submitting the form, I wish to capture all the items that has been transfered into the second listbox. Is it possible to do this without the items in the second listbox been selected? A URL to this problem is:

http://cms-stu-iis.gre.ac.uk/as015/project/question.aspx

The code I have is :


<%@dotnet.itags.org. Page Language="VB"%
<script runat="server"
Sub Page_Load(sender as Object, e as EventArgs)

End Sub

Sub btnAdd_Click(sender as Object, e as EventArgs)
'Check to see if it has already been selected, add it if it's not
If lstProjectsAdd.Items.FindByValue(lstProjects.SelectedValue) is Nothing AND lstProjects.SelectedValue <> "" Then
lstProjectsAdd.Items.Add(new ListItem(lstProjects.SelectedItem.Text, lstProjects.SelectedValue))
'Remove Item from the source control, You can take this line out if you think it is not necessary
lstProjects.Items.Remove(lstProjects.Items.FindByValue(lstProjects.SelectedValue))
'lstPAdd.Items.FindByValue("10").Selected = true
End If
End Sub

Sub btnSubtract_Click(sender as Object, e as EventArgs)
'Check to see if it has already been selected, add it if it's not
If lstProjects.Items.FindByValue(lstProjectsAdd.SelectedValue) is Nothing AND lstProjectsAdd.SelectedValue <> "" Then
'Comment out this line if you took out the feature in "btnAdd_Click" Click event
lstProjects.Items.Add(new ListItem(lstProjectsAdd.SelectedItem.Text, lstProjectsAdd.SelectedValue))
'Remove Item from the source control
lstProjectsAdd.Items.Remove(lstProjectsAdd.Items.FindByValue(lstProjectsAdd.SelectedValue))
End If
End Sub

</Script
<form runat="server">
<Table>
<tr>
<td>Available Projects</td><td> </td><td>Selected Projects</td>
</tr>
<tr>
<td><asp:ListBox id="lstProjects" runat="server" Width="200px" Height="137px">
<asp:ListItem value="1">SkyWise</asp:ListItem>
<asp:ListItem value="2">B2B For Neta</asp:ListItem>
<asp:ListItem value="3">James Norton LTD</asp:ListItem>
</asp:ListBox>
</td>
<td>
<asp:Button id="btnAdd" runat="server" Width="42px" Text=">>" onclick="btnAdd_Click"></asp:Button>
<br>
<asp:Button id="btnSubtract" runat="server" Width="42px" Text="<<" onclick="btnSubtract_Click"></asp:Button>
</td>
<td><asp:ListBox id="lstProjectsAdd" runat="server" Width="200px" Height="137px" SelectionMode="Multiple"
</asp:ListBox>
</td>
</tr>
<tr>
<td colspan="3"><asp:Button id="btnSubmit" runat="server" Width="122px" Text="Add Data"></asp:Button></td>
</tr>
</table>
</form

Thanks .I've updated your code to handle the Add Data button. It reports which items were selected. Hopefully this will demonstrate how to capture the items that have been added to the second listbox.

<%@. Page Language="VB"%>
<script runat="server"
Sub Page_Load(sender as Object, e as EventArgs)

End Sub

Sub btnAdd_Click(sender as Object, e as EventArgs)
'Check to see if it has already been selected, add it if it's not
If lstProjectsAdd.Items.FindByValue(lstProjects.SelectedValue) is Nothing AND lstProjects.SelectedValue <> "" Then
lstProjectsAdd.Items.Add(new ListItem(lstProjects.SelectedItem.Text, lstProjects.SelectedValue))
'Remove Item from the source control, You can take this line out if you think it is not necessary
lstProjects.Items.Remove(lstProjects.Items.FindByValue(lstProjects.SelectedValue))
'lstPAdd.Items.FindByValue("10").Selected = true
End If
End Sub

Sub btnSubtract_Click(sender as Object, e as EventArgs)
'Check to see if it has already been selected, add it if it's not
If lstProjects.Items.FindByValue(lstProjectsAdd.SelectedValue) is Nothing AND lstProjectsAdd.SelectedValue <> "" Then
'Comment out this line if you took out the feature in "btnAdd_Click" Click event
lstProjects.Items.Add(new ListItem(lstProjectsAdd.SelectedItem.Text, lstProjectsAdd.SelectedValue))
'Remove Item from the source control
lstProjectsAdd.Items.Remove(lstProjectsAdd.Items.FindByValue(lstProjectsAdd.SelectedValue))
End If
End Sub

Sub btnSubmit_Click(sender as Object, e as EventArgs)
Message.Text = "Selected items:<br />"
Dim thisItem As ListItem
For Each thisItem in lstProjectsAdd.Items
Message.Text &= thisItem.Text & "<br />"
Next
End Sub

</script>
<html>
<head>
</head>
<body>
<form runat="server">
<Table>
<tr>
<td>Available Projects</td><td> </td><td>Selected Projects</td>
</tr>
<tr>
<td><asp:ListBox id="lstProjects" runat="server" Width="200px" Height="137px">
<asp:ListItem value="1">SkyWise</asp:ListItem>
<asp:ListItem value="2">B2B For Neta</asp:ListItem>
<asp:ListItem value="3">James Norton LTD</asp:ListItem>
</asp:ListBox>
</td>
<td>
<asp:Button id="btnAdd" runat="server" Width="42px" Text=">>" onclick="btnAdd_Click"></asp:Button>
<br>
<asp:Button id="btnSubtract" runat="server" Width="42px" Text="<<" onclick="btnSubtract_Click"></asp:Button>
</td>
<td><asp:ListBox id="lstProjectsAdd" runat="server" Width="200px" Height="137px" SelectionMode="Multiple"
</asp:ListBox>
</td>
</tr>
<tr>
<td colspan="3"><asp:Button id="btnSubmit" runat="server" Width="122px" onclick="btnSubmit_Click" Text="Add Data"></asp:Button></td>
</tr>
</table>
<asp:Label id="Message" enableviewstate="False" runat="server" />
</form>
</body>
</html>


By the way, there is an existing control that does what you're seeking:DualList

One thing it does, that your method does not, is allow the items to be moved back and forth without forcing a postback every time.

It is free and open-source. So, it's an option to keep in mind.
Thank you so much for the response. The control looks even better.
There are some great controls on theMetaBuilders site. At the moment, they are all free and open-source. So, it's a great place to bookmark.

But, there's great educational value in developing your own controls and mechanisms. You've almost finished your own Dual ListBox system, and you've done well. Why not finish your own system for its educational value? Then, when the warm glow of finishing your own system has faded, you can switch to the MetaBuilder's control ...
It's a good idea, I've always wanted to write my own controls but unfortunately I have not had the time to learn how to go about it yet, as i've only been using .net for just under a year. I'll definitely be doing that very soon.
Oh, I didn't mean turning it into an actual server control. Believe me, that's harder than you'd think! (Though a User Control would be easy.)

I only meant you could proceed with what you have; get it working on the page exactly as you have it now. That is, finish the task you set yourself. Again, just for the educational value.

Just a thought ...
I'm coming in late on this one, but it might be worth your while to check outEasyListBox as well; it doesn't have many of the limitations of the DualList control -- which is still great for a free control -- and it's based on the EasyListBox rendering engine, so you have a whole lot more features as well.

0 comments:

Post a Comment