Как сделать однорядное расширение со Celectable?

Question

Я пытаюсь использовать новый виджет GWT Vicletable, но мой стол должен поддерживать однократное расширение ряд, т. Е. Есть Zippy слева от ряд и когда он нажат, строка должна расширяться, чтобы обеспечить более подробную информацию, и эта строка должна предоставлять более подробную информацию промежуток во всех столбцах. Можно ли достичь этого с помощью Clextable? Как добавить ряд, которая проверяет все столбцы между другими рядами динамически?

Любая помощь будет оценена!

Answer 1

GWT 2.5 добавит CellTableBuilder с точной целью допустить такого рода вещей.

Вы можете найти живой пример в http://showcase2.jlabanca-testing.appspot.com/#!CwcustomdataGrid (нажмите на клетки «Показать друзей»)

Answer 2

Можете ли вы сделать дополнительную строку невидимой, используя getRowElement(int row) И использование методов DOM для установки дисплея «NOTE» при отображении и как пустым, когда кнопка, чтобы показать ее, удается.

Answer 3

Я тоже работаю над решением, и на данный момент мой план - использовать CSS-классы + ручные стили манипуляции для того, чтобы он выглядел так, как мне нужно. Не уверен, смогу ли я веселиться с GWT, хотя: http://jsfiddle.net/7wfcf/

Answer 4

Я взял другой подход к решению этой же проблемы.

Основная концепция использует элементы DOM для добавления и удаления строк на основе события. Следующий код является абстрактным расширением Ceartable. Вы захотите вызвать этот метод с вашего мероприятия, который уволен из щелчка, чтобы расширить строку.

import com.google.gwt.dom.client.Document;
import com.google.gwt.dom.client.Element;
import com.google.gwt.dom.client.NodeList;

public abstract class ActionCellTable<T> extends CellTable<T> {
    protected abstract void addActionsColumn();

Integer previousSelectedRow = null;

public void displayRowDetail(int selectedRow, Element e){
    //Get the tbody of the Cell Table
    //Assumption that we want the first (only?) tbody.
    Element tbody = this.getElement().getElementsByTagName("tbody").getItem(0);
    //Get all the trs in the body
    NodeList<Element> trs = tbody.getElementsByTagName("tr");

    //remove previously selected view, if there was one
    if(previousSelectedRow!=null){
        trs.getItem(previousSelectedRow+1).removeFromParent();
        //If the current is further down the list then the current your index will be one off.
        if(selectedRow>previousSelectedRow)selectedRow--;
    }
    if(previousSelectedRow==null || selectedRow != previousSelectedRow){// if the are equal we don't want to do anything else
        Element td = Document.get().createTDElement();
        td.setAttribute("colspan", Integer.toString(trs.getItem(selectedRow).getChildNodes().getLength()));
        td.appendChild(e);

        Element tr = Document.get().createTRElement();
        tr.appendChild(td);
        tbody.insertAfter(tr, trs.getItem(selectedRow));
        previousSelectedRow=selectedRow;
    } else {
        previousSelectedRow=null;
    }
}

}

Предыдущий Селезельроу используется для отслеживания того, какой элемент «расширен», это, вероятно, может быть достигнуто с помощью классов или идентификаторов. При необходимости я могу уточнить больше на сотовой, событиях, взглядах и мероприятиях.