简体   繁体   中英

How to get select box to show all its contents when checking from python script.

I want to have two select boxes, one empty and one populated. The user will move some of the items from the populated select box to the empty select box. I have that working. What I need help on is that when the items are moved over to the empty select box and submit is pressed, no data is sent concerning the empty select box that is now populated. I have found that this is because as the person moves items over they are not kept selected. Is there something besides a select box that looks like a select box that I can use or is there some other way for me to find out what has been moved from one box to the other? I am doing the processing of the form in python and have attached the basic code that I am using.

.html:

<html>
<head>
</head>

<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>


<body>
<form name="projectBuild" action="../cgi-bin/pythonTest.cgi" enctype="multipart/form-data" method="POST">

<table>
        <tr>
                <td align="center">
                    <SELECT NAME="selectList" style="width: 100%" MULTIPLE>
                    <!--<SELECT NAME="selectList" MULTIPLE>-->
                        <OPTION VALUE="crc">CRC</option>
                        <OPTION VALUE="vector">Vector</option>
                        <OPTION VALUE="mm">Matrix Multiply</option>
                        <OPTION VALUE="bubblesort">Bubble Sort</option>
                        <OPTION VALUE="quicksort">Quick Sort</option>
                    </SELECT>

                </td>
                <td align="center" >

                        <input type="button" name="add" value="Add       >>" onClick="SelectMoveRows(document.projectBuild.selectList,document.projectBuild.userSelections)">
                            <br>
                        <input type="button" name="remove" value="<< Remove" onClick="SelectMoveRows(document.projectBuild.userSelections,document.projectBuild.selectList)">

                </td>
                <td allign="center">
                    <SELECT NAME="userSelections" style="width: 100%" MULTIPLE>
                    <!--<SELECT NAME="userSelections" MULTIPLE>-->
                        <!-- <OPTION VALUE="placeholder">placeholder</option> -->
                    </SELECT>
                </td>

            </tr>

            <tr>
                <td>
                </td>
                <td align="center"> 
                    <input type="submit" value="Submit">
                </td>

</table>
</body>
</html>

.cgi:

#!/usr/bin/python
import cgi, os, sys, commands

myForm = cgi.FieldStorage()
pickedAcc = myForm.getvalue("userSelections")
leftAcc = myForm.getvalue("selectList")
print pickedAcc

print "Left Accelorator list: "
print leftAcc

Before submitting the form, loop through all the options in the userSelections select and set the selected attribute of each option to true . Modify your form as follows

<form name="projectBuild"
  onSubmit="selectAll(document.projectBuild.userSelections)"
  action="../cgi-bin/pythonTest.cgi"
  enctype="multipart/form-data"
  method="POST">

In the selectAll method, you loop through all the options and set the selected attribute to true.

Execute a JavaScript when a form is submitted
Javascript loop through ALL HTML select (See the 2nd answer)

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM