从 jqueryUI 可排序数组重新排序表

Question

我在 <ul> 上使用 jQuery ui 可排序，其 id 的增量从 0 到 16。它创建了一个这样的数组。

var arr = ["1", "2", "4", "5", "6", "3", "10", "7", "8", "9", "17", "11", "12", "13", "14", "15", "16"] 

我有一个方法可以将列表传递给它。目前我正试图将列移动到新位置，但我很确定它不会工作，我将不得不重新粉刷表格。方法如下。

 positionColumns: function(list) {
            var _this = this;
            if (!list) list = this.order;
            $(list).each(function(i, val) {
                if (parseInt(val, 10) !== _this.order[i]) {
                    work(val, _this.order[i]);
                    console.log(list);
                    console.log(_this.order[i]);
                } else {
                    return;
                }
            });

            function work(from, to) {
                var table = $('#dealbook-table');
                var rows = $('tr', table);
                var cols;
                rows.each(function(i, row) {
                    cols = $(row).children('th, td');
                    console.log(cols);
                    cols.eq(from).detach().insertBefore(cols.eq(to));
                });
            }
},

this.order是拖放前表格的状态。

任何见解将不胜感激。

Answer 1

我想通了。

positionColumns: function(list) {

            var _this = this;

            var table = document.getElementById("dealbook-table");
            reorderColumn(table, list, this.order);

            function reorderColumn(table, order0, order1) {
                // Turn order keys into arrays
                // order0 = order0.split('');
                // order1 = order1.split('');
                if (order0.length != order1.length) return;

                // Check arrays have same elements
                var x = order0.concat().sort().join('');
                var y = order1.concat().sort().join('');
                if (x != y) return;

                // Re-order the columns
                var j, k = i = order0.length;
                while (i--) { // Compare each key
                    if (order0[i] != order1[i]) { // If one out of order
                        j = newIdx(order0[i], order1) // Find new spot
                        moveColumn(table, i, j); // Move the column
                        moveEl(order0, i, j); // Move the key
                        i = k; // Start key comparison again
                    }
                }
            }

            // returns the position of element el in array ar
            // Assumes el is in ar

            function newIdx(el, ar) {
                var i = ar.length;
                while (ar[--i] != el) {}
                return i;
            }

            // Move a column of table from start index to finish index
            // Assumes there are columns at sIdx and fIdx

            function moveColumn(table, sIdx, fIdx) {

                var row, cA;
                var i = table.rows.length;
                while (i--) {
                    row = table.rows[i];
                    var x = row.removeChild(row.cells[sIdx]);
                    row.insertBefore(x, row.cells[fIdx]);
                }

                // Move fixed header

                var ele = $('.th-fixed').eq(sIdx).remove();
                ele.insertBefore($('.th-fixed').eq(fIdx));

            }

            // Move element in array ar from index i to index j
            // Assumes array has indexes i and j

            function moveEl(ar, i, j) {
                var arr = _this.order;
               var x = arr.splice(i, 1)[0];
                arr.splice(j, 0, x);
                return arr; // Not needed, handy for debug
            }

        },