Search code examples
cssvalidationmaterialize

Valid/Invalid Classes not being added to prefilled text fields

I am using the MaterializeCSS framework and I am dynamically populating text inputs. One problem I am having is that the valid and invalid css classes are not being added to my fields until I focus the field.

Even when I call M.updateTextFields(), it does not add the CSS classes.

To see an example of what I mean, go to MaterializeCSS Text Inputs page and go to the Prefilling Text Inputs section. The input field will not show the green highlight until you focus on the input field.

Solution

  • You can handle it with jquery :

    $(document).ready(function(){
    $("input").focus().blur();
});

    After the DOM being load, focus() select all inputs and blur() deselect them. So after this you can see invalid input values if they are exist.

    Here is an example : jsfiddle