Make materialize labels move out of input box when input box is filled via javascript

Question

Normally, with Materialize, the labels for text input boxes show up inside the input boxes until a user enter selects the box and enters text in it. However, when a box's value is filled via javascript, the label does not move out of the way. It stays in the box and overlaps with the text entered. Is there a way to trigger the label transition with javascript as well, so this doesn't happen?

Answer 1

More specifically, if you are using Materialize in Rails with turbolinks enabled, you will find that Materialize form fields which are prefilled with non-empty values are not active on page load.

The following method worked for me:

$(function() {
    M.updateTextFields();
});

It will add class 'active' to both corresponding labels and prefix icons.