Celebrate National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

Using insertBefore to move rows around in a dynamically created table

Posted on 2008-10-01
6
Medium Priority
?
826 Views
Last Modified: 2012-06-21
I have an app that dynamically creates rows in a table. On each line, it adds a pair of buttons which allow the user to move rows up and down:

// next cell
var nextCell = row.insertCell(2);
nextCell.setAttribute('align', 'center');    
var imgButton = document.createElement('<img src="images\\uparrow.gif" />');
imgButton.setAttribute('alt','Move row up');
imgButton.setAttribute('name','moverowup'+rowNum);
imgButton.setAttribute('height',16);
imgButton.setAttribute('width',16);
imgButton.onclick = function(){moveRow(this.parentNode,'Up');};
nextCell.appendChild(imgButton);

// next cell
var nextCell = row.insertCell(3);
nextCell.setAttribute('align', 'center');    
var imgButton = document.createElement('<img src="images\\downarrow.gif" />');
imgButton.setAttribute('alt','Move row down');
imgButton.setAttribute('name','moverowdown'+rowNum);
imgButton.setAttribute('height',16);
imgButton.setAttribute('width',16);
imgButton.onclick = function(){moveRow(this.parentNode,'Down');};
nextCell.appendChild(imgButton);

The moveRow function is as follows:

function moveRow(src,direction)
{
    var tb = document.getElementById('tblCells').firstChild;
    var tr = tb.getElementsByTagName('tr');
    var clickedRow = src.parentNode;
    var currentRow = null;
   
    for( var i=0; i < tr.length; ++i )
    {
        currentRow = tr[i];
        if( clickedRow === currentRow )
        {      
            switch( direction.toLowerCase() )
            {
                case "up":
                    if( i > 0 )
                    {
                        var newNode = clickedRow.cloneNode(true);
                        tb.insertBefore(newNode,clickedRow.previousSibling);
                        clickedRow.removeNode(true);
                    }
                    break;

                case "down":
                    if( i < (tr.length-1) )
                    {
                        var newNode = clickedRow.cloneNode(true);
                        tb.insertBefore(newNode,clickedRow.nextSibling.nextSibling);
                        clickedRow.removeNode(true);
                    }
                    break;
            }
            break;
        }
    }
}

This code works properly but fails in two ways:

1) Once either button on a row has been clicked on, it never works again. For example, if the user clicks on the up button of row 3, the row moves up to row 2, but subsequent clicks on either the up or down button in that row (now row 2) do not fire the script

2) Once the user has the rows in the order they want, they click on a button that runs this function, which loops through the table and appends to a variable called cells

function makeString() {
      var cells;
      var tbl = document.getElementById('tblCells');

      //now working with full table length:?
      for (var i=1; i<=tbl.rows.length; i++) {
            cells += document.getElementById('txtRow' + i).value +"|";
      }
      
      alert(cells);
}

When you look at cells, it contains the unordered values ...

I appeal to the gurus to help me with these 2 problems!

Thanks in advance,
Timbo
0
Comment
Question by:TimboALogo99
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 2
6 Comments
 
LVL 14

Expert Comment

by:ziffgone
ID: 22624548
Could you give the full HTML and Javascript for the page?
0
 

Author Comment

by:TimboALogo99
ID: 22624649
If this'll help (but I bet it makes things more complicated). I won't include the overlib js, but all code works:

<%@ Register TagPrefix="uc1" TagName="PageHeaderUi" Src="PageHeaderUi.ascx" %>
<%@ Page language="c#" Codebehind="DivTest.aspx.cs" AutoEventWireup="false" Inherits="WebGUI.DivTest" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
      <HEAD>
            <title></title>
            <META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">
            <META HTTP-EQUIV="Pragma" CONTENT="no-cache">
            <META HTTP-EQUIV="EXPIRES" CONTENT="Mon, 22 Jul 2002 11:12:01 GMT">
            <META HTTP-EQUIV="Expires" CONTENT="-1">
            <script type="text/javascript" src="overlib\overlibmws.js"></script>
            <script type="text/javascript" src="overlib\overlibmws_hide.js"></script>
            <script language="javascript">
            
//bump the session every ten minutes
var int = self.setInterval("doKeepAlive()",600000);
var newQuery = true;
var queryName = '';
var queryId = 0;

function doKeepAlive( )
{
      var stamp = new Date().getTime();
      http.open('post', 'Handler.aspx?action=bump&ms='+stamp);
      http.onreadystatechange = handleKeepAliveResponse;
      http.send(null);
}
function handleKeepAliveResponse() {
      //no need to do anything
}

function createRequestObject() {
    var ro;
    var browser = navigator.appName;
    if(browser == "Microsoft Internet Explorer"){
        ro = new ActiveXObject("Microsoft.XMLHTTP");
    }else{
        ro = new XMLHttpRequest();
    }
    return ro;
}

var http = createRequestObject();

function sndReq(action) {
    http.open('get', 'Handler.aspx?action='+action);
    http.onreadystatechange = handleResponse;
    http.send(null);
}
function showhide(layer_ref,state)
{
      if (document.all) { //IS IE 4 or 5 (or 6 beta)
            eval( "document.all." + layer_ref + ".style.visibility = state");
      }
      if (document.layers) { //IS NETSCAPE 4 or below
            document.layers[layer_ref].visibility = state;
      }
      if (document.getElementById && !document.all) {
            divToChange = document.getElementById(layer_ref);
            divToChange.style.visibility = state;
      }
}

function getSections(yearId,cycleId) {
      if(yearId == '' || cycleId == '')
      {
            alert('<%=base.YearCycleMsg%>');
      }
      else
      {            
            //sectionMsg.innerHTML="<table><tr><td class=redFont align=center height=38 width=120 bgcolor=#ffffff><%=base.WaitMsg%></td></tr></table>";
            document.Form1.lstCells.options[0] = null;
            var stamp = new Date().getTime();
            http.open('get', 'Handler.aspx?action=goo1&Year='+yearId+'&Cycle='+cycleId+'&SessionId='+document.Form1.txtGUID.value+'&ms='+stamp);
            http.onreadystatechange = handleGetSectionsResponse;
            http.send(null);
    }
}

function handleGetSectionsResponse() {
    if(http.readyState == 4) {
        var response = http.responseText;
        var pairs = new Array();
        var idtext = new Array();
        var resp;
       
        //sectionMsg.innerHTML="<table><tr><td class=redFont align=center height=38 width=120 bgcolor=#ffffff></td></tr></table>";
            if(response == '')
                  alert('No data was returned ...');
                  
            resp = response.indexOf('** ');
            if(resp != -1)
            {
                  document.Form1.lstSections.options.length = 0;
                  alert(http.responseText);
            }
            
            resp = response.indexOf('|');
        if(resp != -1)
        {
                  var sel = document.Form1.lstSections;
                  sel.options.length = 0;
                  // the | divides the pairs
                  pairs = response.split('|');
                  // the : divides the id and text
                  for (var i = 0; i < pairs.length; i++)
                  {
                        idtext = pairs[i].split(':');
                        var opt = new Option(idtext[1], idtext[0]);
                        sel.options[sel.options.length] = opt;
                  }
                  //this hides the first section
                  //sel.options[0] = null;
        }
    }
}
function checkShowBoardList(val)
{
      //clear the selected boards if the chose All
      if(document.Form1.lstBoard.options[0].selected == true)
      {
            document.getElementById("lstBoardList").selectedIndex = -1
      }
      if(val == 1)
      {
            showhide('divBoardList','visible');
      }
      else
      {
            showhide('divBoardList','hidden');
      }
}
function checkShowQueryList(val)
{
      if(val == 1)
      {
            showhide('divQueryList','visible');
      }
      else
      {
            showhide('divQueryList','hidden');
      }
}
function showhide(layer_ref,state)
{
      //if (state == 'visible')
      //{
      //      state = 'hidden';
      //}
      //else
      //{
      //      state = 'visible';
      //}
      if (document.all) { //IS IE 4 or 5 (or 6 beta)
            eval( "document.all." + layer_ref + ".style.visibility = state");
      }
      if (document.layers) { //IS NETSCAPE 4 or below
            document.layers[layer_ref].visibility = state;
      }
      if (document.getElementById && !document.all) {
            divToChange = document.getElementById(layer_ref);
            divToChange.style.visibility = state;
      }
}
function getCells(yearId,cycleId,sectionId) {
      if(yearId == -1 || cycleId == -1 || sectionId == -1)
      {
            alert('<%=base.SectionMsg%>');
      }
      else
      {
            //var boards = getSelectedIndices(document.Form1.lstBoard);
            //cellsMsg.innerHTML="<table><tr><td class=redFont align=center height=38 width=120 bgcolor=#ffffff><%=base.WaitMsg%></td></tr></table>";
            var stamp = new Date().getTime();
            http.open('get', 'Handler.aspx?action=roo1&Year='+document.Form1.lstYears.value+'&Cycle='+document.Form1.lstSource.value+'&Section='+document.Form1.lstSections.value+'&SessionId='+document.Form1.txtGUID.value+'&ms='+stamp);
            http.onreadystatechange = handleGetCellsResponse;
            http.send(null);
    }
}

function handleGetCellsResponse() {
    if(http.readyState == 4){
        var response = http.responseText;
        var pairs = new Array();
        var idtext = new Array();
        var resp;
       
        //cellsMsg.innerHTML="<table><tr><td class=redFont align=center height=38 width=120 bgcolor=#ffffff></td></tr></table>";
            resp = response.indexOf('** ');
            if(resp != -1)
            {
                  document.Form1.lstCells.options.length = 0;
                  alert(http.responseText);
            }
                  
            resp = response.indexOf('|');
        if(resp != -1)
        {
                  var sel = document.Form1.lstCells;
                  sel.options.length = 0;
                  // the | divides the pairs
                  pairs = response.split('|');
                  // the : divides the id and text
                  for (var i = 0; i < pairs.length; i++)
                  {
                        idtext = pairs[i].split(':');
                        var opt = new Option(idtext[1], idtext[0]);                        
                        sel.options[sel.options.length] = opt;
                  }
        }
    }
}

function runReport() {
      var ver = '';
      var cells = '';
      var boards = '';
      var brdGroup = '';
      var notOnlyMyBoard = 0;
      var erred = 0;
      
      //put the board id's into a string
      //boards = getSelectedValues(document.Form1.lstBoard);
      //if(boards=='-2,-1'||boards=='-2,0'||boards=='-1,0')
      //      boards = 0;
      //brdGroup = getRadioValue(this.Form1.rdoBoards);
      
      boards = getSelectedValues(document.Form1.lstBoardList);
      
      if(boards == '')
            boards = -1
            
      if(boards=='-2,-1'||boards=='-2,0'||boards=='-1,0')
      {
            boards = -1;
            //alert('Reached this alert!);
      }
      
      if(boards != document.Form1.txtBoardId.value && document.Form1.txtBoardId.value != '') {
            //the boardid chosen is not the same as user's boardid: not my board
            notOnlyMyBoard = 1;
      }
      
      if(boards == -1 && document.Form1.txtBoardId.value != '') {
            //all boards chosen and i'm a board user: not my board
            notOnlyMyBoard = 1;
      }
      
      if(boards != '') {
            //put the cells into a string
            var tbl = document.getElementById('tblCells');
          var lastRow = tbl.rows.length - 1;

            //now working with full table length:?
            for (var i=1; i<=lastRow+1; i++) {
                  ver = '';
                  if(document.getElementById('txtRow' + i))
                  {
                        ver = document.getElementById('txtRow' + i).value;
                        ver = ver.substring(15);
                  }
                  
                  //if asked for fo and not my board ...
                  if(notOnlyMyBoard == 1 && ver == "2") {
                        alert("You cannot view FO reviewed submissions belonging to other school boards ...");
                        cells = '';
                        erred = 1;
                        break;
                  }
                  else
                  {      
                        if(ver != '')
                              cells += document.getElementById('txtRow' + i).value +"|";
                  }
            }

            if(erred == 0) {
                  if(cells == '')
                        alert('<%=base.NoCellsMsg%>');
                  else
                  {
                        //popup the report window and send it the values
                        document.Form1.txtBoards.value = boards;
                        document.Form1.txtCells.value = cells;
                        window.open("ReportPopUp.aspx",'wh');

                        //old way
                        //window.open("ReportPopUp.aspx?Boards="+boards+"&Cells="+cells);
                  }
            }
      }
      else if(boards == '')
            alert('<%=base.NoBoardMsg%>');
}
            
