cancel
Showing results for 
Search instead for 
Did you mean: 

Issue with SAPUI5 Table cell value state disappear

Former Member
0 Kudos

Please have a look at this link for more details in stackoverflow and if it doesn't work please copy paste the url below. I have asked this question in more details over there. C

https://stackoverflow.com/questions/50312139/sapui5-table-cell-value-state-disappear

I am adding controls to SAPUI5 table column items via the controller using factory function so that I can apply cross-field validation along with standard control validations. Now the validation is working fine it shows the error message with the red coloured border, but when I move to next control, validation state of control disappear. I noticed that it is happening due to some internal functionality of SAPUI5 where it re-render the table body element of the table in the HTML dom explorer which also get rid of the error classes applied to control. It occurs for the first time, but when I try to change the value again of the same control with an invalid data, it displays the error and keeps the value state with the red border.

Accepted Solutions (0)

Answers (4)

Answers (4)

amita_jain2
Participant
0 Kudos

facing issue in sap.ui.table i have combox box when i validate and setValueState(error) and scroll the table up and down same error state is visible for next correct item

former_member365727
Active Contributor
0 Kudos

why don't you use sap.m.Table..

Below is the behavior of sap.m.Table and sap.ui.table.Table.... if there are 100 rows of data in the model

sap.m.Table --> 100 items with unique id will be created (more items..less performance of rendering as DOM increases)

sap.ui.table.Table --> no. of rows created with unique id = visible row count of table (only visible row count of items are in the DOM...which is good if you have huge amount of data)

If you still want to use sap.ui.table.Table and have the error state retained after scroll down or scroll up then use the event firstVisibleRowChanged

In this event handler..get the currently visible rows of data...perform validation and show the error status..

Former Member
0 Kudos

I have tried it with the sap.m table but the issue is still the same. However I managed to track down the issue. The issue is whenever I change the input field and click on another cell it fires the populateItems event again which renders the input again and loses the state. This is telling me that it is the issue with the library itself or maybe this is an expected behaviour. So I am planning to ask for another solution and close this issue.

Former Member
0 Kudos

Hello Atul,

If you bind valueState with model then the issue will be resolved. The issue is happening because when the control is regenerated, changed property is reset to the initial value.

Regards,

Nikhil

Former Member
0 Kudos

Thanks for your prompt reply but Can you please explain it with a small code sample. Currently I am setting valueState on input change event as below

<code>function onIdChange(oEvent: any) {
   oEvent.oSource.setValueState(sap.ui.core.ValueState.Error);
}

I think I got what you saying but implementing that would be bit difficult, not impossible, as I am binding list of complex object to the table and each cell is bound to property of that complex object. If I go with what you suggesting then each property will have to be a complex object with value and value state property.
Former Member
0 Kudos

Please find below sample code.

var titleInput = new Input({

value: "{TripService>title}",

id: 'title_'+sId,

valueState: {path:'TripService>title',

formatter:function(data){

if(data=="test") //Condition when value is valid

{ return "None";}

else{ return "Error"; }

}}

});

Regards,

Nikhil

Former Member
0 Kudos

I tried with json model binding as well but not working ui still getting a refresh which is wierd

Former Member
0 Kudos

The solution should work for both model types (oData and JSON). Can you share your updated code.

former_member340030
Contributor
0 Kudos

Why your ID is like id: `id_${sId}`, ??

Thanks

Viplove

Former Member
0 Kudos

I am using typescript with es6 string literal syntax and sId is getting passed as the parameter I am just prefixing id hardcode string in front of it

former_member340030
Contributor
0 Kudos

Ok ...

Use templates binding on xml views .. dont return rows ..

https://sapui5.hana.ondemand.com/#/sample/sap.ui.table.sample.Basic/code

Thanks

Viplove