Inline editing in GWT cell table - gwt

I have a cell table in one of my GWT screen. Now requirement is that there will be some button on the screen clicking on which one editable row will be inserted into the cell table. if I am not wrong this is called inline editing.
Can somebody please help me with that? I have just started working in GWT.

Here is very simple example of adding new editable row to the celltable. I hope I understand what you meant :)
public class Test
implements EntryPoint
{
public void onModuleLoad()
{
//create and attach table
final CellTable<A> table = new CellTable<A>();
RootPanel.get().add(table);
//add editable cell
table.addColumn(new Column<A, String>(new TextInputCell())
{
#Override
public String getValue(
A object)
{
return object.getA() == null ? "" : object.getA();
}
});
//put some data
ListDataProvider<A> dataProvider = new ListDataProvider<A>(
Arrays.asList(new A("AAA"), new A("BBB"), new A("CCC")));
dataProvider.addDataDisplay(table);
//add button with click handler
RootPanel.get().add(new Button("add new", new ClickHandler()
{
#Override
public void onClick(
ClickEvent event)
{
//add new object to visible items
List<A> data = new ArrayList<A>(table.getVisibleItems());
A newOne = new A();
data.add(newOne);
table.setRowData(data);
}
}));
}
class A
{
String a;
public A(
String a)
{
super();
this.a = a;
}
public A()
{
super();
}
public String getA()
{
return a;
}
public void setA(
String a)
{
this.a = a;
}
}

Related

How can we filter the table viewer in JFace based on the entered text

I have created a table using table viewer and now i need to filter based on the text entered in the text box so how can we filter the table the code to create table is as follows
TableViewerColumn message = new TableViewerColumn(viewer, SWT.NONE);
message.getColumn().setWidth(800);
message.getColumn().setText("Message");
message.setLabelProvider(new ColumnLabelProvider()
{
#Override
public void update(ViewerCell cell)
{
Object element = cell.getElement();
if(element instanceof MyObject)
{
MyObject obj = (MyObject) element;
cell.setText(obj.getMessage());
}
}
});
}
private static class MyObject
{
private String first;
private String second;
private String message;
public MyObject(String first, String second,String message)
{
this.first = first;
this.second = second;
this.message = message;
}
public String getFirst()
{
return first;
}
public void setFirst(String first)
{
this.first = first;
}
public String getSecond()
{
return second;
}
public void setSecond(String message)
{
this.second = second;
}
public String getMessage()
{
return message;
}
public void setMessage(String message)
{
this.message = message;
}
so now how can we filter the table. Please help me as I am new to jface table viewer
Use a class derived from ViewerFilter to add a filter:
class MyFilter extends ViewerFilter
{
#Override
public boolean select(Viewer viewer, Object parentElement, Object element)
{
MyObject obj = (MyObject)element;
// TODO return true to include the object, false to exclude
}
}
Add this to the table with:
viewer.addFilter(new MyFilter());
Call
viewer.refresh();
to get the viewer to rerun the filter when the text changes.

How to create a Dynamic table in GWTP

I am a new GWTP user and I am not sure how to create a table in GWTP. I know how to make one in GWT.
// Create a CellTable.
CellTable<Contact> table = new CellTable<Contact>();
// Create name column.
TextColumn<Contact> nameColumn = new TextColumn<Contact>() {
#Override
public String getValue(Contact contact) {
return contact.name;
}
};
But This doesn't seem to work in GWTP. Can someone please help me with getting the values on a button press in a GWTP program.
I'm aware you asked this question over a week ago but you may still be stuck on it so here goes. You just have to make sure you put the right bits of logic in the Presenter and View respectively.
It's no different from MVP (Model-View-Presenter) without GWTP in principle:
Your Presenter has the job of getting the data to fill the CellTable, and passing it to the View:
public class TablePresenter extends Presenter<TablePresenter.MyView, TablePresenter.MyProxy>
{
public interface MyView extends View
{
void addData(List<Contact> accounts); // pass data to view
}
// proxy and constructor omitted for brevity...
#Override
protected void onReveal()
{
super.onReveal();
// server action to get contacts
dispatchAsync.execute(new GetContacts(), new AsyncCallback<GetContactsResult>()
{
#Override
public void onSuccess(GetContactsResult result)
{
getView().addData(result.getContacts());
}
});
}
}
Your View has the job of initially setting up the CellTable and its Columns, as well as receiving the data from the Presenter. Here I show a TextColumn and a Column using a ButtonCell:
public class TableView extends View implements TablePresenter.MyView
{
#UiField
CellTable<Contact> table;
// use a dataprovider to hold the data
private ListDataProvider<Contact> dataProvider = new ListDataProvider<Contact>();
// COLUMNS
TextColumn<Contact> nameColumn;
Column<Contact, String> buttonColumn;
#Inject
public AccountsView(Binder uiBinder)
{
initWidget(uiBinder.createAndBindUi(this));
initTable();
}
private void initTable()
{
nameColumn = new TextColumn<Contact>()
{
#Override
public String getValue(Contact object)
{
return object.name;
}
};
// now add the column to the table
table.addColumn(nameColumn, "Name");
buttonColumn = new Column<Contact, String>(new ButtonCell())
{
// the text of the button
#Override
public String getValue(Contact object)
{
return "Delete " + object.name;
}
};
// set the button action
deleteColumn.setFieldUpdater(new FieldUpdater<Contact, String>()
{
#Override
public void update(int index, Contact object, String value)
{
// whatever you want to do when you click the button
Window.alert("You pressed " + object.name);
}
});
fileTable.addColumn(deleteColumn);
// link dataprovider to the table
dataProvider.addDataDisplay(table);
}
#Override
public void addData(List<Contact> contacts)
{
// clear the dataProvider's list
dataProvider.getList().clear();
// pass the data into the list
dataProvider.setList(contacts);
}
}
Then in your UiBinder:
<g:HTMLPanel>
<b:CellTable ui:field="table" />
</g:HTMLPanel>

GWT Data grid does not show data

i have been trying to implement datagrid in my project , the problem is that the data grid does not show data , the data is there but is not visible , i tried to inspect the html page and with adding some height and width to the inner divs inside the datagrid parent div the data is displayed perfectly , i can do this using css and its done , but if there is another solution or in other words anyone knows whats wrong with datagrid?
public class DataGridTest implements EntryPoint, ClickHandler {
private ListDataProvider<TestObject> listProvider;
public void onModuleLoad() {
List<TestObject> list = new ArrayList<TestObject>();
list.add(new TestObject("Amer",22));
list.add(new TestObject("Essa",25));
list.add(new TestObject("Asem",29));
DataGrid<TestObject> dataGrid = new DataGrid<TestObject>();
dataGrid.setStyleName("dataGridTest");
TextColumn<TestObject> nameColumn = new TextColumn<TestObject>(){
#Override
public String getValue(TestObject object) {
return object.getName();
}
};
dataGrid.addColumn(nameColumn,"Name");
TextColumn<TestObject> ageColumn = new TextColumn<TestObject>(){
#Override
public String getValue(TestObject object) {
return object.getAge()+"";
}
};
dataGrid.addColumn(ageColumn,"Age");
listProvider = new ListDataProvider<TestObject>();
listProvider.addDataDisplay(dataGrid);
listProvider.setList(list);
LayoutPanel layoutPanel = new LayoutPanel();
layoutPanel.add(dataGrid);
RootPanel.get().add(layoutPanel);
layoutPanel.forceLayout();
Button btn = new Button("lala");
btn.getElement().getStyle().setPosition(Position.ABSOLUTE);
RootPanel.get().add(btn);
btn.addClickHandler(this);
}
public class TestObject {
private String name;
private int age;
public TestObject(String name, int age) {
this.name = name;
this.age = age;
}
public String getName() {
return this.name;
}
public int getAge() {
return this.age;
}
}
#Override
public void onClick(ClickEvent event) {
listProvider.getList().add(new TestObject("lala", 10));
}
}
You are mixing RootPanel and LayoutPanel, which doesn't work.
You must use RootLayoutPanel instead.
The DataGrid has to be put in a LayoutPanel and there must an unbroken chain up to the RootLayoutPanel.
Alternatively you have to specify explicit dimensions (height, width) on the parent container of your DataGrid or use a CellTable instead.
RootLayoutPanel.get().add(layoutPanel) should fix your issue.

ButtonCell in CellTable footer only works in first column

I have a cell table with a custom button as a footer in one of the columns which works fine. But when I try to move the button to another column the clickevent (valueupdater) of the button does not work anymore. I simply add the button as a footer in another column no changes in the functionality are done! Here is how its done:
public class TestCellTable extends CellTable<Object> {
...
public TestCellTable() {
...
addFirstColumn();
addSecondColumn();
addThirdColumn();
...
}
public static abstract class FooterButton extends Header<String> {
public ButtonFooter(ValueUpdater<String> value) {
super(new ButtonCell());
this.setUpdater(value);
}
}
private Header<String> initButton() {
ValueUpdater<String> updater = new ValueUpdater<String>() {
#Override
public void update(String value) {
Window.alert("TEST");
}
};
Header<String> footer = new FooterButton(updater) {
#Override
public String getValue() {
return "TEST";
}
};
return footer;
}
public void addFirstColumn() {
...
addColumn(COLUMN, HEADER, initButton());
}
public void addSecondColumn() {
...
addColumn(COLUMN, HEADER);
}
public void addThirdColumn() {
...
addColumn(COLUMN, HEADER);
}
}
I just would like to move the button from the first Column to the send column but then when I click the button nothing happens??

JFace Databinding with TreeViewer

I am trying to build a view in my RCP application, the view just contains a TreeViewer.
The tree can contain folders or leafs, a folder can contain folders and leafs. when I add a folder to the back-end data model of the root folder, the UI is updated automatically, but if I add a folder to any branch folder, the UI will not be updated automatically. please tell me what's wrong with my code.
The model class:
public class TreeNode extends BindableObject {
private Folder parent;
private String name;
public String getName() {
return name;
}
public void setName(String name) {
super.firePropertyChange("name", this.name, this.name = name);
}
public Folder getParent() {
return parent;
}
public void setParent(Folder parent) {
this.parent = parent;
}
}
public class Folder extends TreeNode {
private List<TreeNode> children = new ArrayList<TreeNode>();
public List<TreeNode> getChildren() {
return children;
}
public void setChildren(List<TreeNode> children) {
this.children = children;
}
public void add(TreeNode node){
children.add(node);
}
}
the view :
public class ExplorerView extends ViewPart {
private WritableList data;
private TreeViewer treeViewer;
public WritableList getData() {
return data;
}
public TreeViewer getViewer(){
return treeViewer;
}
public ExplorerView() {
// TODO Auto-generated constructor stub
}
#Override
public void createPartControl(Composite parent) {
parent.setLayout(new FillLayout(SWT.HORIZONTAL));
treeViewer = new TreeViewer(parent, SWT.BORDER);
treeViewer.setContentProvider(new ObservableListTreeContentProvider(new ExplorerObservableFactory(), new ExploerTreeStructureAdvisor()));
treeViewer.setLabelProvider(new ExplorerTreeLabelProvider());
ArrayList<TreeNode> list = new ArrayList<TreeNode>();
list.add(new ExplorerDataModel().getElements()[0]);
data = new WritableList(list, TreeNode.class);
treeViewer.setInput(data);
}
#Override
public void setFocus() {
}
}
the ObservableFactory:
public class ExplorerObservableFactory implements IObservableFactory {
#Override
public IObservable createObservable(Object target) {
System.out.println(target.getClass().getName());
if(target instanceof WritableList){
return (WritableList)target;
}
else if(target instanceof Folder){
List<TreeNode> children = ((Folder)target).getChildren();
return new WritableList(children, TreeNode.class);
}
return null;
}
}
the TreeStructureAdvisor:
public class ExploerTreeStructureAdvisor extends TreeStructureAdvisor {
#Override
public Object getParent(Object element) {
return ((TreeNode)element).getParent();
}
#Override
public Boolean hasChildren(Object element) {
if(element instanceof Folder){
return true;
}else{
return false;
}
}
}
the data :
public class ExplorerDataModel {
public TreeNode[] getElements() {
Folder f1 = new Folder();
f1.setName("Database Connections");
Folder f11 = new Folder();
f11.setName("Credit Test");
TreeNode t1 = new TreeNode();
t1.setName("bank#localhost");
f11.add(t1);
t1.setParent(f11);
TreeNode t2 = new TreeNode();
t2.setName("credit#localhost");
f11.add(t2);
t2.setParent(f11);
Folder f12 = new Folder();
f12.setName("Credit Product");
TreeNode t3 = new TreeNode();
t3.setName("nbcbcredit#localhost");
f12.add(t3);
t3.setParent(f12);
TreeNode t4 = new TreeNode();
t4.setName("nbcbcredit_bak#localhost");
f12.add(t4);
t4.setParent(f12);
f1.add(f11);
f11.setParent(f1);
f1.add(f12);
f12.setParent(f1);
return new TreeNode[] { f1 };
}
}
the test command handler:
public Object execute(ExecutionEvent event) throws ExecutionException {
ExplorerView v =(ExplorerView) HandlerUtil.getActiveWorkbenchWindow(event).getActivePage().findView("com.amarsoft.dmp.explorer.explorerView");
Folder f = new Folder();
f.setName("ODA Flat Files");
v.getData().add(f);
Folder f1 = (Folder) v.getData().get(0);
f1.setName("Database Connections (3)");
Folder f2 = new Folder();
f2.setName("Report Test");
f1.add(f2);
return null;
}
if I execute above command, the added folder "ODA Flat Files" will appear in the tree immediately, but the added folder "Report Test" will not be there, if call TreeViewer#refresh() everything is ok, but I want to know why.
Modifying your model does not notify your tree. Refresh is one way of telling the tree that the data has changed and it needs to update. If you go through the java doc for jface viewers in eclipse you will find the following quote
To handle structural changes, use the refresh methods instead.
It seems you misconfigured the data binding...
Have a look at the official snippets:
With a List Factory
With a Set Factory
With a more than a list as Factory
Have fun! (without any refresh ;-) )
ps. for EMF just look at this: http://tomsondev.bestsolution.at/2009/06/08/galileo-emf-databinding-%E2%80%93-part-3/
In your ExplorerObservableFactory replace
... else if(target instanceof Folder){
List<TreeNode> children = ((Folder)target).getChildren();
return new WritableList(children, TreeNode.class);
}
by following
else if(target instanceof Folder){
return BeansObservables.observeList(target, "children");
}
If you return WritableList here, the contentProvider's listener is registered on it (it should be registered on the Folder bean instead)