function addRowsToTable()
{
      var tbl = document.getElementById('tblCells');
      var lastRow = tbl.rows.length;
      var bGo = true;
              
      // if there's no header row in the table, then iteration = lastRow + 1
      var iteration = lastRow;      
      var cells = getSelectedTexts(document.Form1.lstCells);
      var vals = getSelectedValues(document.Form1.lstCells);

      //this is for fo reviewed versus the other
      var ct = 0; //are there any visible radios?
      for(i=0; i<document.Form1.elements.length; i++) {
            if(document.Form1.elements[i].type=="radio") {
                  ct += 1;
            }
      }

      var ver = 1;
      var version = "APP";      
      if(ct > 0) {
          if(document.Form1.rblSubmissionType_0.checked) {
                  ver = 1;
                  version = "APP";
            }
            else {
                  ver = 2;
                  version = "REV";
            }
      }
      
      var selledYear = getSelectedTexts(document.Form1.lstYears);
      var selledCycle = getSelectedTexts(document.Form1.lstSource);
      
      //check that haven't exceeded max cell count      
      var ct = countSelects(document.Form1.lstCells);
      if(lastRow +  ct - 1 > <%=base.MaxCells%>) {
            alert('<%=base.MaxMsg%>');
            bGo = false;
      }
      
      if(bGo)
      {
            for (i = 0; i < cells.length; i++)
            {
                  var rowNum = lastRow+i;
                  var row = tbl.insertRow(lastRow+i);
                  
                  // left cell
                  var nextCell = row.insertCell(0);
                  nextCell.setAttribute('align', 'center');    
                  var imgButton = document.createElement('<img src="images\\rewind.gif" />');
                  imgButton.setAttribute('alt','Remove row #'+rowNum);
                  imgButton.setAttribute('name','row'+rowNum);
                  imgButton.setAttribute('height',16);
                  imgButton.setAttribute('width',16);
                  imgButton.onclick = function(){removeRow(this);};
                  nextCell.appendChild(imgButton);
                  
                  // next to left cell
                  var nextCell = row.insertCell(1);
                  nextCell.setAttribute('align', 'center');    
                  var imgButton = document.createElement('<img src="images\\edit.gif" />');
                  imgButton.setAttribute('alt','Edit row '+rowNum);
                  imgButton.setAttribute('name','editrow'+rowNum);
                  imgButton.setAttribute('height',16);
                  imgButton.setAttribute('width',16);
                  imgButton.onclick = function(){editRow(this);};
                  nextCell.appendChild(imgButton);
                  
                  // next cell
                  var nextCell = row.insertCell(2);
                  nextCell.setAttribute('align', 'center');    
                  var imgButton = document.createElement('<img src="images\\uparrow.gif" />');
                  imgButton.setAttribute('alt','Move row up');
                  imgButton.setAttribute('name','moverowup'+rowNum);
                  imgButton.setAttribute('height',16);
                  imgButton.setAttribute('width',16);
                  imgButton.onclick = function(){moveRow(this.parentNode,'Up');};
                  nextCell.appendChild(imgButton);
                  
                  // next cell
                  var nextCell = row.insertCell(3);
                  nextCell.setAttribute('align', 'center');    
                  var imgButton = document.createElement('<img src="images\\downarrow.gif" />');
                  imgButton.setAttribute('alt','Move row down');
                  imgButton.setAttribute('name','moverowdown'+rowNum);
                  imgButton.setAttribute('height',16);
                  imgButton.setAttribute('width',16);
                  imgButton.onclick = function(){moveRow(this.parentNode,'Down');};
                  nextCell.appendChild(imgButton);
                  
                  // right cell
                  var cellRight = row.insertCell(4);
                  //var textNode2 = document.createTextNode(cells[i]+' ('+selledYear+' '+selledCycle+' '+version+')');
                  var textNode2 = document.createTextNode(cells[i]+' ('+selledCycle+' '+version+')');
                  cellRight.appendChild(textNode2);
                  
                  var cellHidden = row.insertCell(5);
                  var el = document.createElement('hidden');
                  el.setAttribute('type', 'text');
                  
                  num = parseFloat(iteration)+parseFloat(i);
                  el.setAttribute('name', 'txtRow' + num);
                  el.setAttribute('id', 'txtRow' + num);
                  var t = cells[i];
                  var cn = t.split(' - ')[0];
            
                  var year = document.Form1.lstYears.value;
                  if(year < 10) year = '0' + year;
                  
                  var cycle = '0' + document.Form1.lstSource.value;            
                  cn = cn + year + cycle + ver;
      
                  el.setAttribute('value',cn);
                  cellHidden.appendChild(el);
            }
      }
}
function getSelectedTexts(select)
{
      var r = new Array();
      for (var i = 0; i < select.options.length; i++)
      if (select.options[i].selected)
            r[r.length] = select.options[i].text;
      return r;
}
function getSelectedValues(select)
{
      var r = new Array();
      for (var i = 0; i < select.options.length; i++)
      if (select.options[i].selected)
            r[r.length] = select.options[i].value;
      return r;
}
function countSelects(theSel) {
      var tot = 0;
      if (theSel.selectedIndex > -1)
            for (var j=0, i=theSel.selectedIndex; i<theSel.options.length;i++)
                  if (theSel.options[i].selected) tot++;
      return tot;
}
function removeRow(rowNum)
{
    var oRow = rowNum.parentElement.parentElement;  
    document.all("tblCells").deleteRow(oRow.rowIndex);  
}

function editRow(row)
{  
      var ycm;
      var yr;
      var tot = document.Form1.lstYears.options.length;
      //get the row number
      var oRow = row.parentElement.parentElement;  
    var x=document.getElementById("txtrow"+oRow.rowIndex);
    ycm = x.value;
    yr=parseFloat(ycm.substr(ycm.length-5,2));
   
    //highlight the cycle and collection
      var list = document.getElementById('lstYears');
      for (var intI = 0; intI < list.options.length; intI++) {
            if (list.options[intI].value == yr) {
                  list.options[intI].selected = true;
                  //get the appropriate cycle
                  getCycles(yr)
            }
      }
                  
}
function clearLists()
{
      document.Form1.lstCells.options.length = 0;
      document.Form1.lstSections.options.length = 0;

      var tbl = document.getElementById('tblCells');
      var lastRow = tbl.rows.length;
      for(var i=lastRow;i>1;i--)
            tbl.deleteRow(1);
}

