Skip to content

Clarified documentation on the options for and how to setup client-side validation. #6252

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Jul 11, 2024
Merged

Clarified documentation on the options for and how to setup client-side validation. #6252

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 7 additions & 3 deletions 10/umbraco-forms/developer/prepping-frontend.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,9 @@

For Umbraco Forms to work correctly, you need to include some client dependencies.

## Umbraco Forms
## Client-Side Validation

Umbraco Forms ships with client-side form validation features provided by the [ASP.NET Client Validation library](https://github.com/haacked/aspnet-client-validation).

You can use the following Razor helper to output script tags containing the dependencies. To access this method you will need a reference to `Umbraco.Forms.Web`:

Expand All @@ -28,12 +30,14 @@ All dependencies originate from your Umbraco Forms installation, which means tha

## Validation Using jQuery

If you want to use jQuery as your validation framework for Umbraco Forms, you can manually add the following client dependencies without using the above Razor method:
If you want to use jQuery as your validation framework for Umbraco Forms, you can manually add the following client dependencies:

- `jQuery` (JavaScript library)
- `jQuery validate` (jQuery plugin that provides client-side Form validation)
- `jQuery validate unobtrusive` (Add-on to jQuery Validation that provides unobtrusive validation via data-* attributes)

You should remove any calls to `@Html.RenderUmbracoFormDependencies(Url)`.

The easiest way to add the dependencies is to fetch them from a [CDN](https://en.wikipedia.org/wiki/Content_delivery_network). There are various CDN services you can use:

- For example: [Microsoft CDN](https://docs.microsoft.com/en-us/aspnet/ajax/cdn/overview).
Expand All @@ -53,7 +57,7 @@ To add the three client dependencies, see the examples below:

**Example within `body` tags.**

When adding the script to the bottom of the page, you will also need to render the scripts. For more information, see [Rendering From Scripts](rendering-scripts.md) article.
When adding the script to the bottom of the page, you will also need to render the scripts. For more information, see [Rendering Forms Scripts](rendering-scripts.md) article.

```html
<body>
Expand Down
8 changes: 6 additions & 2 deletions 12/umbraco-forms/developer/prepping-frontend.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,9 @@

For Umbraco Forms to work correctly, you need to include some client dependencies.

## Umbraco Forms
## Client-Side Validation

Umbraco Forms ships with client-side form validation features provided by the [ASP.NET Client Validation library](https://github.com/haacked/aspnet-client-validation).

You can use the following Razor helper to output script tags containing the dependencies. To access this method you will need a reference to `Umbraco.Forms.Web`:

Expand Down Expand Up @@ -38,12 +40,14 @@ If using `async`, please make sure to [disable the Forms client-side validation

## Validation Using jQuery

If you want to use jQuery as your validation framework for Umbraco Forms, you can manually add the following client dependencies without using the above Razor method:
If you want to use jQuery as your validation framework for Umbraco Forms, you can manually add the following client dependencies:

- `jQuery` (JavaScript library)
- `jQuery validate` (jQuery plugin that provides client-side Form validation)
- `jQuery validate unobtrusive` (Add-on to jQuery Validation that provides unobtrusive validation via data-* attributes)

You should remove any calls to `@Html.RenderUmbracoFormDependencies(Url)`.

The easiest way to add the dependencies is to fetch them from a [CDN](https://en.wikipedia.org/wiki/Content_delivery_network). There are various CDN services you can use:

- For example: [Microsoft CDN](https://docs.microsoft.com/en-us/aspnet/ajax/cdn/overview).
Expand Down
8 changes: 6 additions & 2 deletions 13/umbraco-forms/developer/prepping-frontend.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,9 @@

For Umbraco Forms to work correctly, you need to include some client dependencies.

## Umbraco Forms
## Client-Side Validation

Umbraco Forms ships with client-side form validation features provided by the [ASP.NET Client Validation library](https://github.com/haacked/aspnet-client-validation).

You can use the following Razor helper to output script tags containing the dependencies. To access this method you will need a reference to `Umbraco.Forms.Web`:

Expand Down Expand Up @@ -38,12 +40,14 @@ If using `async`, please make sure to [disable the Forms client-side validation

## Validation Using jQuery

If you want to use jQuery as your validation framework for Umbraco Forms, you can manually add the following client dependencies without using the above Razor method:
If you want to use jQuery as your validation framework for Umbraco Forms, you can manually add the following client dependencies:

- `jQuery` (JavaScript library)
- `jQuery validate` (jQuery plugin that provides client-side Form validation)
- `jQuery validate unobtrusive` (Add-on to jQuery Validation that provides unobtrusive validation via data-* attributes)

You should remove any calls to `@Html.RenderUmbracoFormDependencies(Url)`.

The easiest way to add the dependencies is to fetch them from a [CDN](https://en.wikipedia.org/wiki/Content_delivery_network). There are various CDN services you can use:

- For example: [Microsoft CDN](https://docs.microsoft.com/en-us/aspnet/ajax/cdn/overview).
Expand Down
8 changes: 6 additions & 2 deletions 14/umbraco-forms/developer/prepping-frontend.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,9 @@

For Umbraco Forms to work correctly, you need to include some client dependencies.

## Umbraco Forms
## Client-Side Validation

Umbraco Forms ships with client-side form validation features provided by the [ASP.NET Client Validation library](https://github.com/haacked/aspnet-client-validation).

You can use the following Razor helper to output script tags containing the dependencies. To access this method you will need a reference to `Umbraco.Forms.Web`:

Expand Down Expand Up @@ -38,12 +40,14 @@ If using `async`, please make sure to [disable the Forms client-side validation

## Validation Using jQuery

If you want to use jQuery as your validation framework for Umbraco Forms, you can manually add the following client dependencies without using the above Razor method:
If you want to use jQuery as your validation framework for Umbraco Forms, you can manually add the following client dependencies:

- `jQuery` (JavaScript library)
- `jQuery validate` (jQuery plugin that provides client-side Form validation)
- `jQuery validate unobtrusive` (Add-on to jQuery Validation that provides unobtrusive validation via data-* attributes)

You should remove any calls to `@Html.RenderUmbracoFormDependencies(Url)`.

The easiest way to add the dependencies is to fetch them from a [CDN](https://en.wikipedia.org/wiki/Content_delivery_network). There are various CDN services you can use:

- For example: [Microsoft CDN](https://docs.microsoft.com/en-us/aspnet/ajax/cdn/overview).
Expand Down