Question

Hi I’m trying to learn javascript and I’m messing around with this example I found:

function moveOptionUp(obj) {
if (!hasOptions(obj)) { return; }
    for (i = 0; i < obj.options.length; i++) {
       if (obj.options[i].selected) {
       if (i != 0 && !obj.options[i - 1].selected) {
           swapOptions(obj, i, i - 1);
           obj.options[i - 1].selected = true;
        }
     }
   }
}

I have a list box

<input type="button" value="Up" onclick="moveOptionUp(this.form['_lb2'])" />
<asp:ListBox ID="_lb2" name="_lb2" runat="server" Height="400px" Width="170px"/>

However I can’t get it to work … The example uses a html select box. I think the problem is with passing in the control as a parameter. What is the correct way to do this using asp controls.

Ohh BTW .. List box items are added dynamically

Answer 1

To move an option up one, insert it as the previous sibling of the previous option (provided it isn’t the top one already):

function moveUp(sel) {
  var idx = sel.selectedIndex;
  var opt;

  // Only move up if not first
  if (idx > 0) {
    opt = sel.options[idx];
    sel.insertBefore(opt, sel.options[--idx]);
  }
}

Changed the test to check that idx > 0 since if no option is selected the selectedIndex will be -1. That may happen if there is no defalut selected option and the form is reset.

Edit

Sample HTML:

<form action="">
  <select id="_lb2" name="_lb2">
    <option>0
    <option>1
    <option>2
    <option>3
  </select>
  <input type="button" value="Move Up" onclick="
    moveUp(this.form['_lb2']);
  ">
</form>