多个选择字段无法提交表单？

Question

我有多个选择框，一个在左边，另一个在右边。有添加和删除按钮，以便用户可以将项目从左侧框添加到右侧框，反之亦然从右侧框添加项目到左侧。 一切正常，但当我提交表单时，有两个框不提交。

这是JavaScript：

<script language="Javascript"> 
function SelectMoveRows(SS1,SS2) 
{ 
    var SelID=''; 
    var SelText=''; 
    // Move rows from SS1 to SS2 from bottom to top 
    for (i=SS1.options.length - 1; i>=0; i--) 
    { 
     if (SS1.options[i].selected == true) 
     { 
      SelID=SS1.options[i].value; 
      SelText=SS1.options[i].text; 
      var newRow = new Option(SelText,SelID); 
      SS2.options[SS2.length]=newRow; 
      SS1.options[i]=null; 
     } 
    } 
    SelectSort(SS2); 
} 
function SelectSort(SelList) 
{ 
    var ID=''; 
    var Text=''; 
    for (x=0; x < SelList.length - 1; x++) 
    { 
     for (y=x + 1; y < SelList.length; y++) 
     { 
      if (SelList[x].text > SelList[y].text) 
      { 
       // Swap rows 
       ID=SelList[x].value; 
       Text=SelList[x].text; 
       SelList[x].value=SelList[y].value; 
       SelList[x].text=SelList[y].text; 
       SelList[y].value=ID; 
       SelList[y].text=Text; 
      } 
     } 
    } 
} 
</script> 

这是我的形式：

<form name="Example" method="post" action="someactionpage.cfm"> 
Use the ADD button to move columns that match with your excel file  
from the right pane to the left 

       <select name="Features" size="20" MULTIPLE> 
        <option value="MName">Middle Name</option> 
        <option value="Gender">Gender</option> 
        <option value="RaceCode">Race Code</option> 
        <option value="BirthDate">Birthdate</option> 
        <option value="HomeAddr1">Home Address 1</option> 
        <option value="HomeAddr2">Home Address 2</option> 
        <option value="HomeAddr3">Home Address 3</option> 
        <option value="HomeCity">Home City</option> 
        <option value="HomeState">Home State</option> 
        <option value="HomeZip">Home Zip</option> 
        <option value="HomeCountry">Home Country</option> 
        <option value="HomePhone">Home Telephone</option> 
        <option value="HomeFax">Home Fax</option> 
        <option value="HomeCell">Home Cell Phone</option> 
        <option value="HomeEmail">Home Email</option>   
       </select> 

       <input type="Button" value="Add >>" style="width:100px" 
     onClick="SelectMoveRows(document.Example.Features, 
     document.Example.FeatureCod 
     es)"> 
       <input type="Button" value="<< Remove"  
     style="width:100px" onClick="SelectMoveRows(document.Example. 
    FeatureCodes,document.Example.Features)"> 

       <select name="FeatureCodes" size="20" MULTIPLE> 
        <option value="LName">Last Name</option> 
        <option value="FName">First Name</option> 
       </select> 

<tr><td><input type="submit" name="SubmitColumn" value="NEXT"></td></tr> 
</table> 
</form> 

同样，这个代码工作得很好。物品移动并从右移到右移，反之亦然。问题是当我提交表单时，我没有得到这两个表单字段值。我没有看到form.Features和form.FeatureCodes但我对actionpage

Answer 1

由于@Leigh在他的评论中提到，我们需要在选择框中选择了form.SubmitColumn进行选择，这样，这些值将发送到服务器。我已经选择了多个选择框中的选项。所以现在它会提交表单提交这些值。

而且我注意到，SelectSort功能发生故障，所以我修改了代码如下，并使其工作。尝试下面的代码。希望它可以解决你的需求。

<script language="Javascript"> 
    function SelectMoveRows(SS1,SS2) 
    { 
     var SelID=''; 
     var SelText=''; 
     // Move rows from SS1 to SS2 from bottom to top 
     for (i=SS1.options.length - 1; i>=0; i--) 
     { 
      if (SS1.options[i].selected == true) 
      { 
       SelID=SS1.options[i].value; 
       SelText=SS1.options[i].text; 
       var newRow = new Option(SelText,SelID); 
       SS2.appendChild(newRow);    
       SS1.options[i]=null; 
      } 
     } 
    } 

    function selectall(form){ 

     var sel1 = form.Features.options; 
     var sel2 = form.FeatureCodes.options; 

     for (i=0;i<=sel1.length-1;i++){ 
      sel1[i].selected = true; 
     } 

     for (j=0;j<=sel2.length-1;j++){ 
      sel2[j].selected = true; 
     } 
    } 
</script> 

HTML：

<form name="Example" method="post" action="" onsubmit="javascript:selectall(this);"> 
Use the ADD button to move columns that match with your excel file  
from the right pane to the left 

       <select name="Features" size="20" MULTIPLE> 
        <option value="MName">Middle Name</option> 
        <option value="Gender">Gender</option> 
        <option value="RaceCode">Race Code</option> 
        <option value="BirthDate">Birthdate</option> 
        <option value="HomeAddr1">Home Address 1</option> 
        <option value="HomeAddr2">Home Address 2</option> 
        <option value="HomeAddr3">Home Address 3</option> 
        <option value="HomeCity">Home City</option> 
        <option value="HomeState">Home State</option> 
        <option value="HomeZip">Home Zip</option> 
        <option value="HomeCountry">Home Country</option> 
        <option value="HomePhone">Home Telephone</option> 
        <option value="HomeFax">Home Fax</option> 
        <option value="HomeCell">Home Cell Phone</option> 
        <option value="HomeEmail">Home Email</option>   
       </select> 

       <input type="Button" value="Add >>" style="width:100px" 
     onClick="SelectMoveRows(document.Example.Features,document.Example.FeatureCodes)"> 
       <input type="Button" value="<< Remove"  
     style="width:100px" onClick="SelectMoveRows(document.Example. 
    FeatureCodes,document.Example.Features)"> 

       <select name="FeatureCodes" size="20" MULTIPLE> 
        <option value="LName" >Last Name</option> 
        <option value="FName" >First Name</option> 
       </select> 

<tr><td><input type="submit" name="SubmitColumn" value="NEXT"></td></tr> 
</table> 
</form>