2 listbox(html control) and javascript between them

[Guest]

Hi all,
i m transefering values from one listbox to another listbox using
javascript(both are html controls), the first listbox is populating with
database at page_load time and the second listbox is empty initially .the two
buttons which i have taken are both(btnAd,btnRemove) have values Add,Remove
and both are input type with run as server control property set to true,.my
script is given below , however when i click on add button the items go to
another listbox but disaapears at the same moment ,, i dont know what is the
reason.. plz help me ....should i change the script or what ...if possible
kindly help me with new script or entire solution.. my sincere thanks in
advance.. i want to remove the items from the other listbox also on clicking
remove buton using javascipt...i want to set multiple selection property true
in both listboxes also. also when i add to second list box then i have to
insert the values of items to database table also and on removeing it should
remove from listbox and from database table(i.e. those values) also ,.
------------------------------------------------------------------------------------------------
function doDetail(Action)
{
switch(Action)
{
case 'Add':
var lstFrom = document.getElementById("lstFrom");
var lstTo = document.getElementById("lstTo");
if(document.Form1.lstFrom.selectedIndex == -1)
{
alert('Please select atleast one record to Add');
return;
}
else
{
var selIndex = lstFrom.selectedIndex;
var optionText = lstFrom.options[selIndex].text;
var optionVal = lstFrom.options[selIndex].value;
var optionIndex = lstTo.options.length;
var objOption = new Option(optionText, optionVal);
lstTo.options[optionIndex] = objOption;
lstFrom.options[selIndex] = null;
}
break;

case 'Remove':
var lstFrom = document.getElementById("lstTo");
var lstTo = document.getElementById("lstFrom");
if(document.Form1.lstFrom.selectedIndex == -1)
{
alert('Please select atleast one record to Remove');
return;
}
else
{
var selIndex = lstFrom.selectedIndex;
var optionText = lstFrom.options[selIndex].text;
var optionVal = lstFrom.options[selIndex].value;
var optionIndex = lstTo.options.length;
var objOption = new Option(optionText, optionVal);
lstTo.options[optionIndex] = objOption;
lstFrom.options[selIndex] = null;
}
break;

}
}


Private Sub Page_Load(ByVal sender As System.Object, ByVal e As
System.EventArgs) Handles MyBase.Load
'Put user code to initialize the page here
'Button1.Attributes("OnClick") = "javascript:AddVals()"
'Button2.Attributes("OnClick") = "javascript:RemVals()"

btnAdd.Attributes("OnClick") = "javascript:doDetail(this.value);"
btnRemove.Attributes("OnClick") = "javascript:doDetail(this.value);"


If Page.IsPostBack = False Then
fnFillListBox()

End If
End Sub
Public Sub fnFillListBox()
Dim strDatabaseId, strDatabaseName As String

Dim sql As String = "select DatabaseName,DatabaseID from mstDatabase"
Conn = New SqlConnection(connstr)
Conn.Open()
Cmd = New SqlCommand(sql, Conn)
dtrdr = Cmd.ExecuteReader
dtrdr.Read()
lstFrom.DataSource = dtrdr
lstFrom.DataTextField = "DatabaseName"
lstFrom.DataValueField = "DatabaseID"
lstFrom.DataBind()
dtrdr.Close()
Cmd.Dispose()
Conn.Close()
Conn.Dispose()
End Sub
------------------------------------------------------------------------------------------------