SAUI5 Responsive Table Two-way Binding and Growing Feature

[jens_borau]

In SAPUI5 I use the responsive table (in XML view) a lot and always use the two-way binding. Often the number of rows to be shown is over the standard binding size limit of 100.

To show all table rows one option would be to use the "growing" feature of the table.

But on SAPUI5 Explored you will find: "Growing must not be used together with two-way binding."

So, one of my questions is why?

The other option is to set the size limit of the model (oData model with items binding to the table).

So, my other question is where or when (in the lifecycle) do I set the size limit?

In the onInit function it seems to be to early (model not available) and in the onUpdateFinished function it seems to be to late, because the standard 100 rows of the table are ready rendered.

I have a workaround where I attach a event for one time run at updateFinished:

var that = this,oTable.attachEventOnce("updateFinished", function() {
  oViewModel.setProperty("/tableBusyDelay", iOriginalBusyDelay);     
  that.getModel().setSizeLimit(300);   
  var oBinding = that.getView().byId("table").getBinding("items");   
  var oFilter = new CustFilter("Lifnr", FilterOperator.Contains, "", "", "");   
  oBinding.filter(oFilter, "Application");   
  oBinding.filter([], "Application");
});

I set an Filter on the Binding and directly delete this filter. The table binding is refreshed and my changed size limit is used.

It works, but it is not very elegant.

[former_member365727]

you can also set the limit at the time of binding in XML instead of using sizelimit...

i did a small test using Northwind oData Service for the entity 'Orders' which has a total count of 830

In the below sample I'm retrieving 400 entries through binding in XML

   	<Table growing="true" growingScrollToLoad="false" inset="false"
   					class="sapUiSizeCompact"
   					items="{path: 'invoice>/Orders',
   							parameters: {
   								operationMode: 'Auto',
   								threshold: 400
   							}
   						}">
   		<columns>
   			<Column width="12em">
   				<Text text="Order ID" />
   			</Column>
   			<Column width="12em">
   				<Text text="Customer ID" />
   			</Column>
   		</columns>
   		<items>
   			<ColumnListItem>
   				<Text text="{invoice>OrderID}" />
   				<Text text="{invoice>CustomerID}" />
   			</ColumnListItem>
   		</items>
   	</Table>

'items' binding now has two parameters 'operationMode' and 'threshold'. Both parameters are to be used together as per the documentation.

operationMode: Auto --> this makes sure that if data is available in the model then another request wont be sent

threshold: 400 --> no. of entries to be retrieved for each request

[jens_borau]

The problem is not that the items are not fetched via oData. They are available in my model, but not shown at once in the table. So "threshold" seems to be relevant for the HTTP request but size limit refers to the binding between table and model.

[former_member365727]

yes, threshold for UI table is better option to show more data without scrolling

[former_member227918]

first- indexing issue

second- in component or menifest file while initialisation of model

[jens_borau]

What is the parameter name for the model's "size limit" in the manifest.json?

[former_member227918]

I never tried from manifest file, done in component file only, but you can give a try if its works,

define sizelimit parameter where we use defaultbindingmode and all.

"settings": {
"defaultBindingMode": "TwoWay",
.......
"sizeLimit":"1000"
},

[jens_borau]

manifest.json is not working, but Component.js is working fine.

Thanks!

[junwu]

once the model is created, you can set the limit. it didn't work for you?