trying to add some link cell in my GWT cellTable - gwt

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.

Related

Smart GWT List Grid - Setting a hilite to a list grid on record click

I'm trying to set a hilite inside the record click handler of the list grid. I have tired the following code,
My hilites are as follows,
public static Hilite[] getWayBillSetHilites() {
return new Hilite[]{
new Hilite() {
{
setFieldNames("RECORD_VIEWED_STATUS");
setCriteria(new Criterion("RECORD_VIEWED_STATUS", OperatorId.EQUALS, "TRUE"));
setCssText(Constant.Css.TEXT_ITALIC_GRAY_32);
setTextColor("font-style:italic;color:#525252;");
setId("0");
}
}
};
}
record click handler of the grid appears as follows,
grid.addRecordClickHandler(new RecordClickHandler() {
#Override
public void onRecordClick(RecordClickEvent recordClickEvent) {
//gridWayBillSetGrid.getHiliteState()
//make RECORD_VIEWED_STATUS value "true"
recordClickEvent.getRecord().setAttribute("RECORD_VIEWED_STATUS", true);
gridWayBillSetGrid.enableHilite("0", true);
}
});
But when I click on the record, the styles are not showing up.
Please be kind to advise on this.
I think it's the wrong use case for hilites. Use getCellCSSText instead.
Try this one (override getCellCSSText method of ListGrid class):
ListGrid grid = new ListGrid(...){
#Override
protected String getCellCSSText(ListGridRecord record, int rowNum, int colNum) {
if("true".equalsIgnoreCase(record.getAttribute("RECORD_VIEWED_STATUS"))){
return "font-style:italic;color:#525252;";
}
return super.getCellCSSText(record, rowNum, colNum);
}
};

GWT CellTable: How to Update A TextBox Dynamically

I have the following CellTable
When the user clicks the Pay Min. CheckBox, it should copy the value from the Due Now column over to the Pay Today text field AND recalculate the total for the Pay Today column.
Here is the code for the CheckboxCell (Pay Min.) and the TextInputCell (Pay Today) columns:
private Column<AccountInvoice, Boolean> buildPayMin() {
columnPayMin = new Column<AccountInvoice, Boolean>(new CheckboxCell(true, false)) {
#Override
public Boolean getValue(AccountInvoice object) {
return object.isPayMinimum();
}
#Override
public void onBrowserEvent(Context context, Element elem, AccountInvoice object, NativeEvent event){
// Get event type
int eventType = Event.as(event).getTypeInt();
// See if this is a 'change' event
if (eventType == Event.ONCHANGE) {
String value = columnMinDue.getValue(object);
// Get the cell to copy the value from
TextInputCell cell = (TextInputCell) columnPayToday.getCell();
// Re-create the view data for the cell
TextInputCell.ViewData viewData = new TextInputCell.ViewData(value);
cell.setViewData(object, viewData);
// Refresh
cellTable.redraw();
event.preventDefault();
event.stopPropagation();
}
}
};
columnPayMin.setDataStoreName(columnPayMinHeader);
columnPayMin.setHorizontalAlignment(HasHorizontalAlignment.ALIGN_CENTER);
columnPayMin.setVerticalAlignment(HasVerticalAlignment.ALIGN_MIDDLE);
return columnPayMin;
}
// -----------------------------------------------------------
private Column<AccountInvoice, String> buildPayToday() {
columnPayToday = new Column<AccountInvoice, String>(new TextInputCell()) {
#Override
public String getValue(AccountInvoice object) {
return object.getPaymentAmount();
}
};
columnPayToday.setDataStoreName(columnPayTodayHeader);
columnPayToday.setFieldUpdater(new FieldUpdater<AccountInvoice, String>() {
#Override
public void update(int index, AccountInvoice object, String value) {
object.setPaymentAmount(value);
cellTable.redraw();
}
});
return columnPayToday;
}
I can get the value to copy over, but the total for the Pay Today column doesn't refresh. It seems to refresh only when a value is manually entered into the Pay Today text field. I even tried doing:
columnPayToday.getFieldUpdater().update(context.getIndex(), object, value);
which didn't help either.
Thanks for any help you might provide.
ViewData represents a temporary value in your TextInputCell. When you call cellTable.redraw(), the TextInputCell reverts to the original value (the one from getValue() method for that column).
Do not redraw the table if you want to modify only the "view" state of TextInputCell, or call accountInvoice.setPayToday# (or whatever method is there) to update the object and then call refresh() on your ListDataProvider (which is a more efficient way to update a table compared to redraw).

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 SelectionModel can not deselect item after editing

Hello I have a Contact class with informations which i show in a CellTable.
The CellTable has a DataListProvider, MultiSelectionModel and KeyProvider
which checks the id of the Contact.
DataListProvider and CellTable have the same KeyProvider.
if i only select/deselect the items in the CellTable and show them in a TextBox ists working fine. But the when i change the value of the Contact item in the TextBox(Contact instance) and try to deselect the item the selectionmodel says its still selected?
I tried with clear() but its still selected!
GWT 2.5 / FireFox
ProvidesKey<Contact> keyProvider = new ProvidesKey<Contact>(){
#Override
public Object getKey(Contact item) {
return item.getIdContact();
}
};
public MyCellTable(boolean canLoad, Integer pagesize, ProvidesKey<T> keyProvider) {
super(-1, resource, keyProvider);
selectionModel = new MultiSelectionModel<T>();
selectionModel .addSelectionChangeHandler(new SelectionChangeEvent.Handler() {
#Override
public void onSelectionChange(SelectionChangeEvent event) {
selectionChange();
}
});
dataProvider = new ListDataProvider<T>(keyProvider);
dataProvider.addDataDisplay(this);
}
in the selection event i call
protected void selectionChange(){
Contact c = grid.getGrid().getSelectedItem();
if(c != null){
cpForm.enable();
cpForm.clear();
form.bind(c); // Formular which updates the selected instance
cpForm.add(form);
}else{
cpForm.disable(noseletionText);
}
}
i have no ValueUpdater
when i select an item i generate a formular and if i change something i call:
#Override
public void save() {
super.save();
ContactServiceStore.get().updateContact(manager.getBean(),
new MyAsyncCallback<Void>() {
#Override
public void onSuccess(Void result) {
onchange();
}
});
}
i if call the method without changes on the contact its still working and i can deselect but when i change the name or something else i cant select other items or deselect the current item!
You're not actually using your ProvidesKeys in your MultiSelectionModel. You need to create your MultiSelectionModel like so:
MultiSelectionModel<T> selectionModel = new MultiSelectionModel<T>(keyProvider);
If you don't supply the MultiSelectionModel with a ProvidesKey it will use the actual object as a key.
Make sure you also add the MultiSelectionModel to the table:
cellTable.setSelectionModel(selectionModel);
The reason selectionModel.clear() wasn't working was because selectionModel was not set to the table.

GWT (Cell Widgets): CheckBoxes with Labels in CellList

