多個選擇字段無法提交表單？

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>