создать ссылку в ячейке таблицы и щелкнуть по ней всплывающее окно с плавающей точкой - PullRequest
Новая
       40

создать ссылку в ячейке таблицы и щелкнуть по ней всплывающее окно с плавающей точкой

1 голос
/ 12 сентября 2011

У меня есть CellTable, и мне нужен столбец с гиперссылками и обработчиками onclick внутри ячеек. 1-й вопрос, что я делаю не так, если у меня есть: 

Column<MyObject, Anchor> linkColumn = new Column<MyObject, Anchor>(
    new AnchorCell()) {
    @Override
    public Anchor getValue(final obj) {
    Anchor link = new Anchor("link");
    link.addClickHandler(new ClickHandler() {
        @Override
        public void onClick(ClickEvent event) {
        Window.alert("clicked ");
        }
    });
    return link;
    }
};
cellTable.addColumn(linkColumn, "link column");

... 

public class AnchorCell extends AbstractCell<Anchor> {
@Override
public void render(Context context, Anchor h, SafeHtmlBuilder sb) {
    sb.append(SafeHtmlUtils.fromTrustedString(h.toString()));
}
}

- но переход по ссылке - ничего не происходит

и 2-й вопрос: что является лучшим способом открыть float (на основе div или около того, не разделенного окна браузера) с текстовым содержимым этого ClickHandler?

Ответы [ 2 ]

1 голос
/ 12 сентября 2011

В CellTable вы не добавляете виджет «Якорь» в таблицу. Вы просто добавляете немного HTML. Ни одна из функций виджета не будет работать так, как обычно, потому что виджет на самом деле отсутствует в таблице .

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

0 голосов
/ 12 сентября 2011

У меня такая же настройка, как и у вас. CellTable (теперь DataGrid) с гиперссылками, но я хочу, чтобы всплывающее окно редактора появлялось, когда пользователь щелкает по ячейке, но не по биту link-y. Если он нажимает на ссылку, я хочу нормальное поведение HTML.

Создайте свой столбец, используя класс ClickableTextCell. Что хранится в камере? Идентификатор строки в моей базе данных пользовательских записей, который включает имя и адрес электронной почты пользователя. Когда я создаю столбец, я перезаписываю метод рендеринга, чтобы информация отображалась в виде ссылки на электронную почту: 

Column<RowType, ColumnType> emailColumn = new Column<RowType, ColumnType>(new ClickableTextCell()){

    @Override
    public void render(Context context, T object, SafeHtmlBuilder sb) {
    /* Code that pulls the value in this column at this row, uses 
     * it to look up the name and the email, then does sb.appendX 
     * to build up the "<a href='emaillink'>name</a>" SafeHtml
     * construction.
     */
    }

 };

На самом деле, у меня есть подкласс Column, но вы поняли идею.

Вуаля, активная HTML-ссылка на вашей странице, но кликабельная текстовая ячейка внизу. Я нашел это намного проще, чем иметь дело с событиями браузера.

Я использую ту же структуру для многих моих клеток. ClickableTextCells внизу и специфичный для типа код рендеринга, чтобы представить его пользователю в ожидаемом формате. В частности, у нас есть поле типа динамического списка выбора, то есть список выбора не известен, пока не произойдет щелчок. Стандартный selectionCell требует, чтобы список пиков был установлен один раз во время сборки, что и привело меня к этому решению. Поэтому вместо стандартного выпадающего списка SelectionCell, который не сработал бы без серьезной работы **, я использую эту технику. Когда срабатывает ClickableTextCell, я установил FieldUpdater для создания всплывающего окна с DataGrid в нем, эта DataGrid перечисляет текущий набор допустимых значений для этого выбора (как определено текущим состоянием базы данных). Когда пользователь делает свой выбор и нажимает кнопку «Сохранить», всплывающее окно закрывается, промежуточное программное обеспечение вызывается для обновления его выбора, обновленные данные строки возвращаются через этот вызов RPC, а возвращаемые данные используются для обновления внутренней базы данных на стороне клиента, который запускает обновление всех ListDataProviders, управляющих DataGrids, который автоматически обновляет основную DataGrid (и любую другую DataGrid, потенциально видимую на экране).

На самом деле, мое решение расширило ClickableTextCell до DoubleClickableTextCell, так что вам нужно дважды щелкнуть, чтобы активировать редактор. Конечно, не обязательно, но он позволяет пользователю бездельничать по сетке, без всплывающих окон перед ним.

** Помимо динамического аспекта, этот динамический выбор может быть очень длинным списком, поэтому выпадающий список - плохой выбор. Лучше представить DataGrid, который пользователь может прокручивать, искать, фильтровать и т. Д.

...