Advanced SAPUI5 Part-30: the Grid Table Advanced Features

We gained knowledge of row actions as well as the freezing of columns and rows. I’ll go over the grid table’s characteristics below in this blog article.

  • row highlighter
  • swap out the row colors

Highlighter for Rows

A row highlighter is a vertical color band that is used to indicate a row’s start with a certain color, such as red for an error, yellow for a warning, green for a success, etc. In a technical sense, the grid table’s row Settings Template aggregate has to be implemented. The row Settings Template is where.


XML View coding

We have the Row Settings property named highlight set to the O Data service‘s Fax attribute. Please see the grid table topic for information on starting from scratch when building a UI control for a grid table. The aforementioned code is based on that post’s code. The value of the Fax attribute is not kept for some of the records in the OData service’s output. As a result, the formatter function used in the code above will return SUCCESS for entries for which fax is retained and ERROR for records of this type.


Controller coding: formatter function logic

The formatter function has been defined in the controller to return the correct value for the RowSettings highlight property. This is the code.

setHighLight:function(sProperty)
		{
			var highLightVal = '';
			if((sProperty === null) || (sProperty === ''))
			{
				highLightVal = sap.ui.core.MessageType.Error;
			}
			else
			{
				highLightVal = sap.ui.core.MessageType.Success;
			}
			return highLightVal;
		},

View the Row Highlighter in operation.

When you run the application, you will notice that rows will be highlighted in red and green depending on whether the Model’s Fax property is available.

Different Row Coloring

Up until now, every row has had the same background color—white. A characteristic of a grid table allows the rows to be alternately colored on a light grey background. To do this, set

The magic is accomplished by setting this property to true. Save the view code now, then launch the application once more. You’ll notice that the colors have been applied to alternate rows.

Please do the actions outlined in this blog article. In the comments box, please leave any questions, comments, or criticism. I will gladly reply as soon as possible.


you may be intereseted in this blog:-

Create and Configure Automation

Unleash the Power of Your Salesforce Inspector Extension

MASTER YOUR PRODUCT JOURNEY WITH SAP PLM (2024 GUIDE)

Elevating Data Interoperability: Exploring OData Implementations and Libraries

  • Related Posts

    SAP GPS-like tool with Google Map API

    We learned how to use the Google Map API to obtain the latitude and longitude of any address. To supplement that knowledge, we would discover how to calculate the distance…

    Accounting Record for Sales and Distribution

    Introduction Accurate accounting records are the backbone of effective sales and distribution (SD) management in any organization. These records ensure that all financial transactions related to sales, distribution, and customer…

    Leave a Reply

    Your email address will not be published. Required fields are marked *

    You Missed

    Advanced SAPUI5 Part-30: the Grid Table Advanced Features

    • By Varad
    • January 15, 2025
    • 11 views
    Advanced SAPUI5 Part-30: the Grid Table Advanced Features

    SAP GPS-like tool with Google Map API

    • By Varad
    • January 14, 2025
    • 13 views

    Accounting Record for Sales and Distribution

    • By Varad
    • January 13, 2025
    • 36 views
    Accounting Record for Sales and Distribution

    Accounting Records for Verification of Vendor Invoice

    • By Varad
    • January 12, 2025
    • 37 views
    Accounting Records for Verification of Vendor Invoice

    Accounting Reversal Entry

    • By Varad
    • January 11, 2025
    • 49 views
    Accounting Reversal Entry

    Numerous Reversal Document Types

    • By Varad
    • January 10, 2025
    • 38 views
    Numerous Reversal Document Types