Solved

Using insertBefore to move rows around in a dynamically created table

Posted on 2008-10-01
6
790 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
  • 4
  • 2
6 Comments
 
LVL 14

Expert Comment

by:ziffgone
Comment Utility
Could you give the full HTML and Javascript for the page?
0
 

Author Comment

by:TimboALogo99
Comment Utility
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
Comment Utility
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
6 Surprising Benefits of Threat Intelligence

All sorts of threat intelligence is available on the web. Intelligence you can learn from, and use to anticipate and prepare for future attacks.

 

Accepted Solution

by:
TimboALogo99 earned 0 total points
Comment Utility
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
Comment Utility
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
Comment Utility
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

How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

Join & Write a Comment

Introduction HTML checkboxes provide the perfect way for a web developer to receive client input when the client's options might be none, one or many.  But the PHP code for processing the checkboxes can be confusing at first.  What if a checkbox is…
Article by: DanRollins
This article describes a JavaScript program that creates a maze made of hexagonal cells.  In Part 2 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7850-Hex-Maze-Part-2.html), we'll extend the program by adding a depth-…
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…

763 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

Need Help in Real-Time?

Connect with top rated Experts

10 Experts available now in Live!

Get 1:1 Help Now