I’ve been going through a few HTML5 training videos on PluralSight and specifically have a few questions regarding HTML5 forms. If possible please could someone give explanations (with examples as needed) to the following?
Setting “min” and “max” on input type - wouldn’t a user be able to edit this and essentially break the form since the validation is done natively? Is this problem rectified using native validation rules?
I’ve been looking into the “data-rule” attribute - are these rules fixed or can they be named anything? Presumably they are fixed. How many rules are there?
Can validation messages be native or do they always have to be added manually?
Why are inputs allowed outside of the form tag but still linked via the “form” attribute? Not semantically correct surely? How would this be valid?
Apologies if these questions do not make sense - let me know if further details such as my own examples should be provided to better explain the questions.
Any form can be “spoofed” to get whatever input to whatever field someone wants to. The native validation just helps legitimate users get it right, it is not secure. So in addition you need proper back end post validation.
Modern browsers do recognise input types and do in page validation for you, but they are not universally supported andt as stated above, it needs to be backed up by back end validation too.
Those were my thoughts also, thanks for confirming! Probably very obvious to some but I thought I’d check, particularly as this topic wasn’t even touched on within the videos - that’s expected to be part of some additional research before it comes to implementation I guess!
Your visitor can substitute their own form for yours - all HTML and JavaScript validations are for the convenience of the person filling out the form - you should validate all of the fields again on the server regardless of the client side validation that may or may not have applied.
Are there any thoughts on the remaining questions?
I’ve been looking into the “data-rule” attribute - are these rules fixed or can they be named anything? Presumably they are fixed. How many rules are there?
Why are inputs allowed outside of the form tag but still linked via the “form” attribute? Not semantically correct surely? How would this be valid?
data-* are custom data attributes. That means they can be anything (with a few exceptions of what characters may be used) you want them to be, Eg: data-rule, data-unruly or data-i-rule-ok="true".
How many rule do you want?
Though I think the data attributes you are asking about are ones created for a jQuery validation plugin.