Skip to content

Commit

Permalink
impliment disbale conditionals for cf2 fields #2766
Browse files Browse the repository at this point in the history
  • Loading branch information
Josh Pollock committed Oct 19, 2018
1 parent b96204b commit 26b7a9c
Show file tree
Hide file tree
Showing 4 changed files with 78 additions and 26 deletions.
33 changes: 30 additions & 3 deletions clients/render/build/index.min.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23018,6 +23018,8 @@ var CalderaFormsRender = function (_Component) {
});
_this.state = fieldValues;
_this.setFieldValue = _this.setFieldValue.bind(_this);
_this.setFieldShouldShow = _this.setFieldShouldShow.bind(_this);
_this.setFieldShouldDisable = _this.setFieldShouldDisable.bind(_this);
return _this;
}

Expand Down Expand Up @@ -23050,12 +23052,32 @@ var CalderaFormsRender = function (_Component) {
value: function getFieldValue(fieldIdAttr) {
return this.getCfState().getState(fieldIdAttr);
}

/**
* Set a field show or hide
*
* @since 1.8.0
*
* @param {String} fieldIdAttr The field's id attribute (not field ID, html id attribute)
* @param {boolean} show If field should be shown (true) or hidden (false).
*/

}, {
key: 'setFieldShouldShow',
value: function setFieldShouldShow(fieldIdAttr, show) {
var key = shouldShowKey(fieldIdAttr);
this.setState(__WEBPACK_IMPORTED_MODULE_1_babel_runtime_helpers_defineProperty___default()({}, key, show));
}

/**
* Set a field disabled or enabled
*
* @since 1.8.0
*
* @param {String} fieldIdAttr The field's id attribute (not field ID, html id attribute)
* @param {boolean} disable If field should be enabled (true) or disabled (false).
*/

}, {
key: 'setFieldShouldDisable',
value: function setFieldShouldDisable(fieldIdAttr, disable) {
Expand Down Expand Up @@ -23126,15 +23148,15 @@ var CalderaFormsRender = function (_Component) {
return _this3.setFieldValue(fieldIdAttr, newValue, false);
});
}
var conditioanlEvents = ['show', 'hide', 'enable', 'disable'];
var conditionalEvents = ['show', 'hide', 'enable', 'disable'];
var _props = this.props,
formId = _props.formId,
formIdAttr = _props.formIdAttr;

