How to create Add row in table and save it?

Support
#1

Hi,
I have to create screen like below screen shot but i don’t find any resource to create it.
wirefram

My requirement is once user fill the detail and click to ADD button then items will be add in to below table and after add all the items in table one by one then save it on click to save button.

So how to it means how to connect add button event with table and all the things ?

#3

Hello @bipin.ramani,

I can suggest you the following solution:
Product is a test entity that has type, codeName and region properties.

  1. Create a list where we will store the instances that will be displayed in the table.
private List<Product> productList = new ArrayList<>();
  1. Delegate actual loading for ProductsContainer to productsDlLoadDelegate function, which returns productsList from previous step
@Install(to = "productsDl", target = Target.DATA_LOADER)
protected List<Product> productsDlLoadDelegate(LoadContext<Product> loadContext) {
    return productList;
}
  1. The AddBtn will create an entity using the metadata and then add it to the productList. To display a new element in the Table (update data), you need to call the Data Loader method - productsDl.load() 
@Subscribe("addBtn")
public void onAddBtnClick(Button.ClickEvent event) {
    Product product = metadata.create(Product.class);
    product.setType(typeField.getValue());
    product.setCodeName(codeNameField.getValue());
    product.setRegion(regionField.getValue());

    productList.add(product);
    productsDl.load();
}
  1. The ClearBtn will clear the productList and update the data in the Table
@Subscribe("clearBtn")
public void onClearBtnClick(Button.ClickEvent event) {
    productList.clear();
    productsDl.load();
}
  1. The SaveBtn will save the productsList in the database. Method dataManager.commit returns the set of fresh entity instances just updated in database. Further work should be performed with these returned instances to prevent data loss or optimistic locking.
@Subscribe("saveBtn")
public void onSaveBtnClick(Button.ClickEvent event) {
    CommitContext commitContext = new CommitContext(productList);
    Set<Entity> committedEntities = dataManager.commit(commitContext);
    productList = new ArrayList(committedEntities);
}

I’ve created a test project on 7.1 platform version - add-table-row.zip (85.1 KB)

Regards,
Gleb

2 Likes
#5

Thank you Sooo Muchhhhh Gleb,
I have setup as you have guide and its work.
I learn a lot from your attached example.
thanks :slight_smile: