Permalink
Browse files

Added logic to disable the 'Edit item...' <ButtonWidget> when the num…

…ber of items selected via checkboxes is any number other than 1, and to disable the 'Remove item...' <ButtonWidget> when the number of selected items is 0.
  • Loading branch information...
maratbn committed Jul 1, 2018
1 parent 9ebd9ca commit 9b0124fd4776fe28b995aff6c29d738e22439e34
Showing with 8 additions and 2 deletions.
  1. +8 −2 webpack_in/entry.jsx
@@ -26,13 +26,15 @@ class ButtonWidget extends React.Component {
render() {
return (
<button style={{ margin: '1em'}}
disabled={ this.props.isDisabled }
onClick={ this.props.onClick }>{ this.props.caption }</button>
);
}
}
ButtonWidget.propTypes = {
caption: PropTypes.string.isRequired,
isDisabled: PropTypes.bool,
onClick: PropTypes.func
};
@@ -131,6 +133,8 @@ class ListWidget extends React.Component {
}
render() {
const arrItemsSelected = this.state.items.filter(objItem => objItem.is_checked);
return (
<div style={ objStyleCommon }>
<div style={ objStyleContent }>
@@ -163,8 +167,10 @@ class ListWidget extends React.Component {
this.setState(this._mutateStateToAddItem(this.state,
strItemNew));
}}/>
<ButtonWidget caption="Edit item..." />
<ButtonWidget caption="Remove item..." />
<ButtonWidget caption="Edit item..."
isDisabled={ arrItemsSelected.length !== 1 }/>
<ButtonWidget caption="Remove item..."
isDisabled={ arrItemsSelected.length === 0 }/>
</div>
</div>
);

0 comments on commit 9b0124f

Please sign in to comment.