I want to build a CheckBox List like...
|===========|
| x label0 |
| x label1 |
| x label2 |
|===========|
...using CellList and I've done the following:
final List<Boolean> checks = Arrays.asList(true, false, true, true, false);
final CheckboxCell checkboxCell = new CheckboxCell();
final CellList<Boolean> checkBoxCellList = new CellList<Boolean(checkboxCell);
checkBoxCellList.setRowData(checks);
...so I get:
|=======|
| x |
| x |
| x |
|=======|
But how can I supply not only the value of a CheckBox (Boolean) but also its
label like it's possible with
CheckBox#setText("label0")
CheckBox#setValue(true)
?
I have done a similar thing for CellTable. So maybe SOMETHING like this will work. You need to provide your own render() method. So in the render() method below, you can add whatever you want.
Column<MyJSONObject, String> selectCheckBoxColumn =
new Column<MyJSONObject, String>(new MyCheckBoxCell()) {
#Override
public String getValue(MyJSONObject object) {
return object.getInternalId() + SEPERATOR + "true";
}
};
MyCellTable.addColumn(selectCheckBoxColumn, "Display title");
.....
.....
.....
private class MyCheckBoxCell extends AbstractCell<String> {
#Override
public void render(Context context, String value, SafeHtmlBuilder sb) {
// ##############################################
String[] values = value.split(SEPERATOR);
// NOW values[0] contains the string value
// AND values[1] contains the boolean value
// ##############################################
sb.appendHtmlConstant("<input type='checkbox' name='" + htmlDOMId1 + "'" +
" id='" + htmlDOMId1 + "'" +
" value='" + value + "'" +
"></input>");
}
}
I know this question is old but I've just done this, so thought I would provide an answer anyway.
A CellList can only hold a vertical list of a single cell type. If you want to have a Checkbox in there, along with some other data, you need to build a custom cell and extend CompositeCell, which will combine and render multiple cells inside a single cell. You can see this in action here in the GWT Showcase (the innermost cell in the CellTree).
So your code should look something like this:
// first make a list of HasCell type - MyClass is the type of object being displayed in the CellList (could be String for simple labels)
List<HasCell<MyClass, ?>> hasCells = new ArrayList<HasCell<MyClass, ?>>();
// then add your checkbox cell to it
hasCells.add(new HasCell<MyClass, Boolean>()
{
private CheckboxCell cell = new CheckboxCell(true, false);
public Cell<Boolean> getCell()
{
return cell;
}
public FieldUpdater<MyClass, Boolean> getFieldUpdater()
{
return null;
}
#Override
public Boolean getValue(MyClass object)
{
return selectionModel.isSelected(object);
}
});
// then add your TextCell
hasCells.add(new HasCell<MyClass, MyClass>()
{
private TextCell cell = new TextCell(myString);
#Override
public Cell<MyClass> getCell()
{
return cell;
}
public FieldUpdater<MyClass, MyClass> getFieldUpdater()
{
return null;
}
public MyClass getValue(MyClass object)
{
return object;
}
});
// now construct the actual composite cell using the list (hasCells)
Cell<MyClass> myClassCell = new CompositeCell<MyClass>(hasCells)
{
#Override
public void render(Context context, MyClass value, SafeHtmlBuilder sb)
{
sb.appendHtmlConstant("<table><tbody><tr>");
super.render(context, value, sb);
sb.appendHtmlConstant("</tr></tbody></table>");
}
#Override
protected Element getContainerElement(Element parent)
{
// Return the first TR element in the table.
return parent.getFirstChildElement().getFirstChildElement().getFirstChildElement();
}
#Override
protected <X> void render(Context context, MyClass value, SafeHtmlBuilder sb, HasCell<MyClass, X> hasCell)
{
// this renders each of the cells inside the composite cell in a new table cell
Cell<X> cell = hasCell.getCell();
sb.appendHtmlConstant("<td>");
cell.render(context, hasCell.getValue(value), sb);
sb.appendHtmlConstant("</td>");
}
};
// then make the actual cellList, passing the composite cell
myList = new CellList<MyClass>(myClassCell);
// add selectionModel, making sure to pass in a checkBoxManager as a second parameter, or the selectionModel will not work
myList.setSelectionModel(selectionModel, DefaultSelectionEventManager.<MyClass> createCheckboxManager());
// construct a dataProvider for dynamic editing of the list (alternative to list.setRowData())
dataProvider = new ListDataProvider<MyClass>(data);
// associate the dataProvider with the CellList
dataProvider.addDataDisplay(myList);
The easiest way to do this is to use a CellTable and dont add column headings (so it looks like a CellList)
Have a column for the checkbox (using CheckBoxCell) and have a column for your other data.
This is the cleanest way. No mucking around with your own custom cells with html-checkboxes inside of them.
This also works well with things like having a MultiSelectionModel on the cell table to get the values of the checkboxes.
A GWT book I'm reading has an example of this, except the author uses a vertical panel with checkboxes in the panel. With a little styling, you have a listbox look