Abrufen einer ausgeblendeten Kopfzeile in einer sortierten handsontablen Instanz

Question

Bei Verwendung von Handsontable scheint es schwierig zu sein, die Kopfzeile einer Zeile aus einem Kontextmenü abzurufen.

Betrachten Sie die folgende Datenquelle:

var data = function() { 
return [["1212", "roman", "i", "ii", "iii"], 
     ["3121", "numeric", 1, 2 ,3], 
     ["4126", "alpha", 'a', 'b', 'c']]; 
}; 

Es ist möglich, eine Handsontable Instanz zu erstellen, die alle Daten zeigt aber die ersten beiden „Säulen“, und das hat ein Kontextmenü, wie folgend:

// Settings to display all columns but the first two 
var dataCols = [] 
for(var i=2; i<data()[0].length; i++) { 
    dataCols.push({ data: i }) 
} 

// Instance creation 
var hot = new Handsontable(container, { 
    data: data(), 
    height: 396, 
    colHeaders: true, 
    rowHeaders: false, 
    columns: dataCols, 
    stretchH: 'all', 
    columnSorting: true, 
    contextMenu: { 
    callback: function(key, options) { 
     switch(key) { 
     case 'header_pls': 
     // TODO retrieve the "hidden header" from here  
     break; 
     } 
    }, 
    items: { 
     "header_pls": { 
     name: "Header please?" 
     } 
    } 
    }, 
}); 

die options Parameter aus dem Menü Rückruf Kontext besteht aus zwei Objekten, start und end, die beide eine row und eine col Eigenschaft.

Lassen Sie uns es einfach halten und davon ausgehen, dass immer eine einzelne Zelle ausgewählt wird: start und end sind das gleiche Objekt.

Mit der Handsontable-Methode getSourceDataAtRow ist es dann möglich, den Header aus der Datenquelle (und nicht die an die Instanz gebundenen Daten) abzurufen.

Dies könnte zwar funktionieren, aber wenn die Tabelle durch Klicken auf eine Spaltenüberschrift sortiert wurde, sind die Zeilennummer aus der Datenquelle und die an die Instanz gebundenen Daten nicht mehr dieselben.

Here is an example das zeigt, was das Problem ist.

Es ist unmöglich, eines der zwei ersten Elemente einer Zeile abzurufen, nachdem die Tabelle sortiert wurde.

Habe ich etwas verpasst?

Answer 1

ich Ihr Problem denke, wird eingekocht, wie die reale (physische) Index erhalten nach dem Sortieren. Bitte korrigieren Sie mich, wenn ich falsch liege, denn diese Antwort dreht sich darum.

Folgendes müssen Sie wissen: Wenn Sie den integrierten Sortierer verwenden, sortiert Handson Ihr Datenarray nicht. Dies ist ein Standardverhalten, das für Sie nützlich sein kann oder auch nicht. Unabhängig davon verwendet jede interne Methode von nun an einen so genannten "logischen Index", der nur der neue sortierte Index ist. Die internen Methoden verwenden dann eine Konvertierung vom logischen in den physischen Index, wenn sie versuchen, auf einen Datenpunkt zuzugreifen.

In Ihrem Fall möchten Sie Ihren physischen Index mit Ihrem logischen Index abrufen, damit Sie korrekt auf die Daten zugreifen können.Dies kann mit einer einfachen Funktion erfolgen:

physicalIndex = instance.sortIndex[logicalIndex][0]; 

diese Informationen Angenommen, Sie sollten eine gewisse Logik hinzufügen können, so dass, wenn Sie versuchen, auf die Daten zuzugreifen, so stellen Sie sicher, dass Sie diesen physischen Index umgewandelt verwenden; in meinem Fall überprüfe ich einfach, dass instance.sortIndex nicht undefiniert ist (was ich denke, ist der Fall vor dem Sortieren) und jedes andere Mal diesen Index zuweisen, da auch ohne Sortieren, .

Hoffe, dass hilft!

Answer 2

Ich habe festgestellt, dass Sie einen benutzerdefinierten Renderer zum Ausblenden von Zellen verwenden können.

function customRenderer(instance, td, row, col) { 
    Handsontable.renderers.TextRenderer.apply(this, arguments); 
    if([0, 1].indexOf(col) > -1) { 
     td.style.display = "none"; 
    } 
    return td; 
} 

Mit diesem können Sie die Daten der ausgeblendeten Spalten mit getDataAtCell erhalten, weil Sie die ursprüngliche Datenquelle in der angezeigten Tabelle verwenden. Hier ist die aktualisierte Geige: https://jsfiddle.net/xartok/upc4mcd0/5/

Es gibt ein weiteres Problem, aber mit den Spaltenüberschriften ...