Search code examples
javascriptspreadsheetfarpoint-spread

SetSelectedRange Spread.NET javascript issue


I'm trying to add functionality to Spread.NET control where it will permit a hold shift-click to select a range of cells in ASP. I'm creating the event onActiveCellChanged to call the selectRange function on execution

   var shiftPressed = false;
   var newSelect = true;

   window.pageLoad = function init() {
       var ss = document.getElementById('<%=FpSpread1.ClientID %>');

       if (ss.addEventListener != null) {
           ss.addEventListener("ActiveCellChanged", selectRange(), false);
       } else if (ss.attachEvent != null) {
           ss.attachEvent("ActiveCellChanged", selectRange());
       }
       else {
           FpSpread1.onActiveCellChanged = selectRange;
       }
   }

Here is the selectRange function.

        function selectRange() {
            var ss = document.getElementById('<%=FpSpread1.ClientID %>');
            var swap;

            if (shiftPressed == true) {
                var initRow = document.getElementById('RowCoord').value;
                var initCol = document.getElementById('ColCoord').value;
                var SecRow = getRow();
                var SecCol = getCol();
                newSelect = false;

                var rCount = Math.abs(SecRow - initRow) + 1;
                var cCount = Math.abs(SecCol - initCol) + 1;

                if (initRow > SecRow)
                    initRow = SecRow;

                if (initCol > SecCol)
                    initCol = SecCol;

                //alert(initRow + ' ' + initCol);
                alert(initRow + ' ' + initCol + ' ' + rCount + ' ' + cCount);
                ss.SetSelectedRange(initRow, initCol, rCount, cCount);

            }
            else {
                document.getElementById('RowCoord').value = 0;
                document.getElementById('ColCoord').value = 0;
                newSelect = true;
            }
        }

And this is how I'm determining whether shift is being held.

        function aKeyDown(event) {

            if (event.keyCode == 16) {

                shiftPressed = true;
                var col = getCol();
                var row = getRow();

                if (newSelect) {
                    document.getElementById('RowCoord').value = row;
                    document.getElementById('ColCoord').value = col;
                }
            }
        }

        function aKeyUp(event) {

            if (event.keyCode == 16) {
                shiftPressed = false;
            }
        }

        function getRow() {
            var ss = document.getElementById('<%=FpSpread1.ClientID %>');
            ret = ss.ActiveRow;

            if (ret == undefined)
                ret = ss.GetActiveRow;

            return ret;
        }

        function getCol() {
            var ss = document.getElementById('<%=FpSpread1.ClientID %>');
            ret = ss.ActiveCol;

            if (ret == undefined)
                ret = ss.GetActiveCol;

            return ret;
        }   

The SetSelectedRange in the select range function will work if my initial cell is a,1. However, if it's any other cell, it'll select the entire row and column.

Here is my <div> tag:

<FarPoint:FpSpread onkeydown="aKeyDown(event)" onkeyup="aKeyUp(event)" ID="FpSpread1"...

In image 1, My initial cell was (a,3) and I held shift and clicked on (b,4)

In image 2, it works. As long as I start at cell (a,1)

Image 1 Image 2


Solution

  • I needed to parseInt the row and column values.

    function getRow() {
            var ss = document.getElementById(spd);
            ret = ss.ActiveRow;
    
            if (ret == undefined)
                ret = ss.GetActiveRow();
    
            return parseInt(ret);
        }
    
        function getCol() {
            var ss = document.getElementById(spd);
            ret = ss.ActiveCol;
    
            if (ret == undefined)
                ret = ss.GetActiveCol();
    
            return parseInt(ret);
        }