{"id":45708,"date":"2019-07-25T03:01:08","date_gmt":"2019-07-24T17:01:08","guid":{"rendered":"http:\/\/www.rjmprogramming.com.au\/ITblog\/?p=45708"},"modified":"2019-07-24T17:38:33","modified_gmt":"2019-07-24T07:38:33","slug":"html5-form-api-validation-revisit-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/html5-form-api-validation-revisit-tutorial\/","title":{"rendered":"HTML5 Form API Validation Revisit Tutorial"},"content":{"rendered":"
\"HTML5<\/a>

HTML5 Form API Validation Revisit Tutorial<\/p><\/div>\n

You’d think after a long time in the programming world thinking the command line was so good, I’d have stopped relying on imagery to be interested in information. But, there you go, truth be told, it’s either me or the influence of “the net” that has made me need images not to move on, am pretty sure. And so, revisiting HTML5 Form API Validation Primer Tutorial<\/a>, albeit that it represents a “proof of concept” scenario, it “hurt me” not to see any imagery within the webpage itself. Country codes and currency codes, even given the brilliant organizational skills of International Organization for Standardization<\/a> (good ‘ol<\/font> ISO), is a pretty dry subject in our books (down, pamphlettes, down<\/font>).<\/p>\n

But who\/what to turn to to add some interesting anything? That last link had a clue? You want another<\/a>? Yes, Tiberius Caesar Divi Augusti filius Augustus<\/a>, it’s Wikipedia<\/a>. But Tiberius Caesar Divi Augusti filius Augustus<\/a> did you know we also involve Google Charts<\/a> Map Chart<\/a> and Geo Chart<\/a>? No? Well, perhaps Vipsania Agrippina<\/a>, your blank stare says it all. Yes, Tiberius Caesar Divi Augusti filius Augustus<\/a> caeser the moment (tee hee) … you are excused.<\/p>\n

You can see in code how we achieved this with the changed<\/a> html5_form_constraint_validation.html<\/a> and its live run<\/a> link.<\/p>\n

\n

Previous relevant HTML5 Form API Validation Primer Tutorial<\/a> is shown below.<\/p>\n

\"HTML5<\/a>

HTML5 Form API Validation Primer Tutorial<\/p><\/div>\n

HTML5 is more than just the “5” tagged on. Take a look at this list<\/a> of API related parts to the HTML5 specification.<\/p>\n

As you may have gleaned from our recent HTML Input Element Types Randomized History Tutorial<\/a> a lot of new HTML input elements were added with the view to improving the capabilities of HTML form elements for collecting information from users interactively. Along with that, as you might expect, validation methodologies were improved, as any programmer would tell you, can be one of the most challenging “practical element” of web design to do well to not involve user error, or “user giving up”.<\/p>\n

The HTML5 form API has great “Constraint Validation”, not all new to HTML, but vastly improved and extended, as you can read a lot about at this really great webpage<\/a>, thanks.<\/p>\n

The HTML input attribute we find of great practical benefit with all this is the pattern<\/i><\/a> attribute to define a constraint, in the same sort of vein as a RegEx<\/a> expressions helps you perform pattern-matching and “search and replace” functions on text. This would be great use for organizations that work with “codes” or “Part Numbers” or SKU (stock keeping units<\/a>) that follow a consistent pattern<\/i>.<\/p>\n

You can try some simple Constraint Validation at today’s live run<\/a> link with its underlying serverside PHP code you could call html5_form_constraint_validation.html<\/a> as you wish.<\/p>\n

If this was interesting you may be interested in this<\/a> too.<\/p>\n