function getCycles(yearId) {
      if(yearId == '')
            alert('<%=base.YearMsg%>');
      else
      {
            //sectionMsg.innerHTML="<table><tr><td class=redFont align=center height=38 width=120 bgcolor=#ffffff><%=base.WaitMsg%></td></tr></table>";
            //document.Form1.lstSource.options[0] = null;
            document.Form1.lstSource.options.length = 0;
            
            document.Form1.lstSections.options.length = 0;
            document.Form1.lstCells.options.length = 0;
            
            var stamp = new Date().getTime();
            http.open('get', 'Handler.aspx?action=loo1&Year='+yearId+'&SessionId='+document.Form1.txtGUID.value+'&ms='+stamp);
            http.onreadystatechange = handleGetCyclesResponse;
            http.send(null);
    }
}
function handleGetCyclesResponse() {
    if(http.readyState == 4) {
        var response = http.responseText;
        var pairs = new Array();
        var idtext = new Array();
        var resp;
       
        //sectionMsg.innerHTML="<table><tr><td class=redFont align=center height=38 width=120 bgcolor=#ffffff></td></tr></table>";
            resp = response.indexOf('** ');
            if(resp != -1)
            {
                  document.Form1.lstSections.options.length = 0;
                  alert(http.responseText);
            }
            
            resp = response.indexOf(':');
        if(resp != -1)
        {
                  //clear sections and cells
                  document.Form1.lstCells.options.length = 0;
                  document.Form1.lstSections.options.length = 0;
                  
                  var sel = document.Form1.lstSource;
                  sel.options.length = 0;
                                    
                  // the | divides the pairs
                  pairs = response.split('|');
                  // the : divides the id and text
                  var i;
                  for (i = 0; i < pairs.length; i++)
                  {
                        idtext = pairs[i].split(':');
                        var opt = new Option(idtext[1], idtext[0]);
                        sel.options[sel.options.length] = opt;
                  }
                  sel.options[pairs.length-1].selected = true;
        }
    }
}
function waitShowSelectedCells() {
      //setTimeout("return overlib(getSelectedTexts(document.Form1.lstCells), REF,'link2', REFP,'UL',WRAP)",250);
      //setTimeout("return overlib(getSelectedTexts(document.Form1.lstCells), REF,'section', REFP,'UL')",250);
      setTimeout("return overlib(getSelectedTexts(document.Form1.lstCells), AUTOSTATUS, REF,'section', REFP,'LL', REFX,235, REFY,15,WRAP)",250);
}
function selectAllCells() {
      for (var i=0;i<document.Form1.lstCells.options.length;i++) {
            document.Form1.lstCells.options[i].selected = true;
      }
}
function saveQuery() {
      var ver;
      var cells = '';
      var splitcell1 = '';
      var splitcell2 = '';
      var len=0;
      var bContinue = false;

      if(newQuery) {
            //get the name
            queryName = prompt("Please enter a query name","Maximum 100 chars");
            if(queryName == null)
                  bContinue = false;
            else if(queryName == 'Maximum 100 chars')
                  bContinue = false;
            else
                  bContinue = true;
      }
      else {            //exists already
            if(confirm("This will overwrite the query: "+queryName))
                  bContinue = true;
            else
                  bContinue = false;
      }

      if(bContinue) {
            //put the cells into a string
            var tbl = document.getElementById('tblCells');
          var lastRow = tbl.rows.length - 1;

            //now working with full table length:?
            for (var i=1; i<=lastRow; i++) {
                  ver = '';
                  splitcell1 = '';
                  splitcell2 = '';
                  len = 0;
                  if(document.getElementById('txtRow' + i))
                  {
                        ver = document.getElementById('txtRow' + i).value;
                        ver = ver.substring(15);
                  }
                  
                  if(ver != '')  {
                        //change the order
                        len = document.getElementById('txtRow' + i).value.length;
                        splitcell1 = document.getElementById('txtRow' + i).value.substring(len - 5);
                        splitcell2 = document.getElementById('txtRow' + i).value.substring(0,len - 5);
                        cells += splitcell1 + splitcell2 + '|';
                  }
            }
            
            //do the save:pass queryName and cells
            var stamp = new Date().getTime();
            http.open('get', 'Handler.aspx?action=saq1&Query='+queryName+'&Cells='+cells+'&SessionId='+document.Form1.txtGUID.value+'&ms='+stamp);
            http.onreadystatechange = handleSaveQueryResponse;
            http.send(null);
      }
      newQuery = false;
}
function handleSaveQueryResponse() {
    if(http.readyState == 4) {
            alert(http.responseText);
    }
}
function getQueryList() {
      var queryName = '';
      var stamp = new Date().getTime();
      http.open('get', 'Handler.aspx?action=fql1&SessionId='+document.Form1.txtGUID.value+'&ms='+stamp);
      http.onreadystatechange = handleGetQueryListResponse;
      http.send(null);
}
function handleGetQueryListResponse() {
    if(http.readyState == 4) {
        var response = http.responseText;
        var pairs = new Array();
        var idtext = new Array();
        var resp;
       
            if(response == '')
                  alert('No data was returned ...');
                  
            resp = response.indexOf('** ');
            if(resp != -1)
            {
                  document.Form1.lstQueryList.options.length = 0;
                  alert(http.responseText);
            }
            
            resp = response.indexOf('|');
        if(resp != -1)
        {
              //show the div
                  checkShowQueryList(1);
                  
                  var sel = document.Form1.lstQueryList;
                  sel.options.length = 0;
                  // the | divides the pairs
                  pairs = response.split('|');
                  // the : divides the id and text
                  for (var i = 0; i < pairs.length; i++)
                  {
                        idtext = pairs[i].split(':');
                        var opt = new Option(idtext[1], idtext[0]);
                        sel.options[sel.options.length] = opt;
                  }
        }
    }
}
function deleteQuery() {
      if(getSelectedValues(document.Form1.lstQueryList) == '') {
            alert('Please choose a query to delete ...');
      }
      else {
            if(confirm("This will permanently delete the existing query: "+queryName)) {
                  var stamp = new Date().getTime();
                  http.open('get', 'Handler.aspx?action=dlq1&QueryId='+queryId+'&SessionId='+document.Form1.txtGUID.value+'&ms='+stamp);
                  http.onreadystatechange = handleDeleteQueryResponse;
                  http.send(null);
            }
      }
}
function handleDeleteQueryResponse() {
    if(http.readyState == 4) {
            newQuery = false;
        var response = http.responseText;
        var resp;
       
            if(response == '')
                  alert('No data was returned ...');
            else
                  alert(http.responseText);
      }
}
function openQuery() {
      var stamp = new Date().getTime();
      http.open('get', 'Handler.aspx?action=feq1&QueryId='+queryId+'&SessionId='+document.Form1.txtGUID.value+'&ms='+stamp);
      http.onreadystatechange = handleOpenQueryResponse;
      http.send(null);

      //clear first
      clearLists();
}
function handleOpenQueryResponse() {
    if(http.readyState == 4) {
            newQuery = false;
        var response = http.responseText;
        var pairs = new Array();
        var idtext = new Array();
        var resp;
            var tbl = document.getElementById('tblCells');
            var lastRow = tbl.rows.length;
            var iteration = lastRow;      
       
            if(response == '')
                  alert('No data was returned ...');
            
            //check for error message
            resp = response.indexOf('** ');
            if(resp != -1)
            {
                  alert(http.responseText);
            }
            
            //get the cells to be split
            response = response.substring(resp + 1);
            
            resp = response.indexOf('|');
        if(resp != -1)
        {
                  // the | divides the cellnames
                  pairs = response.split('|');
                  for (var i = 0; i < pairs.length - 1; i++)
                  {
                        idtext = pairs[i].split('!');
                        
                        var rowNum = lastRow+i;
                        var row = tbl.insertRow(lastRow+i);
                        
                        // left cell
                        var nextCell = row.insertCell(0);
                        nextCell.setAttribute('align', 'center');    
                        var imgButton = document.createElement('<img src="images\\rewind.gif" />');
                        imgButton.setAttribute('alt','Remove row #'+rowNum);
                        imgButton.setAttribute('name','row'+rowNum);
                        imgButton.setAttribute('height',16);
                        imgButton.setAttribute('width',16);
                        imgButton.onclick = function(){removeRow(this);};
                        nextCell.appendChild(imgButton);
                        
                        // next to left cell
                        var nextCell = row.insertCell(1);
                        nextCell.setAttribute('align', 'center');    
                        var imgButton = document.createElement('<img src="images\\edit.gif" />');
                        imgButton.setAttribute('alt','Edit row '+rowNum);
                        imgButton.setAttribute('name','editrow'+rowNum);
                        imgButton.setAttribute('height',16);
                        imgButton.setAttribute('width',16);
                        imgButton.onclick = function(){editRow(this);};
                        nextCell.appendChild(imgButton);
                        
                        // next cell
                        var nextCell = row.insertCell(2);
                        nextCell.setAttribute('align', 'center');    
                        var imgButton = document.createElement('<img src="images\\uparrow.gif" />');
                        imgButton.setAttribute('alt','Move row up');
                        imgButton.setAttribute('name','moverowup'+rowNum);
                        imgButton.setAttribute('height',16);
                        imgButton.setAttribute('width',16);
                        imgButton.onclick = function(){moveRow(this.parentNode,'Up');};
                        nextCell.appendChild(imgButton);
                        
                        // next cell
                        var nextCell = row.insertCell(3);
                        nextCell.setAttribute('align', 'center');    
                        var imgButton = document.createElement('<img src="images\\downarrow.gif" />');
                        imgButton.setAttribute('alt','Move row down');
                        imgButton.setAttribute('name','moverowdown'+rowNum);
                        imgButton.setAttribute('height',16);
                        imgButton.setAttribute('width',16);
                        imgButton.onclick = function(){moveRow(this.parentNode,'Down');};
                        nextCell.appendChild(imgButton);
                        
                        // right cell
                        var cellRight = row.insertCell(4);
                        var textNode2 = document.createTextNode(idtext[1]);
                        cellRight.appendChild(textNode2);
                        
                        var cellHidden = row.insertCell(5);
                        var el = document.createElement('hidden');
                        el.setAttribute('type', 'text');
                        
                        num = parseFloat(iteration)+parseFloat(i);
                        el.setAttribute('name', 'txtRow' + num);
                        el.setAttribute('id', 'txtRow' + num);
                        el.setAttribute('value',idtext[0]);
                        cellHidden.appendChild(el);
                  }
        }
    }
}
function makeNewQuery() {
      newQuery = true;
      queryName = '';
      clearLists();
}
function moveRow(src,direction)
{
    var tb = document.getElementById('tblCells').firstChild;
    var tr = tb.getElementsByTagName('tr');
    var clickedRow = src.parentNode;
    var currentRow = null;
   
    for( var i=0; i < tr.length; ++i )
    {
        currentRow = tr[i];
        if( clickedRow === currentRow )
        {      
            switch( direction.toLowerCase() )
            {
                case "up":
                    if( i > 0 )
                    {
                        var newNode = clickedRow.cloneNode(true);
                        tb.insertBefore(newNode,clickedRow.previousSibling);
                        clickedRow.removeNode(true);
                    }
                    break;

                case "down":
                    if( i < (tr.length-1) )
                    {
                        var newNode = clickedRow.cloneNode(true);
                        tb.insertBefore(newNode,clickedRow.nextSibling.nextSibling);
                        clickedRow.removeNode(true);
                    }
                    break;
            }
            break;
        }
    }
}
            </script>
      </HEAD>
      <BODY onload="javascript:if(document.Form1.txtUserGrp.value=='2'){showhide('divSubmissionType','hidden')};document.Form1.lstBoard.selectedIndex=0;getCycles(document.Form1.lstYears.value);">
            <LINK href="cw.css" rel="stylesheet">
                  <style type="text/css">BODY { FONT-SIZE: 8pt; FONT-FAMILY: Verdana, Tahoma }
      #divHeader { BACKGROUND: #fcf3d6; LEFT: 20px; WIDTH: 808px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 80px; HEIGHT: 50px }
      #divSubmissionType { BACKGROUND: #3398ff; LEFT: 620px; WIDTH: 158px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 85px; HEIGHT: 35px }
      #divLYear { BACKGROUND: #3398ff; LEFT: 20px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 75px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 131px; HEIGHT: 25px }
      #divLBoard { BACKGROUND: #3398ff; LEFT: 96px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 75px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 131px; HEIGHT: 25px }
      #divLSource { BACKGROUND: #3398ff; LEFT: 172px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 100px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 131px; HEIGHT: 25px }
      #divLFill1 { BACKGROUND: #3398ff; LEFT: 273px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 39px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 131px; HEIGHT: 25px }
      #divLSection { BACKGROUND: #3398ff; LEFT: 313px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 150px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 131px; HEIGHT: 25px }
      #divLCells { BACKGROUND: #3398ff; LEFT: 464px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 325px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 131px; HEIGHT: 25px }
      #divLFill2 { BORDER-RIGHT: #8a6500 1px solid; BACKGROUND: #3398ff; LEFT: 789px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 40px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 131px; HEIGHT: 25px }
      #divYear { BACKGROUND: #b2ccff; LEFT: 20px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 75px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 157px; HEIGHT: 117px }
      #divBoard { BACKGROUND: #b2ccff; LEFT: 96px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 75px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 157px; HEIGHT: 117px }
      #divSource { BACKGROUND: #b2ccff; LEFT: 172px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 100px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 157px; HEIGHT: 117px }
      #divFill1 { BACKGROUND: #b2ccff; LEFT: 273px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 39px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 157px; HEIGHT: 117px }
      #divSection { BACKGROUND: #b2ccff; LEFT: 313px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 150px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 157px; HEIGHT: 117px }
      #divCells { BORDER-RIGHT: #d38332 1px solid; BACKGROUND: #b2ccff; LEFT: 464px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 326px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 157px; HEIGHT: 117px }
      #divFill2 { BORDER-RIGHT: #8a6500 1px solid; BACKGROUND: #b2ccff; LEFT: 790px; WIDTH: 39px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 157px; HEIGHT: 117px }
      #divFooter { BACKGROUND: #fcf3d6; LEFT: 20px; WIDTH: 808px; POSITION: absolute; TOP: 277px; HEIGHT: 25px }
      #divReportCells { BORDER-RIGHT: #cccccc 2px solid; BACKGROUND: #fcf3d6; LEFT: 20px; OVERFLOW: auto; WIDTH: 708px; BORDER-BOTTOM: #cccccc 2px solid; POSITION: absolute; TOP: 300px; HEIGHT: 280px }
      #divReportMenu { BORDER-RIGHT: #cccccc 2px solid; BACKGROUND: #b2ccff; LEFT: 748px; WIDTH: 80px; BORDER-BOTTOM: #cccccc 2px solid; POSITION: absolute; TOP: 300px; HEIGHT: 280px }
      #divLBoardList { BACKGROUND: #3398ff; LEFT: 300px; VISIBILITY: hidden; BORDER-LEFT: #8a6500 1px solid; WIDTH: 175px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 280px; HEIGHT: 25px }
      #divBoardList { BORDER-RIGHT: #88deff 2px solid; PADDING-RIGHT: 2px; PADDING-LEFT: 2px; Z-INDEX: 12; BACKGROUND: #3398ff; LEFT: 300px; VISIBILITY: hidden; WIDTH: 275px; BORDER-BOTTOM: #88deff 2px solid; POSITION: absolute; TOP: 280px; HEIGHT: 218px }
      #divQueryList { BORDER-RIGHT: #88deff 2px solid; PADDING-RIGHT: 2px; PADDING-LEFT: 2px; Z-INDEX: 12; BACKGROUND: #3398ff; LEFT: 225px; VISIBILITY: hidden; WIDTH: 425px; BORDER-BOTTOM: #88deff 2px solid; POSITION: absolute; TOP: 280px; HEIGHT: 218px }
      </style>
                  <div id="overDiv" style="Z-INDEX:1000; VISIBILITY:hidden; POSITION:absolute"></div>
                  <form id="Form1" method="post" runat="server">
                        <div id="divHeader">
                              <A href="javascript:makeNewQuery();"><IMG height="30" alt="" src="images\edit.gif" border="0" width="30"><%=base.New%></A>
                              <A href="javascript:getQueryList();"><IMG height="30" alt="" src="images\open.gif" border="0" width="30"><%=base.Open%></A>
                              <A href="javascript:saveQuery();"><IMG height="30" alt="" src="images\save.gif" border="0" width="30"><%=base.Save%></A>
                              <INPUT id="txtBoardId" type="hidden" size="1" runat="server" NAME="txtBoardId"> <INPUT id="txtGUID" type="hidden" size="1" runat="server" NAME="txtGUID">
                              <INPUT id="txtUserGrp" type="hidden" size="1" runat="server" NAME="txtUserGrp"> <IMG id="section" name="section" alt="" src="images\spacer.gif" border="0">&nbsp;
                              <INPUT id="txtBoards" type="hidden" size="1" name="txtBoards" runat="server"><INPUT id="txtCells" type="hidden" size="1" name="txtCells" runat="server">
                        </div>
                        <div id="divSubmissionType"><asp:radiobuttonlist id="rblSubmissionType" runat="server" Width="159px" CssClass="divFont"></asp:radiobuttonlist></div>
                        <div id="divLYear" align="center"><%=base.SchoolYear%></div>
                        <div id="divLBoard" align="center"><%=base.Boards%></div>
                        <div id="divLSource" align="center">Source</div>
                        <div id="divLFill1" align="center"></div>
                        <div id="divLSection" align="center">Section</div>
                        <div id="divLCells" align="center"><%=base.CellName%>&nbsp;<A href="javascript:selectAllCells();">Select
                                    All</A></div>
                        <div id="divLFill2" align="center"></div>
                        <div id="divYear" align="center"><asp:listbox id="lstYears" runat="server" Width="72px" CssClass="divFont" Height="112px"></asp:listbox></div>
                        <div id="divBoard" align="center">
                              <asp:listbox id="lstBoard" runat="server" Width="72px" CssClass="divFont" Height="42px"></asp:listbox></div>
                        <div id="divSource" align="center">
                              <asp:listbox id="lstSource" runat="server" Width="96px" CssClass="divFont" Height="112px"></asp:listbox>
                        </div>
                        <div id="divFill1" align="center"><br>
                              <br>
                              <A href="javascript:void(0)"><IMG onclick="javascript:getSections(document.Form1.lstYears.value,document.Form1.lstSource.value);"
                                          alt="" src="images\fast-forward.gif" border="0"><br>
                              </A>
                              <%=base.FillList%>
                        </div>
                        <div id="divSection" align="center">
                              <asp:listbox id="lstSections" runat="server" Width="144px" CssClass="divFont" Height="112px"></asp:listbox>
                        </div>
                        <div id="divCells" align="center">
                              <asp:listbox id="lstCells" runat="server" Width="320px" CssClass="divFont" Height="112px" SelectionMode="Multiple"></asp:listbox>
                        </div>
                        <div id="divFill2" align="center"><br>
                              <br>
                              <A href="javascript:addRowsToTable();"><IMG alt="" src="images\download.gif" border="0"><br>
                                    <%=base.AddCells%>
                              </A>
                        </div>
                        <!--<div id="divFooter">Footer</div>-->
                        <!--<div id="divLBoardList" align="center">-->
                        <!--<asp:Label id="lblBoardList" runat="server">-->
                        <!--</asp:Label>-->
                        <DIV></DIV>
                        <div id="divBoardList" align="center">
                              <%=base.Boards%>
                              <br>
                              <asp:listbox id="lstBoardList" runat="server" Width="204px" CssClass="divFont" Height="176px"
                                    SelectionMode="Multiple" Rows="12"></asp:listbox><br>
                              <INPUT onclick="javascript:showhide('divBoardList','hidden');" type="button" value="OK">
                        </div>
                        <div id="divQueryList" align="center">
                              <%=base.QueryList%>
                              <br>
                              <asp:listbox id="lstQueryList" runat="server" Width="354px" CssClass="divFont" Height="176px"
                                    SelectionMode="Single" Rows="12"></asp:listbox><br>
                              <INPUT onclick="javascript:queryId=getSelectedValues(document.Form1.lstQueryList);queryName=getSelectedTexts(document.Form1.lstQueryList);showhide('divQueryList','hidden');openQuery();"
                                    type="button" value="OK">&nbsp; <INPUT onclick="javascript:showhide('divQueryList','hidden');" type="button" value="Cancel">&nbsp;
                              <INPUT onclick="javascript:queryId=getSelectedValues(document.Form1.lstQueryList);queryName=getSelectedTexts(document.Form1.lstQueryList);showhide('divQueryList','hidden');deleteQuery();"
                                    type="button" value="Delete">
                        </div>
                        <div id="divReportMenu" align="center">
                              <A href="javascript:void(0)"><IMG onclick="javascript:runReport();" alt="" src="images\play.gif" border="0"><br>
                              </A>
                              <%=base.RunReport%>
                              <br>
                              <br>
                              <IMG alt="" src="images\help.gif"><br>
                              <%=base.Help%>
                              <br>
                              <br>
                              <A href="javascript:void(0)"><IMG onclick="javascript:clearLists();" alt="" src="images\delete.gif" border="0"><br>
                              </A>
                              <%=base.ResetReport%>
                              <br>
                              <br>
                        </div>
                        <div id="divReportCells" ms_positioning="FlowLayout">
                              <TABLE height="100" cellSpacing="0" cellPadding="0" width="100" border="0" ms_1d_layout="TRUE">
                                    <TR>
                                          <TD>
                                                <TABLE id="tblSelledCells" height="46" cellSpacing="1" cellPadding="1" width="700" border="0">
                                                      <TR>
                                                            <TD>
                                                                  <TABLE class="divStep" id="tblCells" height="24" cellSpacing="1" cellPadding="1" width="675"
                                                                        align="center" border="0" valign="top">
                                                                        <TR>
                                                                              <th colSpan="5">
                                                                                    <%=base.SelectedCells%>
                                                                              </th>
                                                                        </TR>
                                                                  </TABLE>
                                                            </TD>
                                                      </TR>
                                                </TABLE>
                                          </TD>
                                    </TR>
                              </TABLE>
                        </div>
                        <uc1:pageheaderui id="PageHeaderUi1" runat="server"></uc1:pageheaderui>
                  </form>
                  <IFRAME id="Defib" src="/Defib.aspx" frameBorder="no" width="0" height="0" runat="server"></IFRAME>
      </BODY>
