Hi
I was wondering if anyone else had had this problem before (can't find
anything on the web about it).
I have three select elements (list boxes - from here on I'll refer to
them as 'the list boxes'). Users can add and remove items from the
list boxes.
When the users are adding and removing items, the list boxes are single
selection only. However, when the form is submitted, I want ALL items
to be submitted. So I have written the following script,which ensures
that all elements in each box are selected when the user submits the
form. It works by programatically setting the list boxes to multiple,
and then selecting the controls in them:
function selectAllInLists()
{
var controlArray = new Array();
controlArray[0] = "bTelephone";
controlArray[1] = "bEmail";
controlArray[2] = "bWebsite";
for(var i=0;i<controlArray.length;i++)
{
var listWeb = document.getElementById(controlArray[i]);
listWeb.multiple = true;
for(var j=0;j<listWeb.length;j++)
{
listWeb[j].selected = true;
}
}
}
This works fine with Firefox, and most of the time in Internet
Explorer. However, if the user wants to update an existing record, and
the list boxes have more than one element (each), and the user makes no
change to the list boxes (doesn't touch them), THEN only the last item
in each list box is passed when the form is submitted. Perplexing!!
I've tried a number of hacks, such as programmatically selecting the
list box when entering the page, and adding and deleting one
programmatically. No luck.
Any pointers would be greatly appreciated!
Cheers
James