ActiveWidgets • Multi Select

More information on this topic is available in the documentation section: /grid.doc.layout/.

I can not get the multi-select to accept a Shifted range to include all rows. For example, click on row 2, then press shift and click on row 5 should give me rows 2, 3, 4 and 5. I get 2 and 5 only.

Does anyone have this working correctly?

No, this is still not implemented. Added this to the 'remaining bugs' list -

http://www.activewidgets.com/general.bugs/2-0-1.html

here is a simple workaround. it uses "onSelectorMouseDown ", you can alter this to "onRowMouseDown":

</head>

<body>

    <script>



    var obj = new AW.UI.Grid;

    obj.setCellData("cell");

    obj.setHeaderText("header");

    obj.setColumnCount(10);

    obj.setRowCount(10);

    obj.setCellEditable(true);

    obj.setSelectorVisible(true);

    obj.setSelectorWidth(25);

    obj.setSelectorText(function(i){return this.getRowPosition(i)+1});

    obj.setSelectionMode("multi-row");



    Array.prototype.max = function(){

        return Math.max.apply({},this)

    }



    Array.prototype.min = function(){

        return Math.min.apply({},this)

    }



    obj.onSelectorMouseDown = function(event, index) {

        if (event.shiftKey) {

            var selmin=obj.getSelectedRows().min();

            var rowmin = Math.min(selmin,index);

            var rowmax = Math.max(selmin,index);

            selrows=[];

            for(i=rowmin; i<=rowmax; i++){

                selrows.push(i);

            }

            obj.setSelectedRows(selrows);

        }

      };

    /*

    obj.onRowMouseDown = function(event, index) {

        if (event.shiftKey) {

            var selmin=obj.getSelectedRows().min();

            var rowmin = Math.min(selmin,index);

            var rowmax = Math.max(selmin,index);

            selrows=[];

            for(i=rowmin; i<=rowmax; i++){

                selrows.push(i);

            }

            obj.setSelectedRows(selrows);

        }

      };

    */

    document.write(obj);



    </script>

<br>

<button value="getSelectedRows" onClick="alert(obj.getSelectedRows());">get Selected Rows</button>

</body>

</html>

Hi,
I've extended the previous workaround to get full functionality of select box. The function RemoveDuplicateValues is only called to cleanup getSelectedRows for further processing, you don't have to call if you don't need this.

</head>

<body>

    <script>



    var obj = new AW.UI.Grid;

    obj.setCellData("cell");

    obj.setHeaderText("header");

    obj.setColumnCount(10);

    obj.setRowCount(10);

    obj.setCellEditable(true);

    obj.setSelectorVisible(true);

    obj.setSelectorWidth(25);

    obj.setSelectorText(function(i){return this.getRowPosition(i)+1});

    obj.setSelectionMode("multi-row");



    Array.prototype.max = function()

        {return Math.max.apply({},this);}



    Array.prototype.min = function()

        {return Math.min.apply({},this);}

    

    //Remove duplicate values and sort asc

    function RemoveDuplicateValues(array)

    {

        var i,j,resultArray=[];

        for (i = array.min(); i<=array.max();++i)

        {

            for (j=0;j<=array.length;++j)

            {

                if (array[j]==i)

                {

                    resultArray.push(i);

                    break;

                }

            }

        }

        return resultArray;

    }



    var lastIndex;

    obj.onRowMouseDown = function(event, index)

    {

        if ((event.shiftKey && event.ctrlKey) || event.shiftKey)

        {

            var rowmin = Math.min(lastIndex,index);

            var rowmax = Math.max(lastIndex,index);

            var selrows=[];

            for(i=rowmin; i<=rowmax; ++i)

                {selrows.push(i);}

            if (event.ctrlKey) //&&event.shiftKey

                {obj.setSelectedRows(RemoveDuplicateValues(obj.getSelectedRows().concat(selrows)));}

            else //event.shiftKey

                {obj.setSelectedRows(selrows);}

        }

        lastIndex = index;

    };

    document.write(obj);



    </script>

<br>

<button value="getSelectedRows" onClick="alert(obj.getSelectedRows());">get Selected Rows</button>

</body>

</html>

thanks for this improvement,

maybe it's better to change the key-events:

if (event.ctrlKey) //&&event.shiftKey

                {obj.setSelectedRows(selrows);}

            else //event.shiftKey

                {obj.setSelectedRows(RemoveDuplicateValues(obj.getSelectedRows().concat(selrows)));}

kind regards

Multi Select

Documentation:

Forum search