I have two list boxes(A,B) with some values and i can send values from A to B or B to A and i have one save button.
For the first time without updating any list box if i click on save button i am showing message like "NO changes or Done"
But once i send one item from A to B and again sending that same item from B to A it means no changes or Done. here also i want to show same message "NO changes or Done" .but i am unable to fine the staus can any one pleasse give code or 开发者_如何学运维tips to find the default status for listboxs in javascript.
Thanks
I dont know why you want to do this with client side javascript, but here is an example: lbClicked is a js-function which is called onclick on the listboxes' items to remove the items and add them to the other listbox. The most important is that i have registered two javascript-arrays on serverside(Lb1Items and Lb2Items), they hold the values of the listboxes' items. When the user clicks the submit button(or what ever) i compare each listbox with the corresponding array. When all is the same nothing was changed.
function lbClicked(sender){
var lb1=document.getElementById("ListBox1");
var lb2=document.getElementById("ListBox2");
if(lb1 != null && lb2 != null){
if(sender==lb1){
var selectedItem=lb1.item(lb1.selectedIndex);
if(! contains(Lb2Items,selectedItem.value)){
lb1.remove(lb1.selectedIndex);
lb2.add(selectedItem);
}
}else if(sender==lb2){
var selectedItem=lb2.item(lb2.selectedIndex);
if(! contains(Lb1Items,selectedItem.value)){
lb2.remove(lb2.selectedIndex);
lb1.add(selectedItem);
}
}
}
}
function Button1_onclick() {
var changed=itemsChanged();
if(changed)
alert("Items Changed!");
else
alert("Items not changed!");
return changed;
}
function itemsChanged(){
if(Lb1Items != null && Lb2Items != null){
var lb1=document.getElementById("ListBox1");
var lb2=document.getElementById("ListBox2");
if(lb1 != null && lb2 != null){
if(lb1.options.length != Lb1Items.length || lb2.options.length != Lb2Items.length)
return true;
for(var i=0; i<lb1.options.length; i++){
var item=lb1.options[i];
if(! contains(Lb1Items,item.value))
return true;
}
for(var i=0; i<lb2.options.length; i++){
var item=lb2.options[i];
if(! contains(Lb2Items,item.value))
return true;
}
}
}
return false;
}
function contains(objArray,objectToFind){
for(var i=0;i<objArray.length;i++){
if(objArray[i]==objectToFind)
return true;
}
return false;
}
Tested with ASP.Net:
<form id="form1" runat="server">
<asp:ListBox ID="ListBox1" runat="server" onclick="javascript:lbClicked(this);" Height="84px">
<asp:ListItem Text="Item 1" Value="1"></asp:ListItem>
<asp:ListItem Text="Item 2" Value="2"></asp:ListItem>
<asp:ListItem Text="Item 3" Value="3"></asp:ListItem>
<asp:ListItem Text="Item 4" Value="4"></asp:ListItem>
<asp:ListItem Text="Item 5" Value="5"></asp:ListItem>
</asp:ListBox>
<asp:ListBox ID="ListBox2" runat="server" onclick="javascript:lbClicked(this);" Height="82px">
<asp:ListItem Text="Item 6" Value="6"></asp:ListItem>
<asp:ListItem Text="Item 7" Value="7"></asp:ListItem>
<asp:ListItem Text="Item 8" Value="8"></asp:ListItem>
<asp:ListItem Text="Item 9" Value="9"></asp:ListItem>
<asp:ListItem Text="Item 10" Value="10"></asp:ListItem>
</asp:ListBox>
<input id="Button1" type="button" value="button" onclick="return Button1_onclick()" />
</form>
and the array were registered on server-side this way:
ClientScript.RegisterArrayDeclaration("Lb1Items", "1,2,3,4,5")
ClientScript.RegisterArrayDeclaration("Lb2Items", "6,7,8,9,10")
Regards, Tim
EDIT: added check for identical number of items in itemsChanged-function and check if target listbox already contains the item to transfer
精彩评论