CellList widget number cannot be over than 25 - gwt

I have working on CellList for weeks now and I find it owesome.
Those days I wish to print a list that contains more than 70 elements but I noticed that my CellList doesn't append more than 25: from 0 to 24. To make sure that the problem has no relashionsip with my project, I decided to test the code in a new and clan project but It has the same result.
Here is my code:
CustomCell bodyCell = new CustomCell();
CellList<String> coreCellList = new CellList<String>(bodyCell);
List<String> list = new ArrayList<String>();
for (int i=0; i<74; i++) {
list.add("hello_"+i);
}
coreCellList.setRowData(0, list);
coreCellList.setRowCount(list.size(), true);
RootPanel.get().add(coreCellList);
and CustomCell:
public class CustomCell extends AbstractCell<String> {
interface Templates extends SafeHtmlTemplates {
String style = "cell";
#SafeHtmlTemplates.Template("<div class=\"" + style
+ "\" style = 'height : 15%'>{0}<br/></div>")
SafeHtml cell(SafeHtml value);
}
private static Templates templates = GWT.create(Templates.class);
#Override
public void render(com.google.gwt.cell.client.Cell.Context context,
String value, SafeHtmlBuilder sb) {
SafeHtml safeValue = SafeHtmlUtils.fromString(value);
SafeHtml rendered = templates.cell(safeValue);
sb.append(rendered);
}
}
Thank you for your help.

I always use the code below passing my CellTables and CellLists when I don't want pagination.
public static void setupOnePageList(final AbstractHasData<?> cellTable) {
cellTable.addRowCountChangeHandler(new RowCountChangeEvent.Handler() {
#Override
public void onRowCountChange(RowCountChangeEvent event) {
cellTable.setVisibleRange(new Range(0, event.getNewRowCount()));
}
});
}

CellList is using paging by default, having a page size of 25. If you add a SimplePager to your page, you can control which data you want to display.
I would advise not to disable paging by setting the page size to the size of your list of data, as you will run into serious performance issues with older browsers (especially IE8 and earlier), depending on the complexity of your presentation and size of the list.
For adding the Pager, see the DevGuide:
// Create a SimplePager.
SimplePager pager = new SimplePager();
// Set the cellList as the display.
pager.setDisplay(cellList);

Related

Adding links to a row in a column on click (CellTable)

