From 81ddeba01edaef6c2275a8c234edfa4ca7673fec Mon Sep 17 00:00:00 2001 From: lonix1 <40320097+lonix1@users.noreply.github.com> Date: Tue, 26 Dec 2023 07:04:39 +0200 Subject: [PATCH 1/3] docs: customize css --- README.MD | 19 ++++++++++++++++++- 1 file changed, 18 insertions(+), 1 deletion(-) diff --git a/README.MD b/README.MD index eb0c807..09465b7 100644 --- a/README.MD +++ b/README.MD @@ -71,6 +71,8 @@ v.bootstrap(); **aspnet-validation.min.js:** 10.6 KB **(9.46%, ~4 KB GZIP)** - **promise-polyfill**: +3.06 KB (< 1 KB GZIP) +Also, `jquery.validate.unobtrusive.min.js` has not been meaningfully updated in over a decade, and is hard to configure. + ## Building the Source Code ```powershell @@ -239,6 +241,21 @@ let v = new aspnetValidation.ValidationService(); v.bootstrap({ watch: true }); ``` +## Customizing CSS for use with other libraries + +One can customize the CSS classes so the generated markup is compatible with various frameworks. For example, to integrate with [Bootstrap](https://getbootstrap.com/docs/5.3/forms/validation) (v5+): + +```js +var v = new aspnetValidation.ValidationService(); +v.ValidationInputCssClassName = 'is-invalid'; // change from default of 'input-validation-error' +v.ValidationInputValidCssClassName = 'is-valid'; // change from default of 'input-validation-valid' +v.ValidationMessageCssClassName = 'invalid-feedback'; // change from default of 'field-validation-error' +v.ValidationMessageValidCssClassName = 'valid-feedback'; // change from default of 'field-validation-valid' +//v.ValidationSummaryCssClassName = 'validation-summary-errors'; // unnecessary: bootstrap lacks validation summary component +//v.ValidationSummaryValidCssClassName = 'validation-summary-valid'; // " +v.bootstrap(); +``` + ## Logging There is a rudimentary logging infrastructure in place if you want to get more insight into what the library is doing. @@ -254,4 +271,4 @@ export interface Logger { let v = new aspnetValidation.ValidationService(console); v.bootstrap(); -``` \ No newline at end of file +``` From cab03cbeb84843e0fec9a5f09a71abbe7bb6afdc Mon Sep 17 00:00:00 2001 From: lonix1 <40320097+lonix1@users.noreply.github.com> Date: Tue, 26 Dec 2023 07:07:21 +0200 Subject: [PATCH 2/3] fix: docs --- src/index.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/index.ts b/src/index.ts index 8925c69..f9c6e13 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1419,7 +1419,7 @@ export class ValidationService { ValidationSummaryCssClassName = "validation-summary-errors"; /** - * Override CSS class name for valid validation summary. Default: 'field-validation-valid' + * Override CSS class name for valid validation summary. Default: 'validation-summary-valid' */ ValidationSummaryValidCssClassName = "validation-summary-valid"; } From 702ca38f93e9ca5a4de7e69998db502472a149e2 Mon Sep 17 00:00:00 2001 From: lonix1 <40320097+lonix1@users.noreply.github.com> Date: Fri, 29 Dec 2023 05:53:53 +0200 Subject: [PATCH 3/3] fix --- README.MD | 1 + 1 file changed, 1 insertion(+) diff --git a/README.MD b/README.MD index 2ee7654..8f33eb3 100644 --- a/README.MD +++ b/README.MD @@ -260,6 +260,7 @@ v.ValidationMessageValidCssClassName = 'valid-feedback'; // change //v.ValidationSummaryCssClassName = 'validation-summary-errors'; // unnecessary: bootstrap lacks validation summary component //v.ValidationSummaryValidCssClassName = 'validation-summary-valid'; // " v.bootstrap(); +``` ## Logging