Umgang mit onClick für ein Kontrollkästchen in einer CellTable-Header

Ich versuche zum erstellen einer CellTable, dass eine Spalte mit text und eine checkbox, die verwendet werden, als ein wählen Sie alle Kontrollkästchen (siehe Zeichnung unten, "cb" ist markiert). Momentan benutze ich eine Klasse abgeleitet von Kopf-und überschreiben Sie die Methode render zur Ausgabe von text und einer checkbox. Ich bin übergeordnete onBrowserEvent() ist es jedoch nur geben mir die onChange-events, das würde funktionieren, außer, dass die checkbox nicht richtig funktionieren. Hat jemand irgendwelche Ideen dazu?

+-------+------------+
| col 1 | Select All |
|       |     cb     | 
+-------+------------+
| row 1 |     cb     |
+-------+------------+

Probleme ich habe mit der checkbox ist, dass, wenn es nicht aktiviert ist, müssen Sie klicken Sie doppelt, um das Häkchen zu erscheinen (zumindest in Chrome), obwohl es in der "checked" - Eigenschaft true ist das erste mal. Ein Klick, deaktiviert es richtig.

Hier einige code:

Setup der CellTable Spalten:

/** Setup the table's columns. */
private void setupTableColumns() {
    //Add the first column:
    TextColumn<MyObject> column1 = new TextColumn<MyObject>() {
        @Override
        public String getValue(final MyObject object) {
            return object.getColumn1Text();
        }
    };
    table.addColumn(macColumn, SafeHtmlUtils.fromSafeConstant("Column1"));

    //the checkbox column for selecting the lease
    Column<MyObject, Boolean> checkColumn = new Column<MyObject, Boolean>(
            new CheckboxCell(true, false)) {
        @Override
        public Boolean getValue(final MyObject object) {
            return selectionModel.isSelected(object);
        }
    };

    SelectAllHeader selectAll = new SelectAllHeader();
    selectAll.setSelectAllHandler(new SelectHandler());
    table.addColumn(checkColumn, selectAll);
}

Meine Wählen Sie Alle Header:

public static class SelectAllHeader extends Header<Boolean> {
    private final String checkboxID = "selectAllCheckbox";
    private ISelectAllHandler handler = null;

    @Override
    public void render(final Context context, final SafeHtmlBuilder sb) {
        String html = "<div>Select All<div><input type=\"checkbox\" id=\"" + checkboxID + "\"/>";

        sb.appendHtmlConstant(html);
    }

    private final Boolean allSelected;

    public SelectAllHeader() {
        super(new CheckboxCell());

        allSelected = false;
    }

    @Override
    public Boolean getValue() {
        Element checkboxElem = DOM.getElementById(checkboxID);

        return checkboxElem.getPropertyBoolean("checked");

    }

    @Override
    public void onBrowserEvent(final Context context, final Element element, final NativeEvent event) {
        Event evt = Event.as(event);
        int eventType = evt.getTypeInt();

        super.onBrowserEvent(context, element, event);

        switch (eventType) {
            case Event.ONCHANGE:
                handler.onSelectAllClicked(getValue());
                event.preventDefault();
                break;

            default:
                break;
        }

    }


    public void setSelectAllHandler(final ISelectAllHandler handler) {
        this.handler = handler;
    }

}
  • Haben Sie eine Lösung gefunden, doch für diese? Wenn nicht, sehen, ob meine Antwort hilfreich ist.
  • Leider bin ich nicht mehr in das Projekt involviert, die Lösung, die Sie verfasst unten sieht aus wie es funktionieren sollte.
  • Sie sind immer noch erlaubt, um Sie zu markieren, wie die akzeptierte Antwort, auch wenn Sie nicht verwenden können es nicht mehr 🙂
  • Sorry, ich wusste nicht, markieren Sie es so akzeptiert, weil ich es noch nicht versucht, und ich habe es nicht sehen Rori ' s Kommentar, dass es funktioniert. Ich markiert es als angenommen. Vielen Dank für die Zeit nehmen, zu Antworten.
Schreibe einen Kommentar