I have a CellTable where I want to add several links to a row when I click an add button. Right now Im facing the problem that when I click the add button the link will be added to all rows in that column. Somehow it feels like I only can add things to columns.
// shows project column
final MultipleLinkTextCell projectCell = new MultipleLinkTextCell();
final Column<Booking, String> projectColumn = new Column<Booking, String>(
projectCell) {
#Override
public String getValue(Booking project) {
return "";
}
};
getView().getTimeTable().addColumn(projectColumn, "Tasks");
An Example with Buttons
#Override
protected void render(com.google.gwt.cell.client.Cell.Context context,
SafeHtml data, SafeHtmlBuilder sb) {
String string = "";
for (int i = 0; i < value; i++) {
string += "<button type=\"button\" style=\" height:20px; width:22px\">";
}
sb.appendHtmlConstant(string);
if (data != null) {
sb.append(data);
}
}
Im thinking about to use the Anchor widget because I can handle the placemanager from gwtp with it. But still I dont know how to add widgets to a specific row.
//Update:
I did it like this now, it works, but its better to use the revealmanager. The hardcoded link is kinda bad because I always need to change the reference to the link when I change the webserver. I get a string with several values splitted by a commar.
#Override
protected void render(com.google.gwt.cell.client.Cell.Context context,
SafeHtml data, SafeHtmlBuilder sb) {
String stringData = data.asString();
String[] splitResult = stringData.split(",");
for (int i = 0; i < splitResult.length; i++) {
if (!splitResult[i].equals("")) {
sb.appendHtmlConstant("<div><a href=\"http://127.0.0.1:8888/gwtpTimeTracking.html?gwt.codesvr=127.0.0.1:9997#project;projectid="+splitResult[i].substring(0, 7)+"\">"
+ splitResult[i].substring(0, 7) + "</a></div>");
}
}
You can't use any Widgets in CellWidgets.
However you can create your custom cell that mimics it or create an ActionCell and add a VaueUpdater that fires a PlaceRequest Event.
For adding the link to a specific row you have to add a field (i..e List<String> links) to your DTO that is rendered in your CellTable. When you click on the "Add" button you have to modify the field of the specific DTO in your list.
MyDTO obj = // get the specific DTO from the DataProvider
obj.setLinks(LIST OF LINKS);
In the render method of your custom cell you check the field (i..e links) and either render out the links or not.
Where does the value data in your render method come from ?

GWT CellTable Data Not Displaying

I have the following code in my modules onModuleLoad() method:
List<MyPromo> promotionData = new ArrayList<MyPromo>();
MyPromo promotion1 = new MyPromo(...);
promotionData.add(promotion1);
PromotionTable<MyPromo> promoTable = new PromotionTable<MyPromo>(tableColumns, promotionData);
and
public class PromotionTable <T extends Promotion> extends CellTable<T>{
public PromotionTable(List<ColumnGroup<T>> columns, List<T> data) {
super();
this.setWidth("100%");
this.setHeight("500px");
this.setHeaderBuilder(new PromotionTableHeaderBuilder(columns, this));
this.setFooterBuilder(new PromotionTableFooterBuilder(this));
ListDataProvider<T> dataProvider = new ListDataProvider<T>();
dataProvider.setList(data);
dataProvider.addDataDisplay(this);
}
...
The columns for the CellTable just take properties off the MyPromo object and return a String value to display. However, nothing is displayed in the table, just the column headers. Any idea why this is?
The problem is with the following code
ListDataProvider<T> dataProvider = new ListDataProvider<T>();
dataProvider.setList(data);
dataProvider.addDataDisplay(this);
By the time you do setList, ListDataProvider must know its consumers ie displays (Refer setList implementaion).
So, the order of the code is wrong. First do addDataDisplay and then do setList. It will work.
I was constructing the dataProvider and assigning it to the celltable (or mu extension of) in the constructor. It didn't like this for some reason, when I moved it out it worked.
Here is a simple example of CellTable, SimplePager and ListDataProvider.
CellTable<AlarmDisplayBTO> cellTable= new CellTable<AlarmDisplayBTO>();
TextColumn<AlarmDisplayBTO> dateColumn = new TextColumn<AlarmDisplayBTO>() {
#Override
public String getValue(AlarmDisplayBTO object) {
return object.getDate();
}
};
cellTable.addColumn(dateColumn, "Date");
TextColumn<AlarmDisplayBTO> alarmNameColumn = new TextColumn<AlarmDisplayBTO>() {
#Override
public String getValue(AlarmDisplayBTO object) {
return object.getAlarmName();
}
};
cellTable.addColumn(alarmNameColumn, "Alarm Name");
cellTable.setRowCount(alarmList.size());
// alarmList is an ArrayList<AlarmDisplayBTO> rendered from RPC call
cellTable.setRowData(0, alarmList);
cellTable.setEmptyTableWidget(new Label(" No Records Found"));
ListDataProvider<AlarmDisplayBTO> dataProvider = new ListDataProvider<AlarmDisplayBTO>();
dataProvider.addDataDisplay(cellTable);
dataProvider.setList(alarmList);
SimplePager pager = new SimplePager();
pager.setDisplay(cellTable);
pager.setPageSize(20); // 20 rows will be shown at a time
VerticalPanel vPanel = new VerticalPanel();
vPanel.add(cellTable);
vPanel.add(pager);
setWidget(new ScrollPanel(vPanel));
Hope this may help..

Adding style to a ButtonCell

I know my question is considered initially to refer to the "very novice" level, but I have spent quite o lot of time on searching for the answer. I have used in a gwt application a DataGrid and I have attached a diversity of specific Cell widgets (i.e. TextCell, ButtonCell). My concern is how I can add and handle styling to the button of a ButtonCell through custom css. The code which implements the column of ButtonCells looks like as follows:
Column<FilterInfo, String> delButtonColumn = new Column<FilterInfo, String>(new ButtonCell()) {
#Override
public String getValue(FilterInfo object) {
return "X";
}
};
So, how can I add styling to the button (not to the entire Cell)? I suspect that I should also override the render function, however I cannot figure out how the styling is applied
#Override
public void render(Context context, FilterInfo object, SafeHtmlBuilder sb) {
super.render(context, object, sb);
???
}
You can use the setCellStyleNames() method in Column to apply a style that will be applied to every cell of the column. You have to use GWT 2.4 for this to work. It will probably be something like that. Please note that the code was written outside of any IDE, so it may contain errors.
Column<FilterInfo, String> delButtonColumn = new Column<FilterInfo, String>(new ButtonCell()) {
#Override
public String getValue(FilterInfo object) {
return "X";
}
};
delButtonColumn.setCelLStyleNames("yourStyleName");
And the css :
.yourStyleName.gwt-Button{
//your styling here
}

GWT Header checkbox to check / uncheck all checkboxes in my table

I´ve created an CellTable with the Google Web Toolkit.
I just started using it and my knowledge about it is very small...
However I was searching for a tutorial or just a code example of how to create a checkbox in the CellTable header but everythin I´ve found I didn´t understand or it didn´t worked.
So far I´ve got this code to create a Column for checkboxes and a normal table mostly the same as the Google tutorial for a CellTable:
Column<Contact, Boolean> checkColumn = new Column<Contact, Boolean>(
new CheckboxCell(true, false)) {
#Override
public Boolean getValue(Contact contact) {
return null;
}
};
table.addColumn(checkColumn, SafeHtmlUtils.fromSafeConstant("<br/>"));
table.setColumnWidth(checkColumn, 40, Unit.PX);
Now I´m searching for the code to add a checkbox to the header and how to make it check or uncheck all checkboxes.
Thanks for your time.
From my blog post:
Here is a simple column header that selects/ de-selects all rows in a table. When all rows are checked, the header becomes checked automatically. Clicking the checkbox in the header causes either to select or de-select all rows.
I am using the selection model and the data list provider to do the selection magic. It may not work for everyone.
And here is my custom header:
public final class CheckboxHeader extends Header {
private final MultiSelectionModel selectionModel;
private final ListDataProvider provider;
public CheckboxHeader(MultiSelectionModel selectionModel,
ListDataProvider provider) {
super(new CheckboxCell());
this.selectionModel = selectionModel;
this.provider = provider;
}
#Override
public Boolean getValue() {
boolean allItemsSelected = selectionModel.getSelectedSet().size() == provider
.getList().size();
return allItemsSelected;
}
#Override
public void onBrowserEvent(Context context, Element elem, NativeEvent event) {
InputElement input = elem.getFirstChild().cast();
Boolean isChecked = input.isChecked();
for (TYPE element : provider.getList()) {
selectionModel.setSelected(element, isChecked);
}
}
}
See http://code.google.com/p/google-web-toolkit/issues/detail?id=7014

trying to add some link cell in my GWT cellTable

I am trying to add a Link in my cell table (I just want the item to be underlined and mouse symbol change on hover)
and on click I just want to give a window Alert .
for that i have tried these Options : ( but no luck )
1)
final Hyperlink hyp = new Hyperlink("test", "test");
Column<EmployerJobs, Hyperlink> test = new Column<EmployerJobs, Hyperlink>(new HyperLinkCell())
{
#Override
public Hyperlink getValue(EmployerJobs object)
{
return hyp;
}
};
Problem with option 1 is , it takes me to navigation page "test", whereas I dont want to go any other page i just want a window alert.
2)
Column<EmployerJobs, SafeHtml> test = new Column<EmployerJobs, SafeHtml>(new SafeHtmlCell())
{
#Override
public SafeHtml getValue(EmployerJobs object)
{
SafeHtmlBuilder sb = new SafeHtmlBuilder();
sb.appendEscaped("test");
return sb.toSafeHtml();
}
};
problem with option 2 is I dont know what exactly to return here and its not getting underlined.
3) at last i am trying to add anchor in my celltable with a compositecell(as ideally i want three different anchors in my ONE cell)
final Anchor anc = new Anchor();
ArrayList list = new ArrayList();
list.add(anc);
CompositeCell ancCell = new CompositeCell(list);
Column testColumn1 = new Column<EmployerJobs, Anchor>(ancCell) {
#Override
public Anchor getValue(EmployerJobs object) {
return anc;
}
};
Option 3 is giving some exception .
If you can help me get working any of the above option, I'll be grateful
Thanks
You are doing it totally wrong. You need to use ActionCell for stuff like this or create your own cell. Example code:
ActionCell.Delegate<String> delegate = new ActionCell.Delegate<String>(){
public void execute(String value) { //this method will be executed as soon as someone clicks the cell
Window.alert(value);
}
};
ActionCell<String> cell = new ActionCell<String>(safeHtmlTitle,delegate){
#Override
public void render(com.google.gwt.cell.client.Cell.Context context, //we need to render link instead of default button
String value, SafeHtmlBuilder sb) {
sb.appendHtmlConstant("<a href='#'>");
sb.appendEscaped(value);
sb.appendHtmlConstant("</a>");
}
};
Column testColumn1 = new Column<EmployerJobs, String>(cell) {
#Override
public String getValue(EmployerJobs object) {
//we have to return a value which will be passed into the actioncell
return object.name;
}
};
I recommend to read official documentation for Cell Widgets, since it is pretty much everything what you need to know about cell widgets.