Table rowHeader column does not send HeaderClick event

Vaadin 6 / 7 / 8
1

I’m trying to create select all functionality based on rowHeader header column click.
Firstly I create new css rules to show selected or no selected “checkbox” in row level

.v-table table tr .v-table-cell-content-rowheader {background:url('img/table/unchecked.gif') no-repeat 50% 50%;}
.v-table table tr.v-selected .v-table-cell-content-rowheader {background:url('img/table/checked.gif') no-repeat 50% 50%;}

In header i create styles "checked " and “unchecked” + css rules

.v-table-unchecked td.v-table-header-cell-rowheader div.v-table-caption-container {background:url('img/table/unchecked.gif') no-repeat 50% 50%;}
.v-table-checked td.v-table-header-cell-rowheader div.v-table-caption-container {background:url('img/table/checked.gif') no-repeat 50% 50%;}

Then I set row header column visible by setting

table.setRowHeaderMode(RowHeaderMode.ICON_ONLY);

and register headerClickLister

table.addHeaderClickListener(new HeaderClickListener() {
  private static final long serialVersionUID = 1L;
 
  @Override
  public void headerClick(HeaderClickEvent event) {
    if (event.getPropertyId() == null) {
       //select all rows applicationdata contains info all selected or not
       removeStyleName("checked");
       removeStyleName("unchecked");
       if(getData()){
           setData(false);
           addStyleName("unchecked");
           return;    
       }
       setData(true);
       addStyleName("checked");
       setValue(getItemIds());
    }
  }
});

Wild guess was that property id is null when rowHeader was clicked because I can set rowHeader column width by setting
table.setColumnWidth(null, 20);
This info comes from
https://vaadin.com/forum#!/thread/550933

…but headerClick() was never invoked when rowHeader header column was clicked. Other header columns send click event just like expected.

I made some client side debug and notice that normal header column send event to the server by invoking method HeaderCell.fireHeaderClickedEvent(Event) but rowHeader header column never invoke this method.
Is this bug or something else?

2

The HeaderClickListener listenes for clicks on the
column header
, not the row header, as the javadoc states:

/**
 * Interface for the listener for column header mouse click events. The
 * headerClick method is called when the user presses a header column cell.
 */

I suppose the listener you ar searching for is
ItemClickListener
.

3

[code]
public class RowHeadersHeaderCell extends HeaderCell {

    RowHeadersHeaderCell() {
        super(ROW_HEADER_COLUMN_KEY, "");
        updateStyleNames(VScrollTable.this.getStylePrimaryName());
    }

    @Override
    protected void updateStyleNames(String primaryStyleName) {
        super.updateStyleNames(primaryStyleName);
        setStyleName(primaryStyleName + "-header-cell-rowheader");
    }

    @Override
    protected void handleCaptionEvent(Event event) {
        // NOP: RowHeaders cannot be reordered
        // TODO It'd be nice to reset sorting here
    }
}

[/code]ItemClickListener events are not sent when you click header or footer row thats why I like to use HeaderClickListener.

I debug more and reason why event never sent is that RowHeadersHeaderCell class overrides handleCaptionEvent method and there is only null implementation coded. As comment says reorder is not needed but someone may want do something when icon column header cell is clicked.

4

I think that working patch to support this functionality is quite easy.

public class RowHeadersHeaderCell extends HeaderCell {
...
        @Override
        protected void handleCaptionEvent(Event event) {
             if (event.getTypeInt() == Event.ONMOUSEUP
                    || event.getTypeInt() == Event.ONDBLCLICK) {
                fireHeaderClickedEvent(event);
            }
        }
}

Dev ticket
http://dev.vaadin.com/ticket/13006

5

Component extension was our saver in this case.
We create (THX to Vaadin Ltd) table extension where we register new event handler to the table.
Extend method in connector class

@Override
protected void extend(ServerConnector target) {
  final TableConnector connector = (TableConnector) target;
  final VScrollTable table = connector.getWidget();
  handler = Event.addNativePreviewHandler(new Event.NativePreviewHandler() {
  @Override
  public void onPreviewNativeEvent(Event.NativePreviewEvent event) {
    Element target = Element.as(event.getNativeEvent().getEventTarget());
    if ((event.getTypeInt() == Event.ONCLICK)
        && (target.getClassName().contains("v-table-header-cell-rowheader")
        || ((target.getParentElement() != null)
             && target.getParentElement().getClassName().contains("v-table-header-cell-rowheader")))
        && table.getElement().isOrHasChild(target)) {
      getRpcProxy(TableRowHeaderColumnHeaderClickExtensionServerRpc.class).rowHeaderColumnHeaderClicked();
}
}
});
}
6

hi vesa tuononen

give me a sample detail code for checkbox in table header

7

@ Vesam could you please add the complete code for extending table?

Or anyone else? I have no idea how to do that.

8

hey ,

   how do i change css( say change background colour) for perticular header cell when  it is clicked 

   please help me out... thank you