Skip to Content
0

SAPUI5 table sort problem

Jan 05 at 03:02 PM

185

avatar image
Former Member

Hi,

I'm facing a problem with the sort in the table using sortProperty.

Have you ever experienced this problem?

10 |10000 characters needed characters left characters exceeded
* Please Login or Register to Answer, Follow or Comment.

3 Answers

Irfan Gokak Jan 08 at 11:29 AM
0

Hi,

What's the type of Amount in your odata. Please check that first. If its type Edm.String then it'll be an issue.

Show 1 Share
10 |10000 characters needed characters left characters exceeded
Former Member

Hi,

It isn't string is Edm.Int32.

0
Ivan Mirisola
Jan 08 at 05:20 PM
0

Hi Cleber,

Some features used by Tables in SAPUI rely heavily on OData calls. By convention (item 4.2), sorting happens based on odata calls with the command "$orderby=". So when you specify sortProperty all you are telling to your UI5 component issue an Odata with something like:

"$orderby=<sortProperty> <asc/des>

When you click on such table column an event is issued so the framework will perform the corresponding odata call and rebind the data accordingly. Remember that it will also issue a $top command with the rows that are allowed for your table. Imagine what would happen if the amount of data is 1K records and you would perform sorting of just 5 rows. So, in other words, your UI should never perform sorting of any kind - this is the sole job of your server.

To check, open your "Network" tab via developer tools (SHIFT+CTRL+I) and check the odata URI being called. If it does indeed contain the orderby command and it still doesn't fetch the data sorted, than your odata implementation doesn't know how to sort this property.

Regards,
Ivan

Show 2 Share
10 |10000 characters needed characters left characters exceeded
Former Member

Hi Ivan,

when I click in the icon to sort the framewwork doesn't perform odata call.

I think I have to implement an event to perform another call using "$orderby=".

Regards.

0

Sory for misleading you. Yes, you need to create the event handler for the table column in order to push the sorter to the odata source. Here is an example on how to achieve this. This approach is a little different: it puts a button that will display a pop-over menu to select additional table things, like filters, etc.

If you are using a Smart Table component, than this can be achieved by implementing the event "onBeforeRebindTable". But if you are using a simpler component like "sap.m.Table", then you need to create the event for the column, and push the sorter to the odata service like this:

onColumnClick: function(oEvent) {
  var oTable = this.getView().byId("myTableID");
  var oItems = oTable.getBinding("items"); // get the table's odata source binding for rows
  var oBindingPath = oEvent.getSource().getBindingContext().sPath; // get the sPath related to column clicked
  var bDescending = false;
  var oSorter = new sap.ui.model.Sorter(oBindingPath, bDescending); //create a new sorter for your model based on the column clicked. 
  oItems.sort(oSorter); // push the sorter to your model's binding
}

Or you may define your sorter directly on your XML view:

<table:Table rows="{
    path: '/table', 
    filters: [{
        path: 'field3', 
        operator: 'EQ',
        value1: 'test'
    }],
    sorter: [{
        path: 'field1', 
        descending: false
    }, {
        path: 'field2', 
        descending: true
    }]
 }">
...
</table:Table>

Regards,
Ivan

0
avatar image
Former Member
Jan 06 at 05:59 AM
0

Can you kindly elaborate? and how does your data model look like?

Thanks

Show 1 Share
10 |10000 characters needed characters left characters exceeded
Former Member

I'm using the sap.ui.table.Table and in the property sortProperty from sap.ui.table.Column I'm passing the field name in order to enable the sort in the column. The field type is Edm.Int32.

If you check the SAPUI5 demo kit the smart table it has the same problem.

0