Retrieve Droplist data for form

phillx

I am uncertain of the exact terminology and I am extremely hopeful that some will be able to assist me. 8)

Below is a sample of the code - what I need is to collect the results of the selection.
In this case a user selects a city/cities (in Texas) - This will be added to their favorites list.

Expand|Select|Wrap|Line Numbers

 <head>

<title>Select Cities</title>

<script language="javascript">

function addOption(selectbox,text,value )

{

    var optn = document.createElement("OPTION");

    optn.text = text;

    optn.value = value;

    selectbox.options.add(optn);

}

function removeOption(listbox,i)

{

    listbox.remove(i);

}

function addOption_list(){

 for(i=document.drop_list.Category.options.length-1;i>=0;i--)    {

  var Category=document.drop_list.Category;

  if(document.drop_list.Category[i].selected){

    addOption(document.drop_list.SubCat, document.drop_list.Category[i].text, document.drop_list.Category[i].value);

    removeOption(Category,i);

    }

  }

}

function remOption(listbox,text,value )

{

    var optn = document.createElement("OPTION");

    optn.text = text;

    optn.value = value;

    listbox.options.add(optn);

}
 
function remove2Option(selectbox,i)

{

    selectbox.remove(i);

}

function remOption_list(){

 for(i=document.drop_list.SubCat.options.length-1;i>=0;i--)    {

  var SubCat=document.drop_list.SubCat;

  if(document.drop_list.SubCat[i].selected){

    remOption(document.drop_list.Category, document.drop_list.SubCat[i].text, document.drop_list.SubCat[i].value);

    remove2Option(SubCat,i);

    }

  }

}

</script>

</head>

<body>

<form name="drop_list" action="results.php" method="post">

<table width="200" cellspacing="0" cellpadding="5" border="0">

 <tr>  

  <td valign="top" width="90">

  <select name="Category" multiple="multiple" size="10">

   <option value="Amarillo">Amarillo</option>

   <option value="Austin">Austin</option>

   <option value="Dallas">Dallas</option>

   <option value="Galveston">Galveston</option>

   <option value="Houston">Houston</option>

   <option value="Irving">Irving</option>

   <option value="Killeen">Killeen</option>

   <option value="Laredo">Laredo</option>

   <option value="Lubbock">Lubbock</option>

   <option value="Plano">Plano</option>

   <option value="San Antonio">San Antonio</option>

   <option value="Waco">Waco</option>

  </select>

  </td><td valign="middle" width="20">

  <input onclick="addOption_list()" ;="" value="ADD &raquo;" type="button"><br />

  <input onclick="remOption_list()" ;="" value="&laquo; REMOVE" type="button"></td>

  <td valign="top" width="90">

  <select name="SubCat" multiple="multiple" size="10">

  </select></td>

 </tr>

</table><br />

<input type="submit" value="Select">

</form>

</body>

The results are supposed to be sent to another page - However, they are not able to be retrieved??
results.php => should show the information, correct?

Expand|Select|Wrap|Line Numbers

 <table cellspacing="2" cellpadding="0" width="100%" border="0">

 <tr>

  <td><? echo $SubCat; ?></td>

 </tr>

</table>

The information will eventually be inserted into a database. I am just trying to determine how I gather the users selection?

Thank in advance...

Dormilich

Quote:

Originally Posted by phillx

The results are supposed to be sent to another page - However, they are not able to be retrieved??
results.php => should show the information, correct?

I think it's due to the fact, that the second select box has no option selected to be submitted by the form (it's no use to submit an unselected option, is it?).

phillx

I agree - how do I go about making certain that this is accomplished?

I am able to have the items selected and moved to the other listbox...

Dormilich

after you move the user's selection, you have to select them again in the second box (you may do that just before sending).

phillx

Dormilich -

Thank you for the reply.

I completely understand that - the problem or confussion that I am having is how do I go about reselecting the transferred data?

Can you provide me with a possible solution?

Thanx

Dormilich

basic idea (untested):

Expand|Select|Wrap|Line Numbers

 function addOption(selectbox,text,value )

{

    var optn = document.createElement("option");

    optn.text = text;

    optn.value = value;

    optn.selected = "selected";

    selectbox.options.add(optn);

}

phillx

Dormilich -

Awesome!

However, I just tested the above and it only partially works. :-(

This will highlight (select) each item.

Although, only the last submission to be transferred into the second listbox is actually selected (sent on to the following page) ??

hmmm - any suggestions on how to select all items? I know it has been done on other sites - I am just not certain how to go about accomplishing it?

I really appreciate your (and anyone elses) assistance!

acoder

The correct add method has two arguments, but IE uses one, so for cross-browser support, try this:

Expand|Select|Wrap|Line Numbers

     optn.selected = true;

    try {

      selectbox.options.add(optn,null);

    } catch {

      selectbox.options.add(optn);

    }

In your PHP code, are you setting the $subCat variable properly to get the posted values?

phillx

Acoder -
Unfortunately - that Code produced several javascript errors?!

Yes, I do have the the code getting the $subCat otherwise I would have no results? I am a bit confused by that. Is there another way of retrieving data?

acoder

Are you sure you replaced the code in addOption()?

You can change the name of the options to subCat[] to use it as an array in PHP.

Retrieve Droplist data for form

re: Retrieve Droplist data for form

re: Retrieve Droplist data for form

re: Retrieve Droplist data for form

re: Retrieve Droplist data for form

re: Retrieve Droplist data for form

re: Retrieve Droplist data for form

re: Retrieve Droplist data for form

re: Retrieve Droplist data for form

re: Retrieve Droplist data for form

Similar JavaScript / Ajax / DHTML bytes

/bytes/development

/bytes/it

/bytes/about