</HTML>
0
 
LVL 14

Expert Comment

by:ziffgone
ID: 22625651
lol, no I guess that didn't help much.

Rather, instead of giving us your full ASP source code, view the page in your browser and then select "view source" and give us that. This way we'll get the generated source.  Better yet, if you have the page online, can you give a link to it?

P.S. - Use the "Attach Code Snippet" for future code postings.

Regards...
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 

Accepted Solution

by:
TimboALogo99 earned 0 total points
ID: 22626037
Sorry 'bout that, but the "view source" looks much the same. And, no, it's on an internal dev server at this point.


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
	<HEAD>
		<title></title>
		<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">
		<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
		<META HTTP-EQUIV="EXPIRES" CONTENT="Mon, 22 Jul 2002 11:12:01 GMT">
		<META HTTP-EQUIV="Expires" CONTENT="-1">
		<script type="text/javascript" src="overlib\overlibmws.js"></script>
		<script type="text/javascript" src="overlib\overlibmws_hide.js"></script>
		<script language="javascript">
		
//bump the session every ten minutes
var int = self.setInterval("doKeepAlive()",600000);
var newQuery = true;
var queryName = '';
var queryId = 0;
 
function doKeepAlive( )
{
	var stamp = new Date().getTime();
	http.open('post', 'Handler.aspx?action=bump&ms='+stamp);
	http.onreadystatechange = handleKeepAliveResponse;
	http.send(null);
}
function handleKeepAliveResponse() {
	//no need to do anything
}
 
function createRequestObject() {
    var ro;
    var browser = navigator.appName;
    if(browser == "Microsoft Internet Explorer"){
        ro = new ActiveXObject("Microsoft.XMLHTTP");
    }else{
        ro = new XMLHttpRequest();
    }
    return ro;
}
 
var http = createRequestObject();
 
function sndReq(action) {
    http.open('get', 'Handler.aspx?action='+action);
    http.onreadystatechange = handleResponse;
    http.send(null);
}
function showhide(layer_ref,state) 
{
	if (document.all) { //IS IE 4 or 5 (or 6 beta)
		eval( "document.all." + layer_ref + ".style.visibility = state");
	}
	if (document.layers) { //IS NETSCAPE 4 or below
		document.layers[layer_ref].visibility = state;
	}
	if (document.getElementById && !document.all) {
		divToChange = document.getElementById(layer_ref);
		divToChange.style.visibility = state;
	}
}
 
function getSections(yearId,cycleId) {
	if(yearId == '' || cycleId == '')
	{
		alert('Please choose a year and cycle ...');
	}
	else
	{		
		//sectionMsg.innerHTML="<table><tr><td class=redFont align=center height=38 width=120 bgcolor=#ffffff>Please wait ...</td></tr></table>";
		document.Form1.lstCells.options[0] = null;
		var stamp = new Date().getTime();
		http.open('get', 'Handler.aspx?action=goo1&Year='+yearId+'&Cycle='+cycleId+'&SessionId='+document.Form1.txtGUID.value+'&ms='+stamp);
		http.onreadystatechange = handleGetSectionsResponse;
		http.send(null);
    }
}
 
function handleGetSectionsResponse() {
    if(http.readyState == 4) {
        var response = http.responseText;
        var pairs = new Array();
        var idtext = new Array();
        var resp;
        
        //sectionMsg.innerHTML="<table><tr><td class=redFont align=center height=38 width=120 bgcolor=#ffffff></td></tr></table>";
		if(response == '')
			alert('No data was returned ...');
			
		resp = response.indexOf('** ');
		if(resp != -1)
		{
			document.Form1.lstSections.options.length = 0;
			alert(http.responseText);
		}
		
		resp = response.indexOf('|');
        if(resp != -1)
        {
			var sel = document.Form1.lstSections;
			sel.options.length = 0;
			// the | divides the pairs
			pairs = response.split('|');
			// the : divides the id and text
			for (var i = 0; i < pairs.length; i++)
			{
				idtext = pairs[i].split(':');
				var opt = new Option(idtext[1], idtext[0]);
				sel.options[sel.options.length] = opt;
			}
			//this hides the first section
			//sel.options[0] = null;
        }
    }
}
function checkShowBoardList(val)
{
	//clear the selected boards if the chose All
	if(document.Form1.lstBoard.options[0].selected == true)
	{
		document.getElementById("lstBoardList").selectedIndex = -1
	}
	if(val == 1)
	{
		showhide('divBoardList','visible');
	}
	else
	{
		showhide('divBoardList','hidden');
	}
}
function checkShowQueryList(val)
{
	if(val == 1)
	{
		showhide('divQueryList','visible');
	}
	else
	{
		showhide('divQueryList','hidden');
	}
}
function showhide(layer_ref,state) 
{
	//if (state == 'visible') 
	//{
	//	state = 'hidden';
	//}
	//else 
	//{
	//	state = 'visible';
	//}
	if (document.all) { //IS IE 4 or 5 (or 6 beta)
		eval( "document.all." + layer_ref + ".style.visibility = state");
	}
	if (document.layers) { //IS NETSCAPE 4 or below
		document.layers[layer_ref].visibility = state;
	}
	if (document.getElementById && !document.all) {
		divToChange = document.getElementById(layer_ref);
		divToChange.style.visibility = state;
	}
}
function getCells(yearId,cycleId,sectionId) {
	if(yearId == -1 || cycleId == -1 || sectionId == -1)
	{
		alert('Please choose a year, cycle and section ...');
	}
	else
	{
		//var boards = getSelectedIndices(document.Form1.lstBoard);
		//cellsMsg.innerHTML="<table><tr><td class=redFont align=center height=38 width=120 bgcolor=#ffffff>Please wait ...</td></tr></table>";
		var stamp = new Date().getTime();
		http.open('get', 'Handler.aspx?action=roo1&Year='+document.Form1.lstYears.value+'&Cycle='+document.Form1.lstSource.value+'&Section='+document.Form1.lstSections.value+'&SessionId='+document.Form1.txtGUID.value+'&ms='+stamp);
		http.onreadystatechange = handleGetCellsResponse;
		http.send(null);
    }
}
 
function handleGetCellsResponse() {
    if(http.readyState == 4){
        var response = http.responseText;
        var pairs = new Array();
        var idtext = new Array();
        var resp;
        
        //cellsMsg.innerHTML="<table><tr><td class=redFont align=center height=38 width=120 bgcolor=#ffffff></td></tr></table>";
		resp = response.indexOf('** ');
		if(resp != -1)
		{
			document.Form1.lstCells.options.length = 0;
			alert(http.responseText);
		}
			
		resp = response.indexOf('|');
        if(resp != -1)
        {
			var sel = document.Form1.lstCells;
			sel.options.length = 0;
			// the | divides the pairs
			pairs = response.split('|');
			// the : divides the id and text
			for (var i = 0; i < pairs.length; i++)
			{
				idtext = pairs[i].split(':');
				var opt = new Option(idtext[1], idtext[0]);				
				sel.options[sel.options.length] = opt;
			}
        }
    }
}
 
