Improve company productivity with a Business Account.Sign Up

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 5356
  • Last Modified:

get multiple selected values

I have a form that has two select boxes with lists of countries. the user can select multiple countries from one box and move them to the other. when they get moved however I need to do some processing on the server side so I created code much like the following example with a javascript function that is supposed to copy the values from the selected items in the box and create a commadilimited list that I can copy into the hidden "Countries" input box on the neccessary form. However I don't know how to create the comma delimited list of selected items. here is what I have (which returns the index position of the first selected item instead of a coma delimited list of all the selected options values)




<script language="JavaScript">
function AddCountries()
{
     var Countries = document.frmSaveDistributionList.unmappedCountriesIds.selectedIndex;
     document.frmAddCountries.Countries.value = Countries;
     document.frmAddCountries.submit();
}
function RemoveCountries()
{
     var Countries = document.frmSaveDistributionList.mappedCountriesIds.selectedIndex;
     document.frmRemoveCountries.Countries.value = Countries;
     document.frmRemoveCountries.submit();
}
</script>

<FORM NAME="frmSaveDistributionList" ACTION="/HMCClubCentral/Index.cfm" METHOD=POST>
<table>
     <tr>
          <td>
               <select multiple name="unmappedCountriesIds" size="7" width="340" style="width=340">
                    <option value="209">South Africa</option>
                    <option value="208">New Caledonia</option>
                    <option value="207">United Kingdom</option>
               </select>
          </td>
          <td align="center" valign="top">
               <a href="" onClick="AddCountries(); return false;">
               <img src="Viewers/Images/add.gif" width="47" height="19" alt="Move the Highlighted Subject to the Choice Box" border="0">
               </a>
               <BR>
               <a href="" onClick="RemoveCountries(); return false;">
               <img src="Viewers/Images/remove.gif" width="67" height="19" alt="Remove the Highlighted Subject from the Choice Box" border="0">
               </a>
          </td>
          <td align="left" valign="top">
               <select multiple name="mappedCountriesIds" size="7" width="340" style="width=340">
                    <option value="204">Taiwan</option>
               </select>
          </td>
     </tr>
</table>

<form name="frmAddCountries" action="/HMCClubCentral/Index.cfm" method="post">
<input type="Hidden" name="dlfrmAction" value="AddCountries">
<input type="Hidden" name="Countries" value="">
</form>
<form name="frmRemoveCountries" action="/HMCClubCentral/Index.cfm" method="post">
<input type="Hidden" name="dlfrmAction" value="RemoveCountries">
<input type="Hidden" name="Countries" value="">
</form>
0
Scott Bennett
Asked:
Scott Bennett
1 Solution
 
thirdCommented:

<SCRIPT>
function getSelectedValues (select) {
  var r = new Array();
  for (var i = 0; i < select.options.length; i++)
    if (select.options[i].selected)
      r[r.length] = select.options[i].value;
  return r;
}

function getSelectedTexts (select) {
  var r = new Array();
  for (var i = 0; i < select.options.length; i++)
    if (select.options[i].selected)
      r[r.length] = select.options[i].text;
  return r;
}

function getSelectedIndices (select) {
  var r = new Array();
  for (var i = 0; i < select.options.length; i++)
    if (select.options[i].selected)
      r[r.length] = i;
  return r;
}

function AddCountries(){
  var Countries = getSelectedValues(document.frmSaveDistributionList.unmappedCountriesIds);
  alert(Countries);
  document.frmAddCountries.Countries.value = Countries;
  document.frmAddCountries.submit();
}

function RemoveCountries(){
  var Countries = getSelectedValues(document.frmSaveDistributionList.mappedCountriesIds);
  alert(Countries);
  document.frmRemoveCountries.Countries.value = Countries;
  document.frmRemoveCountries.submit();
}

</SCRIPT>

the other two functions are optional (getSelectedTexts and getSelectedIndices). it might be also useful for you if you want to return the selected texts or indices.
0
 
Scott BennettManager TechnologyAuthor Commented:
Thanks that worked perfectly
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

The 14th Annual Expert Award Winners

The results are in! Meet the top members of our 2017 Expert Awards. Congratulations to all who qualified!

Tackle projects and never again get stuck behind a technical roadblock.
Join Now