排序＆＃39; handontable＆＃39;然后能够从表中读回数据

Question

我希望能够对表格进行排序，然后能够从表格中读取数据。我拼凑了这个有效的代码，但似乎有更好的方法在屏幕上对数据进行排序，然后能够按排序顺序提取数据。

这个javascript插件似乎针对快速屏幕操作进行了优化。 ＆＃34;仅对表视图进行排序。数据源保持原始顺序。＆＃34;要对表视图和数据源进行排序以对其进行排序，您似乎必须同时执行这两项操作或数据源，然后重新应用。

的引用： http://jsfiddle.net/itp99/paokya7y/6/

文档建议我们使用sort和render函数，但是我们仍然需要处理排序顺序问题。

文档： https://github.com/handsontable/jquery-handsontable/wiki/Understanding-column-sorting-plugin http://handsontable.com/demo/sorting.html

    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
    <script src="../jquery/jquery.js" type="text/javascript"></script>     
    <script src="../handsontable/dist/jquery.handsontable.full.js"></script>
    <link rel="stylesheet" media="screen" href="../handsontable/dist/jquery.handsontable.full.css">
    <script type="text/javascript">


    $( document ).ready(function() {

        var sortCol = 0;
        var mySortDirection;

        var myArrayOfArrays = [         
            [66,'AA',1],
            [55,'BB',3],
            [44,'CC',2]
        ];

        // ----------------------------------------------------
        // HandsTable Setup
        // ----------------------------------------------------
        $('#exampleGrid').handsontable({
            data: myArrayOfArrays,
            minSpareRows: 1,
            colHeaders: true,
            contextMenu: true,          
            columnSorting: true,

            // use special listener to get column number, then sort underlying array as this is not default behaviour.          
            afterOnCellMouseDown: function (changes, source) {
                if (source['row'] === -1) { 
                    sortCol = source['col'];                    
                    // get current sort direction
                    mySortDirection =  sortDirection($('#exampleGrid').handsontable('getInstance'));
                    var myTableData = $('#exampleGrid').handsontable('getData');                    
                    // perform sort with custome callback
                    myArrayOfArrays = myArrayOfArrays.sort(fnSortingFunction);
                    // $('#exampleGrid').handsontable('render'); 
                    // display content of original array back to to screen
                    $('#textOut').html("");
                    fnShowArray(myArrayOfArrays);
                }
            }
        });  // end handsontable definition


        // ----------------------------------------------------
        // Sort function - callback
        // ----------------------------------------------------
        function fnSortingFunction(a,b) {           
            if (mySortDirection === 'Ascending'){
                if (a[sortCol] < b[sortCol]) return -1;
                if (a[sortCol] > b[sortCol]) return 1;
            }
            else{
                if (a[sortCol] < b[sortCol]) return 1;
                if (a[sortCol] > b[sortCol]) return -1;         
            }
            return 0;
        }   

        // ----------------------------------------------------
        // Determine which way to sort, TO DO: fix bugs?
        // ----------------------------------------------------
        function sortDirection(thisTable){      
            if (thisTable.sortingEnabled && typeof thisTable.sortColumn != 'undefined') {
                //if sortOrder === false, the order is descending, so make it ascending
                if(thisTable.sortOrder === false){ 
                    thisTable.sortOrder = true;
                    return "Ascending";
                }
                else{
                    thisTable.sortOrder = false;
                    return "Descending";
                }
            }
            else{               
                thisTable.sortOrder = true;
                return "Ascending";
            }
        };

        // ----------------------------------------------------
        // Show content of array back to Screen
        // ----------------------------------------------------
        function fnShowArray(myArrayofArrays){          
            $('#textOut').append("<br/><b>Dump Table Data: </b><br/>");
            $.each( myArrayofArrays, function( index1, myRow ) {                                            
                $.each( myRow, function( index2, myCell ) {                                         
                    $('#textOut').append(myCell + " - " );
                });
                $('#textOut').append("<br/>");
            });
        };

    }) // end jquery

</script>   

<div id="exampleGrid" class="dataTable"></div>
<div id="textOut" ></div>