Add input on change delay

by Garth | Aug 6, 2019 | Outsystems

Simply add this line to the javascript as is, for whichever page or block and it will set a delay on the input fields onchange. It will apply to all your input fields.

Outsystems default onchange delay is 800 which can be annoying when typing and it resets your cursor back to the start of your text. This will delay that jump on the text cursor.

osOnChangeTimerDelay = 3000;

Animated Labels Styling

by Garth | Feb 11, 2019 | Outsystems

.animated-label.active .animated-label-input input[data-input], .animated-label.active .animated-label-input input[data-input]:empty {
    color: initial;
}

.animated-label-input input[data-input], .animated-label-input input[data-input]:empty {
    color: transparent;
}

Adding a search filter to Outsystems

by Garth | Oct 22, 2018 | Outsystems

In the example below a local variable was created for orders WebScreen called “searchfilter” which was set as the Search inputs Variable.

There was an Orders Entity and a Customers Entity.

The text below is an aggregate filter checking for all the orders with customer names like the text input into the search box. Remember the “searchfilter” was set as a local variable for the Orders Entity.

Customer.Name like "%" + SearchFilter + "%"

Also because the Orders Entity and the Customers Entity were separate Entities a source was added for the Customers to link the tables so the customer Entity could be found.

The aggregate that had these setting was the “GetOrders” aggregate which was used in the Orders WebScreen preparation.