function runReport() {
	var ver = '';
	var cells = '';
	var boards = '';
	var brdGroup = '';
	var notOnlyMyBoard = 0;
	var erred = 0;
	
	//put the board id's into a string
	//boards = getSelectedValues(document.Form1.lstBoard);
	//if(boards=='-2,-1'||boards=='-2,0'||boards=='-1,0')
	//	boards = 0;
	//brdGroup = getRadioValue(this.Form1.rdoBoards);
	
	boards = getSelectedValues(document.Form1.lstBoardList);
	
	if(boards == '')
		boards = -1
		
	if(boards=='-2,-1'||boards=='-2,0'||boards=='-1,0')
	{
		boards = -1;
		//alert('Reached this alert!);
	}
	
	if(boards != document.Form1.txtBoardId.value && document.Form1.txtBoardId.value != '') {
		//the boardid chosen is not the same as user's boardid: not my board
		notOnlyMyBoard = 1;
	}
	
	if(boards == -1 && document.Form1.txtBoardId.value != '') {
		//all boards chosen and i'm a board user: not my board
		notOnlyMyBoard = 1;
	}
	
	if(boards != '') {
		//put the cells into a string
		var tbl = document.getElementById('tblCells');
	    var lastRow = tbl.rows.length - 1;
 
		//now working with full table length:?
		for (var i=1; i<=lastRow+1; i++) {
			ver = '';
			if(document.getElementById('txtRow' + i))
			{
				ver = document.getElementById('txtRow' + i).value;
				ver = ver.substring(15);
			}
			
			//if asked for fo and not my board ...
			if(notOnlyMyBoard == 1 && ver == "2") {
				alert("You cannot view FO reviewed submissions belonging to other school boards ...");
				cells = '';
				erred = 1;
				break;
			}
			else 
			{	
				if(ver != '')
					cells += document.getElementById('txtRow' + i).value +"|";
			}
		}
 
		if(erred == 0) {
			if(cells == '')
				alert('Please select at least one cell ...');
			else
			{
				//popup the report window and send it the values
				document.Form1.txtBoards.value = boards;
				document.Form1.txtCells.value = cells;
				window.open("ReportPopUp.aspx",'wh');
 
				//old way
				//window.open("ReportPopUp.aspx?Boards="+boards+"&Cells="+cells);
			}
		}
	}
	else if(boards == '')
		alert('Please select a school board ...');
}
		
function addRowsToTable()
{
	var tbl = document.getElementById('tblCells');
	var lastRow = tbl.rows.length;
	var bGo = true;
	        
	// if there's no header row in the table, then iteration = lastRow + 1
	var iteration = lastRow;	
	var cells = getSelectedTexts(document.Form1.lstCells);
	var vals = getSelectedValues(document.Form1.lstCells);
 
	//this is for fo reviewed versus the other
	var ct = 0; //are there any visible radios?
	for(i=0; i<document.Form1.elements.length; i++) {
		if(document.Form1.elements[i].type=="radio") {
			ct += 1;
		}
	}
 
	var ver = 1;
	var version = "APP";	
	if(ct > 0) {
	    if(document.Form1.rblSubmissionType_0.checked) {
			ver = 1;
			version = "APP";
		}
		else {
			ver = 2;
			version = "REV";
		}
	}
	
	var selledYear = getSelectedTexts(document.Form1.lstYears);
	var selledCycle = getSelectedTexts(document.Form1.lstSource);
	
	//check that haven't exceeded max cell count	
	var ct = countSelects(document.Form1.lstCells);
	if(lastRow +  ct - 1 > 200) {
		alert('You may only select up to 200 cells ...');
		bGo = false;
	}
	
	if(bGo) 
	{
		for (i = 0; i < cells.length; i++)
		{
			var rowNum = lastRow+i;
			var row = tbl.insertRow(lastRow+i);
			
			// left cell
			var nextCell = row.insertCell(0);
			nextCell.setAttribute('align', 'center');    
			var imgButton = document.createElement('<img src="images\\rewind.gif" />');
			imgButton.setAttribute('alt','Remove row #'+rowNum);
			imgButton.setAttribute('name','row'+rowNum);
			imgButton.setAttribute('height',16);
			imgButton.setAttribute('width',16);
			imgButton.onclick = function(){removeRow(this);};
			nextCell.appendChild(imgButton);
			
			// next to left cell
			var nextCell = row.insertCell(1);
			nextCell.setAttribute('align', 'center');    
			var imgButton = document.createElement('<img src="images\\edit.gif" />');
			imgButton.setAttribute('alt','Edit row '+rowNum);
			imgButton.setAttribute('name','editrow'+rowNum);
			imgButton.setAttribute('height',16);
			imgButton.setAttribute('width',16);
			imgButton.onclick = function(){editRow(this);};
			nextCell.appendChild(imgButton);
			
			// next cell
			var nextCell = row.insertCell(2);
			nextCell.setAttribute('align', 'center');    
			var imgButton = document.createElement('<img src="images\\uparrow.gif" />');
			imgButton.setAttribute('alt','Move row up');
			imgButton.setAttribute('name','moverowup'+rowNum);
			imgButton.setAttribute('height',16);
			imgButton.setAttribute('width',16);
			imgButton.onclick = function(){moveRow(this.parentNode,'Up');};
			nextCell.appendChild(imgButton);
			
			// next cell
			var nextCell = row.insertCell(3);
			nextCell.setAttribute('align', 'center');    
			var imgButton = document.createElement('<img src="images\\downarrow.gif" />');
			imgButton.setAttribute('alt','Move row down');
			imgButton.setAttribute('name','moverowdown'+rowNum);
			imgButton.setAttribute('height',16);
			imgButton.setAttribute('width',16);
			imgButton.onclick = function(){moveRow(this.parentNode,'Down');};
			nextCell.appendChild(imgButton);
			
			// right cell
			var cellRight = row.insertCell(4);
			//var textNode2 = document.createTextNode(cells[i]+' ('+selledYear+' '+selledCycle+' '+version+')');
			var textNode2 = document.createTextNode(cells[i]+' ('+selledCycle+' '+version+')');
			cellRight.appendChild(textNode2);
			
			var cellHidden = row.insertCell(5);
			var el = document.createElement('hidden');
			el.setAttribute('type', 'text');
			
			num = parseFloat(iteration)+parseFloat(i);
			el.setAttribute('name', 'txtRow' + num);
			el.setAttribute('id', 'txtRow' + num);
			var t = cells[i];
			var cn = t.split(' - ')[0];
		
			var year = document.Form1.lstYears.value;
			if(year < 10) year = '0' + year;
			
			var cycle = '0' + document.Form1.lstSource.value;		
			cn = cn + year + cycle + ver;
	
			el.setAttribute('value',cn);
			cellHidden.appendChild(el);
		}
	}
}
function getSelectedTexts(select)
{
	var r = new Array();
	for (var i = 0; i < select.options.length; i++)
	if (select.options[i].selected)
		r[r.length] = select.options[i].text;
	return r;
}
function getSelectedValues(select)
{
	var r = new Array();
	for (var i = 0; i < select.options.length; i++)
	if (select.options[i].selected)
		r[r.length] = select.options[i].value;
	return r;
}
function countSelects(theSel) {
	var tot = 0;
	if (theSel.selectedIndex > -1)
		for (var j=0, i=theSel.selectedIndex; i<theSel.options.length;i++)
			if (theSel.options[i].selected) tot++;
	return tot;
}
function removeRow(rowNum)
{
    var oRow = rowNum.parentElement.parentElement;  
    document.all("tblCells").deleteRow(oRow.rowIndex);  
}
 
function editRow(row)
{   
	var ycm;
	var yr;
	var tot = document.Form1.lstYears.options.length;
	//get the row number
	var oRow = row.parentElement.parentElement;  
    var x=document.getElementById("txtrow"+oRow.rowIndex);
    ycm = x.value; 
    yr=parseFloat(ycm.substr(ycm.length-5,2));
    
    //highlight the cycle and collection
	var list = document.getElementById('lstYears');
	for (var intI = 0; intI < list.options.length; intI++) {
		if (list.options[intI].value == yr) {
			list.options[intI].selected = true;
			//get the appropriate cycle
			getCycles(yr)
		}
	}
			
}
function clearLists() 
{
	document.Form1.lstCells.options.length = 0;
	document.Form1.lstSections.options.length = 0;
 
	var tbl = document.getElementById('tblCells');
	var lastRow = tbl.rows.length;
	for(var i=lastRow;i>1;i--)
		tbl.deleteRow(1);
}
 
