Greetings all,
Currently I have a form that has two lists that contain <options>.
I use javacript to dynamically move options from one select list to another.
All this works fine...
this is the <select>:
<select name="trucklist" size="12" style="width: 150px" multiple>
<option value="LT680">LT680</option>
<option value="LT685">LT685</option>
<option value="LT690">LT690</option>
<option value="LT695">LT695</option>
<option value="LT700">LT700</option>
<option value="LT705">LT705</option>
</select>
Now I wish to "post" all the options from one list to another page. So I
select all the options in that list and hit the "submit" button.
Obviously, a select list, will return each value with the same name to the
second web page. Therefore we can only capture the last option posted.
To resolve this we have to create an array out of our select name:
<select name="trucklist[]" size="12" style="width: 150px" multiple>
I added the square brakets to the name...now when I select all the options
on the list I can read all values individually.
Here is problem...my javascripts have stopped working, I can't move options
from one list to the next. Here is the javascript I use currently...I would
like help in modifing it so that it may work while using the brakets on the
name of the select:
Thanks a bunch for the help!! Always appreciated
First the two list that transmit the options back and forth: (javascript
below)
<select name="trucklist" size="12" style="width: 150px" multiple>
<option value="LT680">LT680</option>
<option value="LT685">LT685</option>
<option value="LT690">LT690</option>
<option value="LT695">LT695</option>
<option value="LT700">LT700</option>
<option value="LT705">LT705</option>
</select>
</td>
<td>
<input type="button" name="SelectAll" value=">> All" style="width:
100px;" onClick="MoveAll(fleetForm.trucklist, fleetForm.reportinglist)"><br>
<input type="button" name="Select" value=">>" style="width: 100px;"
onClick="Move(fleetForm.trucklist, fleetForm.reportinglist)"><br><br>
<input type="button" name="Unselect" value="<<" style="width: 100px;"
onClick="Move(fleetForm.reportinglist, fleetForm.trucklist)"><br>
<input type="button" name="UnselectAll" value="<< All" style="width:
100px;" onClick="MoveAll(fleetForm.reportinglist, fleetForm.trucklist)">
</td>
<td>
<select name="reportinglist[]" size="12" style="width: 150px" multiple>
____________________
here is the javascript:
function Move(fromList, toList){
var tempArray = new Array();
var x = 0;
//looping through source element to find selected options
for (var i = 0; i < fromList.length; i++) {
if (fromList.options[i].selected) {
//need to move this option to the 'to' list
var selectionLen = toList.length++;
toList.options[selectionLen].text =
fromList.options[i].text;
toList.options[selectionLen].value =
fromList.options[i].value;
}
else {
//storing options that stay to recreate selected trucks
var tempValues = new Object();
tempValues.text = fromList.options[i].text;
tempValues.value = fromList.options[i].value;
tempArray[y] = tempValues;
y++;
}
}
//resetting length of 'from' list
fromList.length = tempArray.length;
//looping through temp array to recreate intial selection
for (var i = 0; i < tempArray.length; i++) {
fromList.options[i].text = tempArray[i].text;
fromList.options[i].value = tempArray[i].value;
fromList.options[i].selected = false;
}
}
function MoveAll(from, to){
selectAll(from);
Move(from, to);
}
function selectAll(trucklist) {
if (!hasTruck(trucklist)) { return; }
for (var i=0; i<trucklist.options.length; i++)
trucklist.options[i].selected = true;
}
--
PHP General Mailing List (http://www.php.net/)
To unsubscribe, visit: http://www.php.net/unsub.php
