Inside Technique : Reordering Items in a Listbox : All the Code

Client Script

<SCRIPT>
//Copyright 2000 InsideDHTML.com, LLC. All rights reserved.

function outputList(ar, name, size) {
 var strIDs = "<SELECT SIZE=\"" + size + "\" NAME=\"ro_lst" + name + "\">"
 var sel = " SELECTED"
 for (var i=0;i<ar.length;i++) {
  strIDs += "<OPTION " + sel + " VALUE=\"" + ar[i][0] + "\">" + ar[i][1]
  sel = ""
 }
 strIDs+="</SELECT>"
 strIDs+="<INPUT NAME=\"" + name + "\" TYPE=hidden>"
 return strIDs
}

function outputButton(bDir,name,val) {
 return "<INPUT TYPE=button VALUE=\"" + val + "\" ONCLICK=\"move(this.form," + bDir + ",'" + name + "')\">"
}

function move(f,bDir,sName) {
 var el = f.elements["ro_lst" + sName]
 var idx = el.selectedIndex
 if (idx==-1) 
  alert("You must first select the item to reorder.")
 else {
  var nxidx = idx+( bDir? -1 : 1)
  if (nxidx<0) nxidx=el.length-1
  if (nxidx>=el.length) nxidx=0
  var oldVal = el[idx].value
  var oldText = el[idx].text
  el[idx].value = el[nxidx].value
  el[idx].text = el[nxidx].text
  el[nxidx].value = oldVal
  el[nxidx].text = oldText
  el.selectedIndex = nxidx
 }
}

function processForm(f) {
 for (var i=0;i<f.length;i++) {	
  var el = f[i]
  if (el.name.substring(0,6)=="ro_lst") {
   var strIDs = ""
   for (var j=0;j<f[i].options.length;j++)
     strIDs += f[i].options[j].value + ", "
   f.elements[f.elements[i].name.substring(6)].value = strIDs.substring(0,strIDs.length-2)
  }
 }
}
</SCRIPT>
<FORM METHOD=post ONSUBMIT="processForm(this)">
<SCRIPT>
  var arrList = new Array()
  arrList[0] = new Array("1","Test Item 1")
  arrList[1] = new Array("2","Test Item 2")
  arrList[2] = new Array("3","Test Item 3")
  arrList[3] = new Array("4","Test Item 4")
  arrList[4] = new Array("5","Test Item 5")
  arrList[5] = new Array("6","Test Item 6")

  document.write(outputButton(true,"test","Move Up") + "<BR>")
  document.write(outputList(arrList,"test",10) + "<BR>")
  document.write(outputButton(false,"test","Move Down"))
</SCRIPT>
<BR>
<INPUT TYPE=submit VALUE="Submit New Order">
</FORM>

Server Script

Dim arItems,i, strIDs

strIDs  = request.form("test")

if strIDs="" then
 ' Process new order
 arItems = split(strIDs,", ") 
 for i=0 to ubound(arItems)
   ' process each item
 next
end if

© 1997-2000 InsideDHTML.com, LLC. All rights reserved.