Case insensitive filtering of OData service in SAPUI5

Filtering JSON model is case insensitive, but for OData models this is not the case. OData service filtering is case sensitive by design. In order to achieve case insensitive searching or filtering we can use the good old way of lowering the filter string and the string we search in.

var oFilter = new Filter(
     "tolower(LastName)",
     FilterOperator.Contains,
     "'" + filterString.toLowerCase().replace("'","''") + "'"
     );

When we use a search string like "O'donnell" this translates into:

$filter=substringof(%27o%27%27donnell%27, tolower(FirstName))

As per OData specification the text we search in can be lowered using tolower():

tolower(FirstName) 

The searched text has to be lowered as well using the javascript function toLowerCase(). In addition it is surrounded by quotes to ensure it is a string when added to the odata filter. And finally to avoid problems if the search string contains quotes we have to escape them by replacing with two quotes.

Happy coding!

How to keep HTML table rows undivided by page breaks when printing HTML into PDF?

When printing large HTML tables it happens that a row gets wrongly divided between two pages. In order to solve this we can instruct the printer to keep the row on only one of the pages by adding CSS style to the table row.:

When page-break-inside property is set to avoid the  page-break should be avoided inside a HTML element, in this case table row. Of course ti can be applied to other elements like pre, blockquote, etc.

tr{
     page-break-inside:avoid;
     page-break-after:auto
}

Javascript delete property vs. nullifying it?

Let's start with a simple object:

var person = {
   firstName: 'John',
   middleName: 'D.',
   lastName: 'Doe'
}

The most common way to get rid of a property value is to nullify it or make it undefined.
Ex.
person.middleName = null;
or
person.middleName = undefined;

var person = {
   firstName: 'John',
   middleName: null,
   lastName: 'Doe'
}

Other way is to just delete it.

The delete operator does a different job by removing the whole property, returning true or false to indicate the success of the operation. In fact the deletion does not do anything related to freeing memory or releasing resources. It is just removing the property so it no longer appears in the object skeleton.
Ex.
delete  person.middleName;

This will result into

var person = {
   firstName: 'John',
   lastName: 'Doe'
}

Obviously deleting a property may help in cases when you need to enumerate the object properties and property must not appear any more. 

Deleting an array element is a different thing. The deleted element gets undefined, but the actual array length is not changing. The actual usage difference between using 'undefined' or delete operator appears to be in object properties. 

What is ECMAScript and ES6, ES7, etc.?

ECMA is an association for standardizing information and communication systems. ECMA standardizes JavaScript under the name of ECMAScript.
In a nutshell ECMAScript is a standard while JavaScript is the implementation of this standard. 

All name like ES1, ES2, ES3, ES4, ES5, ES6, ES7, etc., are abbreviations of the ECMAScript version.
ES6 was issued in 2015 and also called ES2015. As of 2015, all new versions of ES are supposed to be named by the year - ES2016 (ES7), ES2018 (ES8), etc.

ES.next is the abbreviation of all upcoming, not standardized yet versions.

The ECMA standard is supported by browsers. The following table provide extensive information about the browser support, feature by feature:
https://kangax.github.io/compat-table/es6/

In order to provide better browser support, tools like Babel can help you use latest JavaScript features into older browsers. Babel is a JavaScript compiler, more precisely said - a transpiler, that allows developers to program using ES6 feature converted to a Javascript code that current browsers can process. React (ReactJS) is a great example of Babel usage.