Looking at your code, you're not using a Prototype-flavored accessor
for your object, so it's probably not going to work the way I was
explaining. If you get a reference to your form field with $
('selectedOptions') rather than using the long-hand (harder to type)
document.getElementById('selectedOptions'), then you will also have
access to .getValue(), or its shortened form $F(). Pass either of
those a reference to an extended form element (extended here meaning
that Prototype has grabbed it and pumped it full of juicy new
features), and you will be able to do lots of magick with it,
including read its value(s) in a clean and browser-safe manner.
But you have a much larger problem here: your form field (select) is
named selectedOptions rather than selectedOptions[], which means that
PHP can't do anything with it. If you post such a field to the server,
you will only get the last value sent, because the values in your form
submission will look like this:
...&selectedOptions
=foo&selectedOptions=bar&selectedOptions=baz&selectedOptions=boo&...
so each input will overwrite the last, with the net effect being that
selectedOptions only equals boo.
If you name the field selectedOptions[], then no matter how many
values the user chooses, they can all be read by the server, because
the form will arrive with selectedOptions =
Array('foo','bar','baz','boo').
Walter
On Jul 3, 2011, at 4:13 PM, Phil Petree wrote:
I suspect you're right... its probably something really stupid...
Here's the specific html for the two listboxes (see below for the
rest):
<fieldset>
<legend>Step 4: Pick the distribution zone(s)</legend>
<div class='div_left'>
<label class='column' id='labavail_zones'
for='ajavail_zones'>Available Zones</label><?php fill_pdzones(); ?>
</div>
<div class='div_center'>
<input type='button' value=' >>' onclick="addAll()"><br>
<input type='button' value=' > '
onclick="addAttribute()"><br>
<input type='button' value=' < '
onclick="delAttribute()"><br>
<input type='button' value='<< ' onclick="delAll()">
</div>
<div class='div_right'>
<label class='column' id='labdest_zones'
for='selectedOptions'>Destination Zones</label>
<select id='selectedOptions' name='selectedOptions' style="width:
150px;" size="4" multiple="multiple">
<option value='whoohoo'>test</option>
</select>
</div>
</fieldset>
the first select is created and filled with this code:
function fill_pdzones()
{
echo "<select id='availableOptions' name='availableOptions'
style='width:150px;' size='4' multiple='multiple'>\n";
// boring stuff omitted
$result = sql_query($query);
while( $record = mysql_fetch_array($result, MYSQL_ASSOC ) )
{
$zone_name = $record['zone_name'];
echo "<option value='$zone_name'>$zone_name</option>\n";
}
// close off this select
echo "</select>\n";
}
The javascript used to move items between list boxes is this:
// JavaScript Document
var selectedList;
var availableList;
function createListObjects(szSource, szDestination)
{
availableList = document.getElementById(szSource);
selectedList = document.getElementById(szDestination);
}
function delAttribute(){
var selIndex = selectedList.selectedIndex;
if(selIndex < 0)
return;
availableList.appendChild(
selectedList.options.item(selIndex))
selectNone(selectedList,availableList);
setSize(availableList,selectedList);
}
function addAttribute(){
var addIndex = availableList.selectedIndex;
if(addIndex < 0)
return;
selectedList.appendChild(
availableList.options.item(addIndex));
selectNone(selectedList,availableList);
setSize(selectedList,availableList);
}
function setTop(top){
document.getElementById
('someLayer').style.top = top;
}
function setLayerTop(lyr,top){
lyr.style.top = top;
}
function setSize(list1,list2){
list1.size = getSize(list1);
list2.size = getSize(list2);
}
function selectNone(list1,list2){
list1.selectedIndex = -1;
list2.selectedIndex = -1;
addIndex = -1;
selIndex = -1;
}
function getSize(list){
/* Mozilla ignores whitespace,
IE doesn't - count the elements
in the list */
var len = list.childNodes.length;
var nsLen = 0;
//nodeType returns 1 for elements
for(i=0; i<len; i++){
if(list.childNodes.item(i).nodeType==1)
nsLen++;
}
if(nsLen<2)
return 2;
else
return nsLen;
}
function delAll(){
var len = selectedList.length -1;
for(i=len; i>=0; i--){
availableList.appendChild(selectedList.item(i));
}
selectNone(selectedList,availableList);
setSize(selectedList,availableList);
}
function addAll(){
var len = availableList.length -1;
for(i=len; i>=0; i--)
{
selectedList.appendChild(availableList.item(i));
}
selectNone(selectedList,availableList);
setSize(selectedList,availableList);
}
function showSelected()
{
var optionList =
document.getElementById("selectedOptions").options;
var data = '';
var len = optionList.length;
for(i=0; i<len; i++)
{
data += ',';
data += optionList.item(i).value;
}
alert(data);
}
On Sat, Jul 2, 2011 at 6:29 PM, Walter Lee Davis
<wa...@wdstudio.com> wrote:
On Jul 2, 2011, at 6:09 PM, Phil Petree wrote:
When making the following ajax call:
new Ajax.Updater( 'result', url, {method: 'post', parameters: $
('myform').serialize(), onSuccess: fill_in, onFailure: ajax_err,
on0: ajax_err});
I was wondering why my listbox contents were not showing up on the
server... stepping through the Ajax.Updater call in prototype I
found parameters was set/serialized as follows:
parameters
"status
=
insert
&record
=
&userid
=2&police=0&injury=0&damage=0&occured=07%2F02%2F2011&message_text=woo
%20hoo&countdown=1017&lat=&lon=&fixed=2020%20NE%2056th%20St.%2C%20Ft.
%20Lauderdale%2C%20FL%2033308" String
At the end, where "String" is dangling like a participle, should be
the name of a listbox and the single option in the listbox.
Would someone kindly tell me what I have to do to get a listbox to
serialize?
Thanks!
It should just do. Can you please post the complete HTML for that
select? My guess is that the HTML isn't valid somehow, but String is
a mighty funny output for the getValue() function.
Walter
--
You received this message because you are subscribed to the Google
Groups "Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
.
To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com
.
For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en
.
--
You received this message because you are subscribed to the Google
Groups "Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
.
To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com
.
For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en
.
--
You received this message because you are subscribed to the Google Groups "Prototype
& script.aculo.us" group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com.
To unsubscribe from this group, send email to
prototype-scriptaculous+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en.