if (!conditionalEventSubscriptions.hasOwnProperty(fieldIdAttr)) {
conditionalEventSubscriptions[fieldIdAttr] = {};
}
conditioanlEvents.forEach(function (conditionalEvent) {
conditionalEvents.forEach(function (conditionalEvent) {
if (!conditionalEventSubscriptions[fieldIdAttr].hasOwnProperty(conditionalEvent)) {
conditionalEventSubscriptions[fieldIdAttr][conditionalEvent] = _this3.getCfState().events().attatchEvent('cf.conditionals.' + conditionalEvent, function (eventData, eventName) {
if (formIdAttr === eventData.formIdAttr) {
Expand All @@ -23149,9 +23171,13 @@ var CalderaFormsRender = function (_Component) {
_this3.setFieldShouldShow(_fieldIdAttr, true);
break;
case 'enable':
_this3.setFieldShouldDisable(_fieldIdAttr, false);
break;
case 'disable':
_this3.setFieldShouldDisable(_fieldIdAttr, true);
break;
default:
break;

}
}
});
Expand Down Expand Up @@ -23554,6 +23580,7 @@ var CalderaFormsFieldRender = function CalderaFormsFieldRender(props) {
type: type,
disabled: shouldDisable,
value: fieldValue,
required: required,
className: 'form-control',
id: fieldIdAttr,
placeholder: fieldPlaceHolder,
Expand Down
2 changes: 1 addition & 1 deletion clients/render/build/index.min.js.map
View file

Large diffs are not rendered by default.

1 change: 1 addition & 0 deletions clients/render/components/CalderaFormsFieldRender.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -45,6 +45,7 @@ export const CalderaFormsFieldRender = (props) => {
type={type}
disabled={shouldDisable}
value={fieldValue}
required={required}
className={'form-control'}
id={fieldIdAttr}
placeholder={fieldPlaceHolder}
Expand Down
68 changes: 46 additions & 22 deletions clients/render/components/CalderaFormsRender.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,8 @@ export class CalderaFormsRender extends Component {
});
this.state = fieldValues;
this.setFieldValue = this.setFieldValue.bind(this);
this.setFieldShouldShow = this.setFieldShouldShow.bind(this);
this.setFieldShouldDisable = this.setFieldShouldDisable.bind(this);
}

/**
Expand All @@ -73,14 +75,30 @@ export class CalderaFormsRender extends Component {
return this.getCfState().getState(fieldIdAttr);
}

setFieldShouldShow(fieldIdAttr,show) {
/**
* Set a field show or hide
*
* @since 1.8.0
*
* @param {String} fieldIdAttr The field's id attribute (not field ID, html id attribute)
* @param {boolean} show If field should be shown (true) or hidden (false).
*/
setFieldShouldShow(fieldIdAttr, show) {
const key = shouldShowKey(fieldIdAttr);
this.setState({
[key]: show
});
}

setFieldShouldDisable(fieldIdAttr,disable) {
/**
* Set a field disabled or enabled
*
* @since 1.8.0
*
* @param {String} fieldIdAttr The field's id attribute (not field ID, html id attribute)
* @param {boolean} disable If field should be enabled (true) or disabled (false).
*/
setFieldShouldDisable(fieldIdAttr, disable) {
const key = shouldDisableKey(fieldIdAttr);
this.setState({
[key]: disable
Expand Down Expand Up @@ -136,7 +154,7 @@ export class CalderaFormsRender extends Component {
.events()
.subscribe(fieldIdAttr, (newValue, fieldIdAttr) => this.setFieldValue(fieldIdAttr, newValue, false))
}
const conditioanlEvents = [
const conditionalEvents = [
'show',
'hide',
'enable',
Expand All @@ -146,34 +164,40 @@ export class CalderaFormsRender extends Component {
if (!conditionalEventSubscriptions.hasOwnProperty(fieldIdAttr)) {
conditionalEventSubscriptions[fieldIdAttr] = {}
}
conditioanlEvents.forEach(conditionalEvent => {
conditionalEvents.forEach(conditionalEvent => {
if (!conditionalEventSubscriptions[fieldIdAttr].hasOwnProperty(conditionalEvent)) {
conditionalEventSubscriptions[fieldIdAttr][conditionalEvent] = this.getCfState()
.events().attatchEvent(`cf.conditionals.${conditionalEvent}`, (eventData, eventName) => {
if (formIdAttr === eventData.formIdAttr) {
const {eventType, fieldIdAttr} = eventData;
switch (eventType) {
case 'hide':
this.setFieldShouldShow(fieldIdAttr,false);
break;
case 'show' :
this.setFieldShouldShow(fieldIdAttr,true);
break;
case 'enable':
case 'disable':
break;

.events().
attatchEvent(`cf.conditionals.${conditionalEvent}`,
(eventData, eventName) => {
if (formIdAttr === eventData.formIdAttr) {
const {eventType, fieldIdAttr} = eventData;
switch (eventType) {
case 'hide':
this.setFieldShouldShow(fieldIdAttr, false);
break;
case 'show' :
this.setFieldShouldShow(fieldIdAttr, true);
break;
case 'enable':
this.setFieldShouldDisable(fieldIdAttr, false);
break;
case 'disable':
this.setFieldShouldDisable(fieldIdAttr, true);
break;
default:
break;
}
}
}
});
}
})
});
}

/** @inheritDoc */
render() {
const {state,props} = this;
const {fieldsToControl} =props;
const {state, props} = this;
const {fieldsToControl} = props;

return (
<Fragment>
Expand Down

0 comments on commit 26b7a9c

Please sign in to comment.