Forms

September 20, 2024

Got an Angular form? Cool, is it Accessible?

How do people without arms, people who can’t see well, people who can’t hear, or who have other disabilities, use your application? Making forms accessible in Angular is crucial, not just because it's the right thing to do, but also because it can greatly enhance the user experience for everyone, regardless of their abilities. By doing so, we can ensure that our application is usable by as many people as possible, which can ultimately lead to a better user base and even more business opportunities. In this tutorial we’ll cover several things we can do to greatly improve the accessibility of a basic Angular form.

September 13, 2024

Add an Angular Form Control, Do Cool Form Stuff

Forms are a pretty big deal in any application really and, if you didn’t already know or haven’t had much experience with it yet, Angular has you covered with the Reactive Forms Module. In this example we’ll create a basic form control and then add several enhancements to the form overall based on the validity and interaction states of the control. By the end of this tutorial, you’ll be able to quickly add your own form controls and create some very useful forms.

August 22, 2023

How to Style HTML Radio Buttons: A Step-by-Step Guide

HTML radio buttons are a staple of web forms, but their default appearance leaves much to be desired. In this blog post, we'll walk through one of my favorite methods to customize the look of radio buttons using CSS, creating a more user-friendly and visually appealing experience.

April 28, 2014

CSS Pseudo Classes for Form Elements

CSS provides us with a handful of pseudo classes that are specific to HTML5 forms. They allow us to create forms that are easier to fill out by highlighting fields that are required, optional, valid, invalid, etc.

April 25, 2014

Quick Tip - 16: Disable HTML Form Validation With novalidate

With HTML5 we have been given new input types (email, tel, url, number, etc.) and built in browser validation to validate them. This is great but you may want to disable this validation if you want to test your server side validation, use custom validation, or something else.