Improved HTML5 Input validation

[♥raiwa]

Example for create_account.php:

        echo tep_draw_input_field('firstname', NULL, 'required aria-required="true" id="inputFirstName" placeholder="' . ENTRY_FIRST_NAME_TEXT . '" pattern=".{' . ENTRY_FIRST_NAME_MIN_LENGTH . ',}" title="' . ENTRY_FIRST_NAME_ERROR . '"');

 

 

Source:

The Pattern Attribute

http://www.w3schools.com/html/html_form_attributes.asp

 

Something for core??

 

Best regards

Rainer

[♥bruyndoncx]

i also use civem.js for the localisation of the error messages

[burt]

The better use is minlength which will be available when browsers catch up with the HTML5 specs.

 

I had a minlength branch a couple of years ago but abandoned it as browsers take so long to catch up.

That work can be redone at some point in the future.

[♥raiwa]

Thats the point, minlength is not available, pattern is.

I also used maxlength for textarea together with placeholder. This one is available in all actual browsers.

[♥raiwa]

The maxlength attribute doesn't show any error message. It just doesn't allow to continue typing when maxlength is reached.

Which could be the equivalent for minlength. No idea. Maybe because there is no equivalent behaviour it has not been implemented.

All resources for minlength use the pattern attribute.