Home/ Questions/Q 611619
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-13T17:48:14+00:00

I have this school assignment that I’ve been working on and am totally stumped

  • 0

I have this school assignment that I’ve been working on and am totally stumped as to why it’s doing what it’s doing. Basically it’s a left selection list, 2 middle buttons, and a right selection list. The purpose is to move options between lists. My problem is as follows: a selection is made on left list, the move to right list button is clicked, an option is added to the right list named “undefined” and the selection on the left list disappears. I don’t want anyone to do my homework for me, but tips and hints are greatly appreciated.

Here’s my code:

<script type="text/javascript">
/* <![CDATA[ */
function moveRight() {
    var leftCurText = document.forms[0].leftSide.selectedIndex.text;
    var leftCurValue = document.forms[0].leftSide.selectedIndex.value;
    var leftCurName = document.forms[0].leftSide.selectedIndex;

    if (leftCurName != -1) {        
        var listName = new Option();
        listName.text = leftCurText;
        listName.value = leftCurValue;
        nextItem = document.forms[0].rightSide.length;
        document.forms[0].rightSide.options[nextItem] = listName;
        document.forms[0].leftSide.options[leftCurName] = null;
    } else if (document.forms[0].leftSide.length <= 0) {
        window.alert("There are no more options in the left list")
    }
    else
        window.alert("No option is selected on the left side");
}

function moveLeft() {
    var rightCurText = document.forms[0].rightSide.selectedIndex.text;
    var rightCurValue = document.forms[0].rightSide.selectedIndex.value;
    var rightCurName = document.forms[0].rightSide.selectedIndex;

    if (rightCurName != -1) {
        var listName = new Option();
        listName.text = rightCurText;
        listName.value = rightCurValue;
        nextItem = document.forms[0].leftSide.length;
        document.forms[0].leftSide.options[nextItem] = listName; 
        document.forms[0].rightSide.options[rightCurName] = null;
    } else if (document.forms[0].rightSide.length <= 0) {
        alert("There are no more options on the right list")
    } else   
        window.alert("No option is selected on the right side");
}
/* ]]>*/
</script>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<link rel="Stylesheet" type="text/css" />
</head>
<body>
<h2>This page will switch items between lists</h2>

<div align="center">
    <form action="">
        <table border="3">
            <tr>
                <th>Left List</th>
                <th>Click</th>
                <th>Right List</th>
            </tr>
            <tr>
                <td>
                    <select name="leftSide" size="6">
                        <option value="stephanie">Stephanie</option>
                        <option value="beatriz">Beatriz</option>
                        <option value="carol">Carol</option>
                    </select>
                </td>
                <td>
                    <input type="button" onclick="moveLeft()" name="leftButton" value="<<" /> <br />
                    <input type="button" onclick="moveRight()" name="rightButton" value=">>" />
                </td>
                <td>
                    <select name="rightSide" size="6">
                        <option value="evan">Evan</option>
                        <option value="david">David</option> 
                        <option value="mark">Mark</option>
                    </select>
                </td>
            </tr>
        </table>
    </form>
</div>
</body>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You are trying to get properties from the selectedIndex property of the list, which is a number. You want to get it from theList.options[theList.selectedIndex].

    EDIT:
    Also, your variables are named rather confusingly. Try this:

    var list = document.forms[0].rightSide;
var index = list.selectedIndex;
var text = list.options[index].text;
var value = list.options[index].value;

    And one of the most striking things: your two functions are basically the same. Give the source list and target list as parameters to a general move() function.

    • 0