Handsontable löschen mehrerer Zeilen

Ich bin neu Handsontable. Ich bin versucht zu löschen, mehrere ausgewählte Zeilen der Tabelle mit 'getSelected " und " alter' Methoden (remove_row). Aber mit meinem code unten bekomme ich die Fehlermeldung "Auswahl" nicht definiert in Firebug und "Uncaught TypeError: Cannot read property '0' of undefined " in Chrome. Es spielt keine Rolle, welche Zeile ich wählen oder wie viele. Ich bekomme immer noch die Fehlermeldung und es werden keine Zeilen gelöscht. Was mache ich falsch bitte?

    $(document).ready(function () {

    var myData = [
        ["", "Kia", "Nissan", "Toyota", "Honda"],
        ["2008", 10, 11, 12, 13],
        ["2009", 20, 11, 14, 13],
        ["2010", 30, 15, 12, 13]
    ];

    $("#exampleGrid").handsontable({
        data: myData,
        startRows: 5,
        startCols: 5,
        //minSpareCols: 1, //always keep at least 1 spare row at the right
        //minSpareRows: 1, //always keep at least 1 spare row at the bottom,
        rowHeaders: true,
        colHeaders: true,
        contextMenu: true,
        currentRowClassName: 'currentRow',
        currentColClassName: 'currentCol'

    });

    $edit = $('#exampleGrid');

    function editRows() {

        $('#addtop').on('click', function () {
            $edit.handsontable('alter', 'insert_row', 0);
        });

        $('#addbottom').on('click', function () {
            $edit.handsontable('alter', 'insert_row');
        });

        var selection = $edit.handsontable('getSelected');
        $('.deletebutton').on('click', function () {
            $edit.handsontable('alter', 'remove_row', selection[0], selection[2]);
        });

    }

    editRows();
  });

Hier ist meine Geige http://jsfiddle.net/EfhqJ/48/.

Dank.

Gelöst. Ich brauchte zu bewegen getSelected innerhalb der on-handler: $('.deletebutton').auf('click', function () { var Auswahl = $edit.handsontable('getSelected'); if (Auswahl) { $edit.handsontable('alter', 'remove_row', Auswahl[0], Auswahl[2]); } });

InformationsquelleAutor user2483128 | 2013-06-13

handsontable jquery

Ihre "Auswahl" variable ist nicht sichtbar im Rahmen der onClick-handler.

Versuchen Sie "var Auswahl = ..." in der handler-Funktion.
So etwas wie...

    $('.deletebutton').on('click', function () {
        var selection = $edit.handsontable('getSelected');
        $edit.handsontable('alter', 'remove_row', selection[0], selection[2]);
    });

InformationsquelleAutor PostureOfLearning

So wie es momentan steht, getSelected() gibt nichts...

getSelected: function () { 
     //https://github.com/warpech/jquery-handsontable/issues/44 
     //cjl if (selection.isSelected()) { 
     //return [priv.selStart.row(), priv.selStart.col(), priv.selEnd.row(), priv.selEnd.col()]; 
     //} 
     }

das ist ein riesiges problem, da handsontable Referenzen, die Funktion ganz ein bisschen. Allerdings können wir zum Glück mit der afterSelectionEnd Veranstaltung.

afterSelectionEnd (r: Number, c: Number, r2: Number, c2: Number)

Callback ausgelöst nachdem eine oder mehrere Zellen markiert sind (bis auf die Maus).

Parameter:

r Auswahl Startzeile

c Auswahl start Spalte

r2 Auswahl-Ende Zeile

c2 Auswahl-Ende-Spalte

Entsprechend der API,

alter ('remove_row', index: Number, amount: Number (Optional), source: String (Optional))

Entfernen Sie die Zeile(N) am angegebenen index. Standard-Betrag gleich 1

Bedeutet dies in der Bestellung zu verwenden alter('remove_row') wir brauchen nur den index.

Hier ist ein arbeiten demo ich gemacht, um das gewünschte Ergebnis zu erhalten.

HINWEIS:

Aufgrund einer bug, müssen wir hinzufügen, eine gewisse Logik in der afterSelectionEnd event.

JAVASCRIPT:

var myData = [
    ["", "Kia", "Nissan", "Toyota", "Honda"],
    ["2008", 10, 11, 12, 13],
    ["2009", 20, 11, 14, 13],
    ["2010", 30, 15, 12, 13]
    ];

//declare row vars
var row1 = null,
    row2 = null;

var $container = $("#exampleGrid");

$container.handsontable({
    data: myData,
    startRows: 5,
    startCols: 5,
    minSpareCols: 0,
    minSpareRows: 0,
    rowHeaders: true,
    colHeaders: true,
    contextMenu: true,
    afterSelectionEnd: function(x1, y1, x2, y2){

        //add this because of bug
          if( (x1 <= x2 && y1 < y2) || (x1 < x2 && y1 <= y2) || (x1 == x2 && y1 == y2)) {
            row1 = x1;
            if(x1 == 0)
                row2 = parseInt(x2 + 1);
              else
                row2 = x2;
        }
        else if( (x1 >= x2 && y1 > y2) || (x1 > x2 && y1 >= y2)) {
            row1 = x2;
            if(x2 == 0)
                row2 = parseInt(x1 + 1);
              else
                row2 = x1;
        }
        else if(x1 < x2 && y1 > y2) {
            row1 = x1;
            row2 = x2;
        }
        else if(x1 > x2 && y1 < y2) {
            row1 = x2;
            row2 = x1;
        }
    }
});

//gets instance of handsontable
    var instance = $container.handsontable('getInstance');

$('#delete').click(function(){
    if(row1 != null){
        if(row2 != null || row2 != row1 ){
            instance.alter('remove_row', row1, row2);
        }
        else{
            instance.alter('remove_row', row1);
        }
        row1 = null;
        row2 = null;
    }else{
        alert('Please select a cell...');   
    }
});

Hoffe, das hilft und lassen Sie mich wissen, wenn Sie etwas anderes benötigen!

InformationsquelleAutor Dom

0

müssen Sie nur hinzufügen outsideClickDeselects: false um Ihre Möglichkeiten der Konstruktor, dann erhalten Sie das richtige Ergebnis getSelected().

und hier ist die live demo http://jsfiddle.net/czz82kL5/2/

InformationsquelleAutor Michael Lee

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.