Skip to Content
avatar image
Former Member

SAPUI5 table sort problem

Hi,

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

Have you ever experienced this problem?

Add comment
10|10000 characters needed characters exceeded

  • Get RSS Feed

3 Answers

  • Jan 08 at 11:29 AM

    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.

    Add comment
    10|10000 characters needed characters exceeded

  • Jan 08 at 05:20 PM

    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

    Add comment
    10|10000 characters needed characters exceeded

    • 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

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

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

    Thanks

    Add comment
    10|10000 characters needed 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.