function getCycles(yearId) {
	if(yearId == '')
		alert('Please choose a year ...');
	else
	{
		//sectionMsg.innerHTML="<table><tr><td class=redFont align=center height=38 width=120 bgcolor=#ffffff>Please wait ...</td></tr></table>";
		//document.Form1.lstSource.options[0] = null;
		document.Form1.lstSource.options.length = 0;
		
		document.Form1.lstSections.options.length = 0;
		document.Form1.lstCells.options.length = 0;
		
		var stamp = new Date().getTime();
		http.open('get', 'Handler.aspx?action=loo1&Year='+yearId+'&SessionId='+document.Form1.txtGUID.value+'&ms='+stamp);
		http.onreadystatechange = handleGetCyclesResponse;
		http.send(null);
    }
}
function handleGetCyclesResponse() {
    if(http.readyState == 4) {
        var response = http.responseText;
        var pairs = new Array();
        var idtext = new Array();
        var resp;
        
        //sectionMsg.innerHTML="<table><tr><td class=redFont align=center height=38 width=120 bgcolor=#ffffff></td></tr></table>";
		resp = response.indexOf('** ');
		if(resp != -1)
		{
			document.Form1.lstSections.options.length = 0;
			alert(http.responseText);
		}
		
		resp = response.indexOf(':');
        if(resp != -1)
        {
			//clear sections and cells
			document.Form1.lstCells.options.length = 0;
			document.Form1.lstSections.options.length = 0;
			
			var sel = document.Form1.lstSource;
			sel.options.length = 0;
						
			// the | divides the pairs
			pairs = response.split('|');
			// the : divides the id and text
			var i;
			for (i = 0; i < pairs.length; i++)
			{
				idtext = pairs[i].split(':');
				var opt = new Option(idtext[1], idtext[0]);
				sel.options[sel.options.length] = opt;
			}
			sel.options[pairs.length-1].selected = true;
        }
    }
}
function waitShowSelectedCells() {
	//setTimeout("return overlib(getSelectedTexts(document.Form1.lstCells), REF,'link2', REFP,'UL',WRAP)",250);
	//setTimeout("return overlib(getSelectedTexts(document.Form1.lstCells), REF,'section', REFP,'UL')",250);
	setTimeout("return overlib(getSelectedTexts(document.Form1.lstCells), AUTOSTATUS, REF,'section', REFP,'LL', REFX,235, REFY,15,WRAP)",250);
}
function selectAllCells() {
	for (var i=0;i<document.Form1.lstCells.options.length;i++) {
		document.Form1.lstCells.options[i].selected = true;
	}
}
function saveQuery() {
	var ver;
	var cells = '';
	var splitcell1 = '';
	var splitcell2 = '';
	var len=0;
	var bContinue = false;
 
	if(newQuery) {
		//get the name
		queryName = prompt("Please enter a query name","Maximum 100 chars");
		if(queryName == null)
			bContinue = false;
		else if(queryName == 'Maximum 100 chars')
			bContinue = false;
		else
			bContinue = true;
	}
	else {		//exists already
		if(confirm("This will overwrite the query: "+queryName))
			bContinue = true;
		else
			bContinue = false;
	}
 
	if(bContinue) {
		//put the cells into a string
		var tbl = document.getElementById('tblCells');
	    var lastRow = tbl.rows.length - 1;
 
		//now working with full table length:?
		for (var i=1; i<=lastRow; i++) {
			ver = '';
			splitcell1 = '';
			splitcell2 = '';
			len = 0;
			if(document.getElementById('txtRow' + i))
			{
				ver = document.getElementById('txtRow' + i).value;
				ver = ver.substring(15);
			}
			
			if(ver != '')  {
				//change the order
				len = document.getElementById('txtRow' + i).value.length;
				splitcell1 = document.getElementById('txtRow' + i).value.substring(len - 5);
				splitcell2 = document.getElementById('txtRow' + i).value.substring(0,len - 5);
				cells += splitcell1 + splitcell2 + '|';
			}
		}
		
		//do the save:pass queryName and cells
		var stamp = new Date().getTime();
		http.open('get', 'Handler.aspx?action=saq1&Query='+queryName+'&Cells='+cells+'&SessionId='+document.Form1.txtGUID.value+'&ms='+stamp);
		http.onreadystatechange = handleSaveQueryResponse;
		http.send(null);
	}
	newQuery = false;
}
function handleSaveQueryResponse() {
    if(http.readyState == 4) {
		alert(http.responseText);
    }
}
function getQueryList() {
	var queryName = '';
	var stamp = new Date().getTime();
	http.open('get', 'Handler.aspx?action=fql1&SessionId='+document.Form1.txtGUID.value+'&ms='+stamp);
	http.onreadystatechange = handleGetQueryListResponse;
	http.send(null);
}
function handleGetQueryListResponse() {
    if(http.readyState == 4) {
        var response = http.responseText;
        var pairs = new Array();
        var idtext = new Array();
        var resp;
        
		if(response == '')
			alert('No data was returned ...');
			
		resp = response.indexOf('** ');
		if(resp != -1)
		{
			document.Form1.lstQueryList.options.length = 0;
			alert(http.responseText);
		}
		
		resp = response.indexOf('|');
        if(resp != -1)
        {
        	//show the div
			checkShowQueryList(1);
			
			var sel = document.Form1.lstQueryList;
			sel.options.length = 0;
			// the | divides the pairs
			pairs = response.split('|');
			// the : divides the id and text
			for (var i = 0; i < pairs.length; i++)
			{
				idtext = pairs[i].split(':');
				var opt = new Option(idtext[1], idtext[0]);
				sel.options[sel.options.length] = opt;
			}
        }
    }
}
function deleteQuery() {
	if(getSelectedValues(document.Form1.lstQueryList) == '') {
		alert('Please choose a query to delete ...');
	}
	else {
		if(confirm("This will permanently delete the existing query: "+queryName)) {
			var stamp = new Date().getTime();
			http.open('get', 'Handler.aspx?action=dlq1&QueryId='+queryId+'&SessionId='+document.Form1.txtGUID.value+'&ms='+stamp);
			http.onreadystatechange = handleDeleteQueryResponse;
			http.send(null);
		}
	}
}
function handleDeleteQueryResponse() {
    if(http.readyState == 4) {
		newQuery = false;
        var response = http.responseText;
        var resp;
        
		if(response == '')
			alert('No data was returned ...');
		else
			alert(http.responseText);
	}
}
function openQuery() {
	var stamp = new Date().getTime();
	http.open('get', 'Handler.aspx?action=feq1&QueryId='+queryId+'&SessionId='+document.Form1.txtGUID.value+'&ms='+stamp);
	http.onreadystatechange = handleOpenQueryResponse;
	http.send(null);
 
	//clear first
	clearLists();
}
function handleOpenQueryResponse() {
    if(http.readyState == 4) {
		newQuery = false;
        var response = http.responseText;
        var pairs = new Array();
        var idtext = new Array();
        var resp;
		var tbl = document.getElementById('tblCells');
		var lastRow = tbl.rows.length;
		var iteration = lastRow;	
        
		if(response == '')
			alert('No data was returned ...');
		
		//check for error message
		resp = response.indexOf('** ');
		if(resp != -1)
		{
			alert(http.responseText);
		}
		
		//get the cells to be split
		response = response.substring(resp + 1);
		
		resp = response.indexOf('|');
        if(resp != -1)
        {
			// the | divides the cellnames
			pairs = response.split('|');
			for (var i = 0; i < pairs.length - 1; i++)
			{
				idtext = pairs[i].split('!');
				
				var rowNum = lastRow+i;
				var row = tbl.insertRow(lastRow+i);
				
				// left cell
				var nextCell = row.insertCell(0);
				nextCell.setAttribute('align', 'center');    
				var imgButton = document.createElement('<img src="images\\rewind.gif" />');
				imgButton.setAttribute('alt','Remove row #'+rowNum);
				imgButton.setAttribute('name','row'+rowNum);
				imgButton.setAttribute('height',16);
				imgButton.setAttribute('width',16);
				imgButton.onclick = function(){removeRow(this);};
				nextCell.appendChild(imgButton);
				
				// next to left cell
				var nextCell = row.insertCell(1);
				nextCell.setAttribute('align', 'center');    
				var imgButton = document.createElement('<img src="images\\edit.gif" />');
				imgButton.setAttribute('alt','Edit row '+rowNum);
				imgButton.setAttribute('name','editrow'+rowNum);
				imgButton.setAttribute('height',16);
				imgButton.setAttribute('width',16);
				imgButton.onclick = function(){editRow(this);};
				nextCell.appendChild(imgButton);
				
				// next cell
				var nextCell = row.insertCell(2);
				nextCell.setAttribute('align', 'center');    
				var imgButton = document.createElement('<img src="images\\uparrow.gif" />');
				imgButton.setAttribute('alt','Move row up');
				imgButton.setAttribute('name','moverowup'+rowNum);
				imgButton.setAttribute('height',16);
				imgButton.setAttribute('width',16);
				imgButton.onclick = function(){moveRow(this.parentNode,'Up');};
				nextCell.appendChild(imgButton);
				
				// next cell
				var nextCell = row.insertCell(3);
				nextCell.setAttribute('align', 'center');    
				var imgButton = document.createElement('<img src="images\\downarrow.gif" />');
				imgButton.setAttribute('alt','Move row down');
				imgButton.setAttribute('name','moverowdown'+rowNum);
				imgButton.setAttribute('height',16);
				imgButton.setAttribute('width',16);
				imgButton.onclick = function(){moveRow(this.parentNode,'Down');};
				nextCell.appendChild(imgButton);
				
				// right cell
				var cellRight = row.insertCell(4);
				var textNode2 = document.createTextNode(idtext[1]);
				cellRight.appendChild(textNode2);
				
				var cellHidden = row.insertCell(5);
				var el = document.createElement('hidden');
				el.setAttribute('type', 'text');
				
				num = parseFloat(iteration)+parseFloat(i);
				el.setAttribute('name', 'txtRow' + num);
				el.setAttribute('id', 'txtRow' + num);
				el.setAttribute('value',idtext[0]);
				cellHidden.appendChild(el);
			}
        }
    }
}
function makeNewQuery() {
	newQuery = true;
	queryName = '';
	clearLists();
}
function moveRow(src,direction)
{
    var tb = document.getElementById('tblCells').firstChild;
    var tr = tb.getElementsByTagName('tr');
    var clickedRow = src.parentNode;
    var currentRow = null;
    
    for( var i=0; i < tr.length; ++i )
    {
        currentRow = tr[i];
        if( clickedRow === currentRow )
        {       
            switch( direction.toLowerCase() )
            {
                case "up":
                    if( i > 0 )
                    {
                        var newNode = clickedRow.cloneNode(true);
                        tb.insertBefore(newNode,clickedRow.previousSibling);
                        clickedRow.removeNode(true);
                    }
                    break;
 
                case "down":
                    if( i < (tr.length-1) )
                    {
                        var newNode = clickedRow.cloneNode(true);
                        tb.insertBefore(newNode,clickedRow.nextSibling.nextSibling);
                        clickedRow.removeNode(true);
                    }
                    break;
            }
            break;
        }
    }
}
		</script>
	</HEAD>
	<BODY onload="javascript:if(document.Form1.txtUserGrp.value=='2'){showhide('divSubmissionType','hidden')};document.Form1.lstBoard.selectedIndex=0;getCycles(document.Form1.lstYears.value);">
		<LINK href="cw.css" rel="stylesheet">
			<style type="text/css">BODY { FONT-SIZE: 8pt; FONT-FAMILY: Verdana, Tahoma }
	#divHeader { BACKGROUND: #fcf3d6; LEFT: 20px; WIDTH: 808px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 80px; HEIGHT: 50px }
	#divSubmissionType { BACKGROUND: #3398ff; LEFT: 620px; WIDTH: 158px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 85px; HEIGHT: 35px }
	#divLYear { BACKGROUND: #3398ff; LEFT: 20px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 75px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 131px; HEIGHT: 25px }
	#divLBoard { BACKGROUND: #3398ff; LEFT: 96px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 75px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 131px; HEIGHT: 25px }
	#divLSource { BACKGROUND: #3398ff; LEFT: 172px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 100px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 131px; HEIGHT: 25px }
	#divLFill1 { BACKGROUND: #3398ff; LEFT: 273px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 39px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 131px; HEIGHT: 25px }
	#divLSection { BACKGROUND: #3398ff; LEFT: 313px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 150px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 131px; HEIGHT: 25px }
	#divLCells { BACKGROUND: #3398ff; LEFT: 464px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 325px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 131px; HEIGHT: 25px }
	#divLFill2 { BORDER-RIGHT: #8a6500 1px solid; BACKGROUND: #3398ff; LEFT: 789px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 40px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 131px; HEIGHT: 25px }
	#divYear { BACKGROUND: #b2ccff; LEFT: 20px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 75px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 157px; HEIGHT: 117px }
	#divBoard { BACKGROUND: #b2ccff; LEFT: 96px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 75px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 157px; HEIGHT: 117px }
	#divSource { BACKGROUND: #b2ccff; LEFT: 172px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 100px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 157px; HEIGHT: 117px }
	#divFill1 { BACKGROUND: #b2ccff; LEFT: 273px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 39px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 157px; HEIGHT: 117px }
	#divSection { BACKGROUND: #b2ccff; LEFT: 313px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 150px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 157px; HEIGHT: 117px }
	#divCells { BORDER-RIGHT: #d38332 1px solid; BACKGROUND: #b2ccff; LEFT: 464px; BORDER-LEFT: #8a6500 1px solid; WIDTH: 326px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 157px; HEIGHT: 117px }
	#divFill2 { BORDER-RIGHT: #8a6500 1px solid; BACKGROUND: #b2ccff; LEFT: 790px; WIDTH: 39px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 157px; HEIGHT: 117px }
	#divFooter { BACKGROUND: #fcf3d6; LEFT: 20px; WIDTH: 808px; POSITION: absolute; TOP: 277px; HEIGHT: 25px }
	#divReportCells { BORDER-RIGHT: #cccccc 2px solid; BACKGROUND: #fcf3d6; LEFT: 20px; OVERFLOW: auto; WIDTH: 708px; BORDER-BOTTOM: #cccccc 2px solid; POSITION: absolute; TOP: 300px; HEIGHT: 280px }
	#divReportMenu { BORDER-RIGHT: #cccccc 2px solid; BACKGROUND: #b2ccff; LEFT: 748px; WIDTH: 80px; BORDER-BOTTOM: #cccccc 2px solid; POSITION: absolute; TOP: 300px; HEIGHT: 280px }
	#divLBoardList { BACKGROUND: #3398ff; LEFT: 300px; VISIBILITY: hidden; BORDER-LEFT: #8a6500 1px solid; WIDTH: 175px; BORDER-BOTTOM: #8a6500 1px solid; POSITION: absolute; TOP: 280px; HEIGHT: 25px }
	#divBoardList { BORDER-RIGHT: #88deff 2px solid; PADDING-RIGHT: 2px; PADDING-LEFT: 2px; Z-INDEX: 12; BACKGROUND: #3398ff; LEFT: 300px; VISIBILITY: hidden; WIDTH: 275px; BORDER-BOTTOM: #88deff 2px solid; POSITION: absolute; TOP: 280px; HEIGHT: 218px }
	#divQueryList { BORDER-RIGHT: #88deff 2px solid; PADDING-RIGHT: 2px; PADDING-LEFT: 2px; Z-INDEX: 12; BACKGROUND: #3398ff; LEFT: 225px; VISIBILITY: hidden; WIDTH: 425px; BORDER-BOTTOM: #88deff 2px solid; POSITION: absolute; TOP: 280px; HEIGHT: 218px }
	</style>
			<div id="overDiv" style="Z-INDEX:1000; VISIBILITY:hidden; POSITION:absolute"></div>
			<form name="Form1" method="post" action="DivTest.aspx" id="Form1">
