Hi, yeah thanks for reporting it. I have created a PR for this fix. Apparently, many functions were removed due to jQuery. I'm sure this might affecting other components as well. While you're here, please do test it out and check other types of input as well. Thanks :)

Hi, yeah thanks for reporting it. I have created a PR for this fix. Apparently, many functions were removed due to jQuery. I'm sure this might affecting other components as well. While you're here, please do test it out and check other types of input as well. Thanks :)

Thank you for your PR, looks good. How can I test, if it also works with type="date" or type="number" for Example? Also would be great if it works with required attribute?

Hi, yeah thanks for reporting it. I have created a PR for this fix. Apparently, many functions were removed due to jQuery. I'm sure this might affecting other components as well. While you're here, please do test it out and check other types of input as well. Thanks :)

Thank you for your PR, looks good. How can I test, if it also works with type="date" or type="number" for Example? Also would be great if it works with required attribute?

https://github.com/materializecss/materialize/suites/18597325789/artifacts/1080727369 you can replace the files with these. Not sure, I might need to check deeper if any old features were removed.

I dropped myself from fixing this issue. Sorry, I don't currently have time to complete this.

@Jerit3787 could you provide me a brief description on what still needs to be done to address this issue?

*Update: As I looked a bit deeper into this issue, as there is HTML5 validation introduced in 2013, this seem to work properly on submit in combination with the Materialize library, the above CodePen example is apparently missing the submit button. In case of form input without a submit button, with AJAX for example, check out the Javascript validation API:

• https://stackoverflow.com/questions/11866910/how-to-force-an-html-form-to-validate-without-submitting-it-via-jquery
• https://www.w3schools.com/js/js_validation_api.asp

CodePen example

@Jerit3787 could you provide me a brief description on what still needs to be done to address this issue?

Yeah, so far there materialize doesn't check for any validation methods, namely email and others. In my PR, I've reimplemented the validation feature that was removed before this. You can take a look at it for any reference

*Update: As I looked a bit deeper into this issue, as there is HTML5 validation introduced in 2013, this seem to work properly on submit in combination with the Materialize library, the above CodePen example is apparently missing the submit button. In case of form input without a submit button, with AJAX for example, check out the Javascript validation API:

• https://stackoverflow.com/questions/11866910/how-to-force-an-html-form-to-validate-without-submitting-it-via-jquery
• https://www.w3schools.com/js/js_validation_api.asp

CodePen example

Yeah the HTML5 validation still works, but there is no feedback in terms of the Text Input component like a red bar showing error / customized error message. In previous implementation, materialize will check once user leaves focus (i think?) or press enter on keyboard and instantly shows a red if the validation found an error on the user inputs.

I've reviewed PR #438, which works as expected, except that the styling for handling invalidity of the field was still missing

Regarding my previous notation on HTML5 validation: there is a possibility to extend existing Materialize styling to the invalid CSS pseudo selector, however implementing an email type input which has attribute required makes it a bit more complex as expected, as mentioned in this comment by Jerit3787. The field is marked as invalid immediately since there is no value, not sure if there is any workaround for this, need to dig a bit deeper into the HTML5 validation on a required (empty) field

A new PR (#521) with enhancements and additions has been created

@Jerit3787 I've refactored the code slightly and removed valid class from a point of view where input should always be considered valid as default except if a invalid error status is thrown

Missing CSS classes and styling for handling the invalidity of the field have been added