HTML.form.guide

html5

How to Create a Telephone Input Field in HTML5

Though field validation and data formatting are the biggest challenges of working with web browsers, HTML5 does some help in enforcing this for us. Telephone input field can be created using type=”tel”: <input type="tel" name="phone_num" id="phone_num"/> This looks like every other input field, with the difference that it optimizes the keyboard. Certain platforms like tablets, or smartphones will pop-up only-numeric keyboard for this input field. It is hard to enforce particular regular expression through HTML because of variety of phone number formats used along with differences in country codes, and number separators.

Continue Reading →

How to Use Html5 Input Type Email

Before the advent of HTML5, handling emails addresses required more work to validate the email addresses using Javascript. Well all that is now not necessary with the new HTML5 input type email. The email input element has been specifically designed to handle and validate email addresses. Depending on the browser, it will alert the user that the entered information is not correct and the form will not submit until the user makes corrections.

Continue Reading →

How to get checkbox value in form submission

Suppose you have a checkbox in your HTML form like this: <form> Email Address: <input type="email" name="email"> <input type="checkbox" name="opt_in_newsletter" > Subscribe to the newsletter </input> If the user checks the option, you will get the following form data email=name@domain.com opt_in_newsletter=on However, if the user does not check the option, then the opt_in_newsletter field itself will not be present in the form data that you receive on the server-side. email=name@domain.com You might have expected opt_in_newsletter=off But in reality, the behavior is different the W3c recommendation supports this behavior by the way.

Continue Reading →