<input type="hidden" name="__VIEWSTATE" value="dDwtMTYwNDE4MTgzOTt0PDtsPGk8MD47PjtsPHQ8O2w8aTw1PjtpPDY+O2k8Nz47aTw5PjtpPDEwPjtpPDEyPjs+O2w8dDx0PHA8cDxsPERhdGFWYWx1ZUZpZWxkO0RhdGFUZXh0RmllbGQ7Q2VsbFBhZGRpbmc7Q2VsbFNwYWNpbmc7XyFTQjs+O2w8U1VCTUlTU0lPTl9UWVBFX0lEO1NVQk1JU1NJT05fVFlQRTtpPDA+O2k8MD47aTwzOTMyMTY+Oz4+Oz47dDxpPDI+O0A8Qm9hcmQgU3VibWl0dGVkO0ZPIFJldmlld2VkOz47QDwxOzI7Pj47Pjs7Pjt0PHQ8cDxwPGw8RGF0YVZhbHVlRmllbGQ7RGF0YVRleHRGaWVsZDs+O2w8U0NIT09MX1lFQVJfSUQ7U0NIT09MX1lFQVJfTEFCRUw7Pj47cDxsPG9uQ2xpY2s7PjtsPGdldEN5Y2xlcyhkb2N1bWVudC5Gb3JtMS5sc3RZZWFycy52YWx1ZSk7Pj4+O3Q8aTw2PjtAPDIwMDItMDM7MjAwMy0wNDsyMDA0LTA1OzIwMDUtMDY7MjAwNi0wNzsyMDA3LTA4Oz47QDw1OzY7Nzs4Ozk7MTA7Pj47Pjs7Pjt0PHQ8cDxwPGw8RGF0YVZhbHVlRmllbGQ7RGF0YVRleHRGaWVsZDs+O2w8Qk9BUkRUWVBFX0lEO0JPQVJEVFlQRTs+PjtwPGw8b25DbGljazs+O2w8Y2hlY2tTaG93Qm9hcmRMaXN0KGRvY3VtZW50LkZvcm0xLmxzdEJvYXJkLnZhbHVlKTs+Pj47dDxpPDI+O0A8QWxsO1NlbGVjdDs+O0A8MDsxOz4+Oz47Oz47dDx0PHA8O3A8bDxvbkNsaWNrO29uTW91c2VPdXQ7PjtsPGdldENlbGxzKGRvY3VtZW50LkZvcm0xLmxzdFllYXJzLnNlbGVjdGVkSW5kZXgsZG9jdW1lbnQuRm9ybTEubHN0U291cmNlLnNlbGVjdGVkSW5kZXgsZG9jdW1lbnQuRm9ybTEubHN0U2VjdGlvbnMuc2VsZWN0ZWRJbmRleClcO3JldHVybiBvdmVybGliKGdldFNlbGVjdGVkVGV4dHModGhpcyksIFJFRiwnbGluazEnLCBSRUZQLCdVTCcpXDs7cmV0dXJuIG5kKClcOzs+Pj47Oz47Oz47dDx0PHA8O3A8bDxvbkNsaWNrO29uTW91c2VPdXQ7b25tb3VzZW92ZXI7b25mb2N1cztvbmJsdXI7PjtsPHdhaXRTaG93U2VsZWN0ZWRDZWxscygpXDs7cmV0dXJuIG5kKClcOzt3YWl0U2hvd1NlbGVjdGVkQ2VsbHMoKVw7O3dhaXRTaG93U2VsZWN0ZWRDZWxscygpXDs7cmV0dXJuIG5kKClcOzs+Pj47Oz47Oz47dDx0PHA8cDxsPERhdGFWYWx1ZUZpZWxkO0RhdGFUZXh0RmllbGQ7PjtsPFNDSE9PTF9CT0FSRF9JRDtTQ0hPT0xfQk9BUkRfU0RFU0M7Pj47Pjt0PGk8NzI+O0A8QWxnb21hIERTQjtBbGdvbnF1aW4gJiBMYWtlc2hvcmUgQ2F0aCBEU0I7QXZvbiBNYWl0bGFuZCBEU0I7Qmx1ZXdhdGVyIERTQjtCcmFudCBIYWxkaW1hbmQgTm9yZm9sayBDRFNCO0JydWNlLUdyZXkgQ2F0aG9saWMgRFNCO0NFUCBkZSBsJ0VzdCBkZSBsJ09udGFyaW87Q1NEIGNhdGguIENlbnRyZS1Fc3QgZGUgbCdPbnQuO0NTRCBjYXRoLiBkZSBsJ0VzdCBvbnRhcmllbjtDU0QgY2F0aC4gZGVzIEF1cm9yZXMgYm9yw6lhbGVzO0NTRCBjYXRoLiBkZXMgR3JhbmRlcyBSaXZpw6hyZXM7Q1NEIGNhdGguIGR1IE5vdXZlbC1PbnRhcmlvO0NTRCBjYXRob2xpcXVlIENlbnRyZS1TdWQ7Q1NEIGNhdGhvbGlxdWUgRnJhbmNvLU5vcmQ7Q1NEIGRlcyDDqWNvbGVzIGNhdGguIFN1ZC1PdWVzdDtDU0QgZHUgQ2VudHJlIFN1ZC1PdWVzdDtDU0QgZHUgR3JhbmQgTm9yZCBkZSBsJ09udGFyaW87Q1NEIGR1IE5vcmQtRXN0IGRlIGwnT250YXJpbztDYXRoIERTQiBvZiBFYXN0ZXJuIE9udGFyaW87RFNCIE9udGFyaW8gTm9ydGggRWFzdDtEU0Igb2YgTmlhZ2FyYTtEdWZmZXJpbi1QZWVsIENhdGhvbGljIERTQjtEdXJoYW0gQ2F0aG9saWMgRFNCO0R1cmhhbSBEU0I7R3JhbmQgRXJpZSBEU0I7R3JlYXRlciBFc3NleCBDb3VudHkgRFNCO0hhbHRvbiBDYXRob2xpYyBEU0I7SGFsdG9uIERTQjtIYW1pbHRvbi1XZW50d29ydGggQ2F0aCBEU0I7SGFtaWx0b24tV2VudHdvcnRoIERTQjtIYXN0aW5ncyAmIFByaW5jZSBFZHdhcmQgRFNCO0h1cm9uLVBlcnRoIENhdGhvbGljIERTQjtIdXJvbi1TdXBlcmlvciBDYXRob2xpYyBEU0I7S2F3YXJ0aGEgUGluZSBSaWRnZSBEU0I7S2Vld2F0aW4tUGF0cmljaWEgRFNCO0tlbm9yYSBDYXRob2xpYyBEU0I7TGFrZWhlYWQgRFNCO0xhbWJ0b24gS2VudCBEU0I7TGltZXN0b25lIERTQjtMb25kb24gRGlzdC4gQ2F0aG9saWMgU2Nob29sO05lYXIgTm9ydGggRFNCO05pYWdhcmEgQ2F0aG9saWMgRFNCO05pcGlzc2luZy1QYXJyeSBTb3VuZCBDYXRoIERTQjtOb3J0aGVhc3Rlcm4gQ2F0aG9saWMgRFNCO05vcnRod2VzdCBDYXRob2xpYyBEU0I7T3R0YXdhIENhdGhvbGljIERTQjtPdHRhd2EtQ2FybGV0b24gRFNCO1BWTkMgQ2F0aG9saWMgRFNCO1BlZWwgRFNCO1JhaW5ib3cgRFNCO1JhaW55IFJpdmVyIERTQjtSZW5mcmV3IENvdW50eSBDYXRob2xpYyBEU0I7UmVuZnJldyBDb3VudHkgRFNCO1NpbWNvZSBDb3VudHkgRFNCO1NpbWNvZSBNdXNrb2thIENhdGhvbGljIERTQjtTdC4gQ2xhaXIgQ2F0aG9saWMgRFNCO1N1ZGJ1cnkgQ2F0aG9saWMgRFNCO1N1cGVyaW9yIE5vcnRoIENhdGhvbGljIERTQjtTdXBlcmlvci1HcmVlbnN0b25lIERTQjtUaGFtZXMgVmFsbGV5IERTQjtUaHVuZGVyIEJheSBDYXRob2xpYyBEU0I7VG9yb250byBDYXRob2xpYyBEU0I7VG9yb250byBEU0I7VHJpbGxpdW0gTGFrZWxhbmRzIERTQjtVcHBlciBDYW5hZGEgRFNCO1VwcGVyIEdyYW5kIERTQjtXYXRlcmxvbyBDYXRob2xpYyBEU0I7V2F0ZXJsb28gUmVnaW9uIERTQjtXZWxsaW5ndG9uIENhdGhvbGljIERTQjtXaW5kc29yLUVzc2V4IENhdGhvbGljIERTQjtZb3JrIENhdGhvbGljIERTQjtZb3JrIFJlZ2lvbiBEU0I7PjtAPDM7NjE7MTE7MTA7NTc7NDE7NjU7NzM7NzI7Njk7NjY7Njg7NzE7Njc7NzA7NjQ7NjM7NjI7NTg7MjsyNTs0OTs1MTsxNjsyNjsxMjs1MjsyMzs1MzsyNDszMjs0MjszNTsxNzs2OzM4Ozg7MTM7MzA7NDQ7NTs1NjszNDszMzszNzs1OTsyODs0NzsyMjs0OzE7NjA7MzE7MjA7NTA7NDU7MzY7NDA7OTsxNDszOTs0NjsxNTsxODsyOTsyMTs1NTsyNzs1NDs0Mzs0ODsxOTs+Pjs+Ozs+Oz4+Oz4+O2w8bHN0Q2VsbHM7bHN0Qm9hcmRMaXN0Oz4+us+D1C5h9xO0sYAMqLH8i72vWjw=" />
 
				<div id="divHeader">
					<A href="javascript:makeNewQuery();"><IMG height="30" alt="" src="images\edit.gif" border="0" width="30">New Query</A>
					<A href="javascript:getQueryList();"><IMG height="30" alt="" src="images\open.gif" border="0" width="30">Open Query</A>
					<A href="javascript:saveQuery();"><IMG height="30" alt="" src="images\save.gif" border="0" width="30">Save Query</A>
					<input name="txtBoardId" id="txtBoardId" type="hidden" size="1" value="74" /> <input name="txtGUID" id="txtGUID" type="hidden" size="1" value="90326CA20DC9497A91BAA7A439E8EB38" />
					<input name="txtUserGrp" id="txtUserGrp" type="hidden" size="1" value="1" /> <IMG id="section" name="section" alt="" src="images\spacer.gif" border="0">&nbsp;
					<input name="txtBoards" id="txtBoards" type="hidden" size="1" /><input name="txtCells" id="txtCells" type="hidden" size="1" />
				</div>
				<div id="divSubmissionType"><table id="rblSubmissionType" class="divFont" cellspacing="0" cellpadding="0" border="0" style="width:159px;border-collapse:collapse;">
	<tr>
		<td><input id="rblSubmissionType_0" type="radio" name="rblSubmissionType" value="1" checked="checked" /><label for="rblSubmissionType_0">Board Submitted</label></td>
	</tr><tr>
		<td><input id="rblSubmissionType_1" type="radio" name="rblSubmissionType" value="2" /><label for="rblSubmissionType_1">FO Reviewed</label></td>
	</tr>
</table></div>
				<div id="divLYear" align="center">School Year</div>
				<div id="divLBoard" align="center">Boards</div>
				<div id="divLSource" align="center">Source</div>
				<div id="divLFill1" align="center"></div>
				<div id="divLSection" align="center">Section</div>
				<div id="divLCells" align="center">Cell Name and Description&nbsp;<A href="javascript:selectAllCells();">Select 
						All</A></div>
				<div id="divLFill2" align="center"></div>
				<div id="divYear" align="center"><select name="lstYears" size="4" id="lstYears" class="divFont" onClick="getCycles(document.Form1.lstYears.value)" style="height:112px;width:72px;">
	<option value="5">2002-03</option>
	<option value="6">2003-04</option>
	<option value="7">2004-05</option>
	<option value="8">2005-06</option>
	<option value="9">2006-07</option>
	<option selected="selected" value="10">2007-08</option>
 
</select></div>
				<div id="divBoard" align="center">
					<select name="lstBoard" size="4" id="lstBoard" class="divFont" onClick="checkShowBoardList(document.Form1.lstBoard.value)" style="height:42px;width:72px;">
	<option value="0">All</option>
	<option value="1">Select</option>
 
</select></div>
				<div id="divSource" align="center">
					<select name="lstSource" size="4" id="lstSource" class="divFont" style="height:112px;width:96px;">
 
</select>
				</div>
				<div id="divFill1" align="center"><br>
					<br>
					<A href="javascript:void(0)"><IMG onclick="javascript:getSections(document.Form1.lstYears.value,document.Form1.lstSource.value);"
							alt="" src="images\fast-forward.gif" border="0"><br>
					</A>
					Fill List
				</div>
				<div id="divSection" align="center">
					<select name="lstSections" size="4" id="lstSections" class="divFont" onClick="getCells(document.Form1.lstYears.selectedIndex,document.Form1.lstSource.selectedIndex,document.Form1.lstSections.selectedIndex);return overlib(getSelectedTexts(this), REF,'link1', REFP,'UL');" onMouseOut="return nd();" style="height:112px;width:144px;">
 
</select>
				</div>
				<div id="divCells" align="center">
					<select name="lstCells" size="4" multiple="multiple" id="lstCells" class="divFont" onClick="waitShowSelectedCells();" onMouseOut="return nd();" onmouseover="waitShowSelectedCells();" onfocus="waitShowSelectedCells();" onblur="return nd();" style="height:112px;width:320px;">
 
