Dropdowns

• Tabbing into a dropdown, date, or time field does not open the picker. In V1, pickers open when you tab into them.
• Clicking a dropdown will open it, but not close it. In V1, clicking the field will open or close the dropdown.
• Dropdowns support filtering. This means that a Choice field with Allow Fill In looks the same as a Choice field without Allow Fill In.
• Typing into a dropdown opens the dropdown. If the dropdown is collapsed, typing opens the dropdown and does not automatically select a choice.
• Dropdowns don’t display a blank value in the dropdown when the field is not filled out.

Form display

• When a form is loading, a loading animation now displays. In V1, the loading screen is a blank white page.
• New animations are used for showing and hiding fields.
• Secondary buttons (ex: Add Item, Back) are differentiated from primary buttons (ex: Next, Submit).
• Setting the header layout to Logo Only does not also set it to Stretch.
• The entire header (including the form title and description) displays on the ‘form not available’ page. In V1, the ‘form not available’ page only shows the logo and the form not available message.
• If document templates are included, the document links appear above the form’s confirmation message. In V1, they appear below the confirmation message.
• For organizations on the Individual plan, the html title for public links is “Form Name | Cognito Forms”. In V1, the html title for the public link is “Cognito Forms”.
• Dropdowns, date pickers and time pickers match the styling of the form.
• Field focus indication is more visually consistent across different browsers.
• Only buttons and hyperlinks have a pointer cursor.
• A form with a transparent background does not have a box shadow around the border.
• Cognito Forms branding is updated.

Form fields

• Address fields
  • The State dropdown in Address fields is not centered between City and Zip Code.
• Choice fields
  • Radio buttons and checkboxes set to multiple columns are ordered down, then across. In V1, they are ordered across, then down.
  • Choice fields set to display prices do not show prices when they are read-only.
  • Dropdown menus automatically filter options as you type.
• File Upload field
  • The Upload button is hidden when the maximum number of files is reached. In V1, this only occurs when the field is set to only allow one file.
• Name fields
  • The Middle Initial input area is larger.
• Number fields
  • Number fields set to the Percent type do not contain a space between the number and the percent sign (%).
  • You can hold down the buttons on a spinner to continue increasing or decreasing the value. In V1, you must click the buttons multiple times.
• Rating scales
  • Rating scale labels are styled as section headers instead of labels.
  • Required rating scales do not have an asterisk by the field label – only by each question. In V1, required asterisks appear by both the label and the questions.
  • Rating scale radio buttons responsively convert to dropdowns. In V1, they convert to sections with radio buttons.
• Signature fields
  • Signature fields now support signed or typed input (more compliant with Section 508 standards).
• Table fields
  • Home/End keys navigate textboxes first before the table. If your cursor is in the middle of an input, you must hit Home/End twice to go to the first/last cell of the current row.
• Textbox fields
  • Format masks can now contain ? and *.
  • Multiple line textboxes get larger as you type into them (up to 9 lines). In V1, they can be resized, but do not do so automatically.
• Time fields
  • The new incremental time picker allows you to pick from a list of times.
  • Time pickers scroll to 8 AM by default when opened. In V1, they show the current time when opened.
• Website fields
  • Website fields automatically add https protocol to a url that is entered without it. In V1, the field simply displays an error message.
• Yes/No fields
  • Required Yes/No fields do not have asterisks. In V1, the Toggle and Radio Buttons Yes/No field types have asterisks.

Embedding

• Seamlessly embed multiple forms on a single page. In V1, you can only embed one Seamless form on a single page.
• Embed scripts are now shorter. However, V1 embed codes still work for V2 forms.
• V2 forms use CSS variables (also called custom properties) for styling embedded forms. V1 CSS styling properties do not work for V2 forms.
• Each form has unique identifiers that allow them to be styled separately. In V1, styling affects all forms embedded on the page.
• Embed forms in a single page app.
• Use one consistent public API for Seamless and Iframe embedding.
• V2 uses <div role=form> instead of <form>.

Errors and validation

• Error message design is updated.
• Required asterisks do not display when the label is null or empty.
• Required asterisks are a lighter color when the background is dark.
• Required fields now display background shading to emphasize error messages.
• Read-only fields that do not have a value still contain a space for the value. In V1, they do not.
• Attempting to submit on a page with an error scrolls the error to the center of the viewport. In V1, it scrolls to the top.

Integrations

• The beforeSubmit event fires only after validation succeeds. In V1, the beforeSubmit event fires when you click Submit with validation errors.

Multi-page forms

• If validation exists on a previous page when the user tries to submit, the form will navigate backward to show the error (if the form allows backward navigation). In V1, the form will only navigate backward if the form contains a quantity limit error. In both V2 and V1, the form will navigate backward for quantity limit errors regardless of whether the form allows backward navigation.
• Page buttons use the highlight color. In V1, they use the button color for the selected page.
• Page names in the progress bar are no longer bold.
• The progress bar on multi-page forms will always stay on one line.
• Pressing Enter does not navigate to the next page unless you are focused on the next button. In V1, it navigates pages as long as you are not in a picker.
• Page numbers do not show the total number of pages, only the current page. In V1, both the current page and the total number of pages display.

Payment

• PayPal button design is updated.
• The Stripe payment block no longer has icons.
• Repeating section item labels are all caps in the payment block.
• Line item name and description are now the same color in the payment block.
• The line items on the payment block are left-aligned when there are no payment fields. In V1, they are aligned to the middle of the form.
• When there are custom fees and $0 due, the payment block doesn’t display.

Prefill

• Calculations can no longer be prefilled.
• Default values run when prefilling a form. In V1, calculated default values are disabled when prefilling.
• You can no longer prefill a Lookup field with an invalid value. In V1, you can prefill a lookup field with a value that is filtered out.
• When trying to submit a form, if the first error on a page is in a section, the section will be focused. In V1, sections cannot receive focus.

Responsiveness

• Fields in V2 switch to their responsive mode whenever there is not enough room for the field. In V1, fields resize when the form as a whole is smaller than a particular width.
• The Submit button is not full width on mobile-sized forms.
• The progress bar is responsive to screen dimensions.

Sections

• Sections, repeating sections, and tables display custom errors after the user interacts with them. In V1, sections only display custom errors when you try to submit the form.
• The remove item icons (x) in repeating sections use the text color. In V1, the remove item icon uses the button color.