Skip to content

Commit f76a2d0

Browse files
author
Koji Miyauchi
committed
Added error display for group question type
1 parent b3edbcd commit f76a2d0

2 files changed

Lines changed: 69 additions & 13 deletions

File tree

‎lib/FormFields/renderAddAnother.js‎

Lines changed: 37 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -37,13 +37,28 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
3737
var renderAddAnother = function (_React$Component) {
3838
_inherits(renderAddAnother, _React$Component);
3939

40-
function renderAddAnother() {
40+
function renderAddAnother(props) {
4141
_classCallCheck(this, renderAddAnother);
4242

43-
return _possibleConstructorReturn(this, (renderAddAnother.__proto__ || Object.getPrototypeOf(renderAddAnother)).apply(this, arguments));
43+
var _this = _possibleConstructorReturn(this, (renderAddAnother.__proto__ || Object.getPrototypeOf(renderAddAnother)).call(this));
44+
45+
_this.init = false;
46+
_this.touched = false;
47+
return _this;
4448
}
4549

4650
_createClass(renderAddAnother, [{
51+
key: 'componentDidUpdate',
52+
value: function componentDidUpdate() {
53+
var fields = this.props.fields;
54+
55+
if (!this.init) {
56+
fields.push();
57+
fields.remove(0);
58+
this.init = true;
59+
}
60+
}
61+
}, {
4762
key: 'render',
4863
value: function render() {
4964
var _this2 = this;
@@ -60,7 +75,11 @@ var renderAddAnother = function (_React$Component) {
6075
disabled = _props.disabled,
6176
preview = _props.preview,
6277
withContext = _props.withContext,
63-
error = _props.meta.error;
78+
globalError = _props.globalError,
79+
name = _props.name,
80+
_props$meta = _props.meta,
81+
error = _props$meta.error,
82+
submitFailed = _props$meta.submitFailed;
6483

6584

6685
var Comp = withContext ? _index.DraggableWithContext : _index.Draggable;
@@ -69,7 +88,7 @@ var renderAddAnother = function (_React$Component) {
6988
'div',
7089
{
7190
className: (0, _classnames2.default)(className, 'wfui-form-item', {
72-
'wfui-form-item-error': error
91+
'wfui-form-item-error': error || globalError
7392
}, { 'wfui-form-disabled': disabled }, { 'wfui-form-preview': preview })
7493
},
7594
_react2.default.createElement(
@@ -86,7 +105,7 @@ var renderAddAnother = function (_React$Component) {
86105
_index.FormGroup,
87106
{
88107
className: 'wfui-form-addAnother',
89-
validationState: error ? 'error' : null
108+
validationState: error || globalError ? 'error' : null
90109
},
91110
!disabled && draggable && fields.length > 0 && _react2.default.createElement(
92111
Comp,
@@ -121,7 +140,8 @@ var renderAddAnother = function (_React$Component) {
121140
{
122141
className: 'delete-icon',
123142
onClick: function onClick() {
124-
return fields.remove(i);
143+
fields.remove(i);
144+
_this2.touched = true;
125145
}
126146
},
127147
'Delete'
@@ -139,7 +159,8 @@ var renderAddAnother = function (_React$Component) {
139159
{
140160
className: 'delete-icon',
141161
onClick: function onClick() {
142-
return fields.remove(i);
162+
fields.remove(i);
163+
_this2.touched = true;
143164
}
144165
},
145166
'Delete'
@@ -166,6 +187,15 @@ var renderAddAnother = function (_React$Component) {
166187
error
167188
)
168189
),
190+
(this.touched || submitFailed) && globalError && _react2.default.createElement(
191+
_index.HelpBlock,
192+
{ className: 'wfui-form-error' },
193+
_react2.default.createElement(
194+
'span',
195+
null,
196+
globalError
197+
)
198+
),
169199
help && _react2.default.createElement('div', {
170200
className: 'wfui-form-description',
171201
dangerouslySetInnerHTML: { __html: help }

‎src/FormFields/renderAddAnother.jsx‎

Lines changed: 32 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,19 @@ import {
1414
} from '../index';
1515

1616
class renderAddAnother extends React.Component {
17+
constructor(props) {
18+
super();
19+
this.init = false;
20+
this.touched = false;
21+
}
22+
componentDidUpdate(){
23+
const { fields } = this.props;
24+
if (!this.init) {
25+
fields.push();
26+
fields.remove(0);
27+
this.init = true;
28+
}
29+
}
1730
render() {
1831
const {
1932
className,
@@ -27,18 +40,20 @@ class renderAddAnother extends React.Component {
2740
disabled,
2841
preview,
2942
withContext,
30-
meta: { error },
43+
globalError,
44+
name,
45+
meta: { error, submitFailed },
3146
} = this.props;
3247

3348
const Comp = withContext ? DraggableWithContext : Draggable;
34-
49+
3550
return (
3651
<div
3752
className={classNames(
3853
className,
3954
'wfui-form-item',
4055
{
41-
'wfui-form-item-error': error,
56+
'wfui-form-item-error': error || globalError,
4257
},
4358
{ 'wfui-form-disabled': disabled },
4459
{ 'wfui-form-preview': preview },
@@ -48,7 +63,7 @@ class renderAddAnother extends React.Component {
4863
{required && <b className="required"> *</b>}
4964
<FormGroup
5065
className="wfui-form-addAnother"
51-
validationState={error ? 'error' : null}
66+
validationState={(error || globalError) ? 'error' : null}
5267
>
5368
{!disabled &&
5469
draggable &&
@@ -76,7 +91,10 @@ class renderAddAnother extends React.Component {
7691
{!disabled && (
7792
<a
7893
className="delete-icon"
79-
onClick={() => fields.remove(i)}
94+
onClick={() => {
95+
fields.remove(i);
96+
this.touched = true;
97+
}}
8098
>
8199
Delete
82100
</a>
@@ -92,7 +110,10 @@ class renderAddAnother extends React.Component {
92110
{!disabled && (
93111
<a
94112
className="delete-icon"
95-
onClick={() => fields.remove(i)}
113+
onClick={() => {
114+
fields.remove(i);
115+
this.touched = true;
116+
}}
96117
>
97118
Delete
98119
</a>
@@ -115,6 +136,11 @@ class renderAddAnother extends React.Component {
115136
<span>{error}</span>
116137
</HelpBlock>
117138
)}
139+
{(this.touched || submitFailed) && globalError && (
140+
<HelpBlock className="wfui-form-error">
141+
<span>{globalError}</span>
142+
</HelpBlock>
143+
)}
118144
{help && (
119145
<div
120146
className="wfui-form-description"

0 commit comments

Comments
 (0)