</select>
				</div>
				<div id="divFill2" align="center"><br>
					<br>
					<A href="javascript:addRowsToTable();"><IMG alt="" src="images\download.gif" border="0"><br>
						Add Cells
					</A>
				</div>
				<!--<div id="divFooter">Footer</div>-->
				<!--<div id="divLBoardList" align="center">-->
				<!--<span id="lblBoardList">-->
				<!--</span>-->
				<DIV></DIV>
				<div id="divBoardList" align="center">
					Boards
					<br>
					<select name="lstBoardList" size="12" multiple="multiple" id="lstBoardList" class="divFont" style="height:176px;width:204px;">
	<option value="3">AXX DSB</option>
	<option value="61">AXXXX</option>
</select><br>
					<INPUT onclick="javascript:showhide('divBoardList','hidden');" type="button" value="OK">
				</div>
				<div id="divQueryList" align="center">
					Query List
					<br>
					<select name="lstQueryList" size="12" id="lstQueryList" class="divFont" style="height:176px;width:354px;">
 
</select><br>
					<INPUT onclick="javascript:queryId=getSelectedValues(document.Form1.lstQueryList);queryName=getSelectedTexts(document.Form1.lstQueryList);showhide('divQueryList','hidden');openQuery();"
						type="button" value="OK">&nbsp; <INPUT onclick="javascript:showhide('divQueryList','hidden');" type="button" value="Cancel">&nbsp;
					<INPUT onclick="javascript:queryId=getSelectedValues(document.Form1.lstQueryList);queryName=getSelectedTexts(document.Form1.lstQueryList);showhide('divQueryList','hidden');deleteQuery();"
						type="button" value="Delete">
				</div>
				<div id="divReportMenu" align="center">
					<A href="javascript:void(0)"><IMG onclick="javascript:runReport();" alt="" src="images\play.gif" border="0"><br>
					</A>
					Run Report
					<br>
					<br>
					<IMG alt="" src="images\help.gif"><br>
					Help
					<br>
					<br>
					<A href="javascript:void(0)"><IMG onclick="javascript:clearLists();" alt="" src="images\delete.gif" border="0"><br>
					</A>
					Reset Report
					<br>
					<br>
				</div>
				<div id="divReportCells" ms_positioning="FlowLayout">
					<TABLE height="100" cellSpacing="0" cellPadding="0" width="100" border="0" ms_1d_layout="TRUE">
						<TR>
							<TD>
								<TABLE id="tblSelledCells" height="46" cellSpacing="1" cellPadding="1" width="700" border="0">
									<TR>
										<TD>
											<TABLE class="divStep" id="tblCells" height="24" cellSpacing="1" cellPadding="1" width="675"
												align="center" border="0" valign="top">
												<TR>
													<th colSpan="5">
														Selected Cells
													</th>
												</TR>
											</TABLE>
										</TD>
									</TR>
								</TABLE>
							</TD>
						</TR>
					</TABLE>
				</div>
				
<TABLE id="PageHeadertbl" cellSpacing="0" cellPadding="0" width="100%" border="0" class="PageHeader">
</TABLE>
			</form>
			<IFRAME id="Defib" src="/Defib.aspx" frameBorder="no" width="0" height="0"></IFRAME>
	</BODY>
</HTML>

Open in new window

0
 

Author Comment

by:TimboALogo99
ID: 22626204
I've attached another code snippet which demonstrates the second problem - now that I'm doing this, I'm realizing that I'm an idiot and that's why the reordered list doesn't look reordered: I'm using getElementById in a loop to UNreorder them. Jeez, I am an idiot, but I don't know how to read the table row by row ...

The question will be half answered if you can tell me how to do that!

Thanks,
Tim

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
	<HEAD>
		<title></title>
		<script type="text/javascript">
var activeRow = 0;
function setActiveRow(el) {
  var rows = document.getElementById('tblCells').rows;
  for(var i = 0; i < rows.length; i++) {
    if(rows[i] == el) {
        rows[i].style.backgroundColor = "blue";
        activeRow = i;
      } else {
        rows[i].style.backgroundColor = "white";
      }
  }
}
function moveRow(src,direction)
{
    var tb = document.getElementById('container');
    var tr = tb.getElementsByTagName('tr');
    var clickedRow = src.parentNode;
    var currentRow = null;
    for( var i=0; i < tr.length; ++i )
    {
        currentRow = tr[i];
        if( clickedRow === currentRow )
        {       
            switch( direction.toLowerCase() )
            {
                case "up":
                    if( i > 0 )
                    {
                        var newNode = clickedRow.cloneNode(true);
                        alert(clickedRow.nodeName);
                        alert(newNode.nodeName);             
                        alert(clickedRow.previousSibling.nodeName);
                        tb.insertBefore(newNode,clickedRow.previousSibling);
                        clickedRow.removeNode(true);
                    }
                    break;
 
                case "down":
                    if( i < (tr.length-1) )
                    {
                        var newNode = clickedRow.cloneNode(true);
                        tb.insertBefore(newNode,clickedRow.nextSibling.nextSibling);
                        clickedRow.removeNode(true);
                    }
                    break;
            }
            break;
        }
    }
}
function showOrder() {
		var tbl = document.getElementById('tblCells');
	    var lastRow = tbl.rows.length - 1;
 
		//now working with full table length:?
		for (var i=1; i<=lastRow+1; i++) {
			alert(document.getElementById('txtRow' + i).id);
		}
}
		</script>
	</HEAD>
	<body>
		<table id="tblCells" border="1">
			<tbody id="container">
				<tr>
					<td id="txtRow1">a</td>
					<td><a href="#" onclick="moveRow(this.parentNode,this.innerHTML);return false;">Up</a></td>
					<td><a href="#" onclick="moveRow(this.parentNode,this.innerHTML);return false;">Down</a></td>
				</tr>
				<tr>
					<td id="txtRow2">b</td>
					<td><a href="#" onclick="moveRow(this.parentNode,this.innerHTML);return false;">Up</a></td>
					<td><a href="#" onclick="moveRow(this.parentNode,this.innerHTML);return false;">Down</a></td>
				</tr>
				<tr>
					<td id="txtRow3">c</td>
					<td><a href="#" onclick="moveRow(this.parentNode,this.innerHTML);return false;">Up</a></td>
					<td><a href="#" onclick="moveRow(this.parentNode,this.innerHTML);return false;">Down</a></td>
				</tr>
				<tr>
					<td id="txtRow4">d</td>
					<td><a href="#" onclick="moveRow(this.parentNode,this.innerHTML);return false;">Up</a></td>
					<td><a href="#" onclick="moveRow(this.parentNode,this.innerHTML);return false;">Down</a></td>
				</tr>
				<tr>
					<td id="txtRow5">e</td>
					<td><a href="#" onclick="moveRow(this.parentNode,this.innerHTML);return false;">Up</a></td>
					<td><a href="#" onclick="moveRow(this.parentNode,this.innerHTML);return false;">Down</a></td>
				</tr>
			</tbody>
		</table>
		<a href=javascript:showOrder();>Show Order</a>
	</body>
</HTML>

Open in new window

0
 

Author Comment

by:TimboALogo99
ID: 22626267
And here is the snippet that shows how the buttons stop working:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
	<HEAD>
		<title>WebForm6</title>
		<meta name="GENERATOR" content="Microsoft Visual Studio .NET 7.1">
		<meta name="CODE_LANGUAGE" content="Visual Basic .NET 7.1">
		<meta name="vs_defaultClientScript" content="JavaScript">
		<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
		<script language="javascript">
		function test() {
			var tb = document.getElementById('tblCells').firstChild;
			var tr = tb.getElementsByTagName('tr');
		}
		
function addRowsToTable()
{
	var tbl = document.getElementById('tblCells');
	var lastRow = tbl.rows.length;
	var bGo = true;
	        
	// if there's no header row in the table, then iteration = lastRow + 1
	var iteration = lastRow;	
	var cells = "789";
	var vals = "2";
	var selledYear = "3";
	var selledCycle = "4";
 
	for (i = 0; i < cells.length; i++)
	{
		var rowNum = lastRow+i;
		var row = tbl.insertRow(lastRow+i);
		
		// left cell
		var nextCell = row.insertCell(0);
		nextCell.setAttribute('align', 'center');    
		var imgButton = document.createElement('<img src="images\\rewind.gif" />');
		imgButton.setAttribute('alt','Remove row #'+rowNum);
		imgButton.setAttribute('name','row'+rowNum);
		imgButton.setAttribute('height',16);
		imgButton.setAttribute('width',16);
		imgButton.onclick = function(){removeRow(this);};
		nextCell.setAttribute('value',i);
		nextCell.appendChild(imgButton);
		
		// next to left cell
		var nextCell = row.insertCell(1);
		nextCell.setAttribute('align', 'center');    
		var imgButton = document.createElement('<img src="images\\edit.gif" />');
		imgButton.setAttribute('alt','Edit row '+rowNum);
		imgButton.setAttribute('name','editrow'+rowNum);
		imgButton.setAttribute('height',16);
		imgButton.setAttribute('width',16);
		imgButton.onclick = function(){editRow(this);};
		nextCell.appendChild(imgButton);
		
		// next cell
		var nextCell = row.insertCell(2);
		nextCell.setAttribute('align', 'center');    
		var imgButton = document.createElement('<img src="images\\uparrow.gif" />');
		imgButton.setAttribute('alt','Move row up');
		imgButton.setAttribute('name','moverowup'+rowNum);
		imgButton.setAttribute('height',16);
		imgButton.setAttribute('width',16);
		imgButton.onclick = function(){moveRow(this.parentNode,'Up');};
		nextCell.appendChild(imgButton);
		
		// next cell
		var nextCell = row.insertCell(3);
		nextCell.setAttribute('align', 'center');    
		var imgButton = document.createElement('<img src="images\\downarrow.gif" />');
		imgButton.setAttribute('alt','Move row down');
		imgButton.setAttribute('name','moverowdown'+rowNum);
		imgButton.setAttribute('height',16);
		imgButton.setAttribute('width',16);
		imgButton.onclick = function(){moveRow(this.parentNode,'Down');};
		nextCell.appendChild(imgButton);
		
		var cellRight = row.insertCell(4);
		var textNode = document.createTextNode(i);
		cellRight.appendChild(textNode);
	}
}
function moveRow(src,direction)
{
    var tb = document.getElementById('tblCells').firstChild;
    var tr = tb.getElementsByTagName('tr');
    var clickedRow = src.parentNode;
    var currentRow = null;
    
    for( var i=0; i < tr.length; ++i )
    {
        currentRow = tr[i];
        if( clickedRow === currentRow )
        {       
            switch( direction.toLowerCase() )
            {
                case "up":
                    if( i > 0 )
                    {
                        var newNode = clickedRow.cloneNode(true);
                        tb.insertBefore(newNode,clickedRow.previousSibling);
                        clickedRow.removeNode(true);
                    }
                    break;
 
                case "down":
                    if( i < (tr.length-1) )
                    {
                        var newNode = clickedRow.cloneNode(true);
                        tb.insertBefore(newNode,clickedRow.nextSibling.nextSibling);
                        clickedRow.removeNode(true);
                    }
                    break;
            }
            break;
        }
    }
}
		</script>
	</HEAD>
	<body MS_POSITIONING="GridLayout" onload = "javascript:addRowsToTable();">
		<form name="Form1" method="post" action="WebForm6.aspx" id="Form1">
<input type="hidden" name="__VIEWSTATE" value="dDwtNjU0MzcyMTk1Ozs+NvrVAKEH5nf0CT00XGsVTx2np1o=" />
 
			<div id="divReportCells" ms_positioning="FlowLayout" style="WIDTH: 100px; POSITION: relative; HEIGHT: 100px">
				<TABLE id="tblSelledCells" height="46" cellSpacing="1" cellPadding="1" width="700" border="0">
					<TR>
						<TD>
							<TABLE class="divStep" id="tblCells" height="24" cellSpacing="1" cellPadding="1" width="675"
								align="center" border="0" valign="top">
								<TR>
									<th colSpan="5">
										TEST
									</th>
								</TR>
							</TABLE>
						</TD>
					</TR>
				</TABLE>
			</div>
		</form>
	</body>
</HTML>

Open in new window

0

Featured Post

Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses the difference between strict equality operator and equality operator in JavaScript. The Need: Because JavaScript performs an implicit type conversion when performing comparisons, we have to take this into account when wri…
JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

730 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question