From f32a5e4f96d349ac033ac37b557c83f7813fa86e Mon Sep 17 00:00:00 2001 From: alan bount Date: Mon, 25 Jul 2016 17:56:19 -0400 Subject: [PATCH 1/3] An idea for `showError` Boolean If true, we could include the error message as a text block with the input form. This seems like a very useful option, especially for forms where the errors are not rendered. --- .../uniforms-bootstrap4/src/components/fields/FormGroup.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/packages/uniforms-bootstrap4/src/components/fields/FormGroup.js b/packages/uniforms-bootstrap4/src/components/fields/FormGroup.js index daf64f43f..3e45f12c3 100644 --- a/packages/uniforms-bootstrap4/src/components/fields/FormGroup.js +++ b/packages/uniforms-bootstrap4/src/components/fields/FormGroup.js @@ -20,7 +20,8 @@ const FormGroup = ({ id, label, // string label (or false) required, - wrapClassName // class name for the section wrapping the input(s) + wrapClassName, // class name for the section wrapping the input(s) + showError // boolean, if true, show with error message }) =>
{children} {makeHelp(help, helpClassName)} + {error && showError ? makeHelp(error, 'text-help') : ''}
)} {!grid && !wrapClassName && children} {!grid && !wrapClassName && makeHelp(help, helpClassName)} + {!grid && !wrapClassName && error && showError ? makeHelp(error, 'text-help') : ''} ; From d90e8b15cb46b223bdfdd4e356383f0e0a765aa9 Mon Sep 17 00:00:00 2001 From: alan bount Date: Tue, 26 Jul 2016 11:44:51 -0400 Subject: [PATCH 2/3] add prop showInlineError & .help-block/.text-help --- .../src/components/fields/FormGroup.js | 10 ++++++++-- .../src/components/fields/FormGroup.js | 11 +++++++---- 2 files changed, 15 insertions(+), 6 deletions(-) diff --git a/packages/uniforms-bootstrap3/src/components/fields/FormGroup.js b/packages/uniforms-bootstrap3/src/components/fields/FormGroup.js index 06f691594..e2b07693b 100644 --- a/packages/uniforms-bootstrap3/src/components/fields/FormGroup.js +++ b/packages/uniforms-bootstrap3/src/components/fields/FormGroup.js @@ -4,7 +4,10 @@ import classnames from 'classnames'; import gridClassName from '../../lib/gridClassName'; const makeHelp = (help, helpClassName) => help && ( - + {help} ); @@ -21,7 +24,8 @@ const FormGroup = ({ id, label, // string label (or false) required, - wrapClassName // class name for the section wrapping the input(s) + wrapClassName, // class name for the section wrapping the input(s) + showInlineError // boolean, if true, show with error message }) =>
{children} {makeHelp(help, helpClassName)} + {error && showInlineError ? makeHelp(error, 'text-help-error') : ''}
)} {!grid && !wrapClassName && children} {!grid && !wrapClassName && makeHelp(help, helpClassName)} + {!grid && !wrapClassName && error && showInlineError ? makeHelp(error, 'text-help-error') : ''} ; diff --git a/packages/uniforms-bootstrap4/src/components/fields/FormGroup.js b/packages/uniforms-bootstrap4/src/components/fields/FormGroup.js index 3e45f12c3..8488608b7 100644 --- a/packages/uniforms-bootstrap4/src/components/fields/FormGroup.js +++ b/packages/uniforms-bootstrap4/src/components/fields/FormGroup.js @@ -4,7 +4,10 @@ import classnames from 'classnames'; import gridClassName from '../../lib/gridClassName'; const makeHelp = (help, helpClassName) => help && ( - + {help} ); @@ -21,7 +24,7 @@ const FormGroup = ({ label, // string label (or false) required, wrapClassName, // class name for the section wrapping the input(s) - showError // boolean, if true, show with error message + showInlineError // boolean, if true, show with error message }) =>
{children} {makeHelp(help, helpClassName)} - {error && showError ? makeHelp(error, 'text-help') : ''} + {error && showInlineError ? makeHelp(error, 'text-help-error') : ''}
)} {!grid && !wrapClassName && children} {!grid && !wrapClassName && makeHelp(help, helpClassName)} - {!grid && !wrapClassName && error && showError ? makeHelp(error, 'text-help') : ''} + {!grid && !wrapClassName && error && showInlineError ? makeHelp(error, 'text-help-error') : ''} ; From 7ab08520833e666ffc34426f97c275f6ab70715c Mon Sep 17 00:00:00 2001 From: alan bount Date: Tue, 26 Jul 2016 11:52:30 -0400 Subject: [PATCH 3/3] now using errorMessage which is a string (doh) --- .../uniforms-bootstrap3/src/components/fields/FormGroup.js | 5 +++-- .../uniforms-bootstrap4/src/components/fields/FormGroup.js | 5 +++-- 2 files changed, 6 insertions(+), 4 deletions(-) diff --git a/packages/uniforms-bootstrap3/src/components/fields/FormGroup.js b/packages/uniforms-bootstrap3/src/components/fields/FormGroup.js index e2b07693b..1fe9213cb 100644 --- a/packages/uniforms-bootstrap3/src/components/fields/FormGroup.js +++ b/packages/uniforms-bootstrap3/src/components/fields/FormGroup.js @@ -17,6 +17,7 @@ const FormGroup = ({ className, // class name for the whole .form-group disabled, // boolean, if true, show fields as disabled error, // error validation response + errorMessage, // errorMessage string of error feedbackable, // only some input types support feedback icons grid, // grid is either a int [1-11] or object {xs:6,sm:4,md:2} help, // help text @@ -50,13 +51,13 @@ const FormGroup = ({
{children} {makeHelp(help, helpClassName)} - {error && showInlineError ? makeHelp(error, 'text-help-error') : ''} + {errorMessage && showInlineError ? makeHelp(errorMessage, 'text-help-error') : ''}
)} {!grid && !wrapClassName && children} {!grid && !wrapClassName && makeHelp(help, helpClassName)} - {!grid && !wrapClassName && error && showInlineError ? makeHelp(error, 'text-help-error') : ''} + {!grid && !wrapClassName && errorMessage && showInlineError ? makeHelp(errorMessage, 'text-help-error') : ''} ; diff --git a/packages/uniforms-bootstrap4/src/components/fields/FormGroup.js b/packages/uniforms-bootstrap4/src/components/fields/FormGroup.js index 8488608b7..0ecefe1e6 100644 --- a/packages/uniforms-bootstrap4/src/components/fields/FormGroup.js +++ b/packages/uniforms-bootstrap4/src/components/fields/FormGroup.js @@ -17,6 +17,7 @@ const FormGroup = ({ className, // class name for the whole .form-group disabled, // boolean, if true, show fields as disabled error, // error validation response + errorMessage, // errorMessage string of error grid, // grid is either a int [1-11] or object {xs:6,sm:4,md:2} help, // help text helpClassName, // class name for the help text (default: 'text-muted') @@ -45,13 +46,13 @@ const FormGroup = ({
{children} {makeHelp(help, helpClassName)} - {error && showInlineError ? makeHelp(error, 'text-help-error') : ''} + {errorMessage && showInlineError ? makeHelp(errorMessage, 'text-help-error') : ''}
)} {!grid && !wrapClassName && children} {!grid && !wrapClassName && makeHelp(help, helpClassName)} - {!grid && !wrapClassName && error && showInlineError ? makeHelp(error, 'text-help-error') : ''} + {!grid && !wrapClassName && errorMessage && showInlineError ? makeHelp(errorMessage, 'text-help-error') : ''} ;