Fixed #952 - Fixed #953 - Add required prop to RadioButton and Checkbox

primefaces · Jul 4, 2019 · e1dfd77 · e1dfd77
1 parent 5d71691
commit e1dfd77
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 2 deletions.
diff --git a/src/components/checkbox/Checkbox.d.ts b/src/components/checkbox/Checkbox.d.ts
@@ -10,6 +10,7 @@ interface CheckboxProps {
     style?: object;
     className?: string;
     disabled?: boolean;
+    required?: boolean;
     readOnly?: boolean;
     tooltip?: any;
     tooltipOptions?: TooltipOptions;

diff --git a/src/components/checkbox/Checkbox.js b/src/components/checkbox/Checkbox.js
@@ -14,6 +14,7 @@ export class Checkbox extends Component {
         style: null,
         className: null,
         disabled: false,
+        required: false,
         readOnly: false,
         tooltip: null,
         tooltipOptions: null,
@@ -31,6 +32,7 @@ export class Checkbox extends Component {
         style: PropTypes.object,
         className: PropTypes.string,
         disabled: PropTypes.bool,
+        required: PropTypes.bool,
         readOnly: PropTypes.bool,
         tooltip: PropTypes.string,
         tooltipOptions: PropTypes.object,
@@ -129,7 +131,7 @@ export class Checkbox extends Component {
             <div ref={(el) => this.element = el} id={this.props.id} className={containerClass} style={this.props.style} onClick={this.onClick} onContextMenu={this.props.onContextMenu} onMouseDown={this.props.onMouseDown}>
                 <div className="p-hidden-accessible">
                     <input type="checkbox" ref={el => this.input = el} id={this.props.inputId} name={this.props.name} defaultChecked={this.props.checked} 
-                             onKeyDown={this.onKeyDown} onFocus={this.onFocus} onBlur={this.onBlur} disabled={this.props.disabled} readOnly={this.props.readOnly}/>
+                             onKeyDown={this.onKeyDown} onFocus={this.onFocus} onBlur={this.onBlur} disabled={this.props.disabled} readOnly={this.props.readOnly} required={this.props.required}/>
                 </div>
                 <div className={boxClass} ref={el => this.box = el} role="checkbox" aria-checked={this.props.checked}>
                     <span className={iconClass}></span>

diff --git a/src/components/radiobutton/RadioButton.d.ts b/src/components/radiobutton/RadioButton.d.ts
@@ -10,6 +10,7 @@ interface RadioButtonProps {
     style?: object;
     className?: string;
     disabled?: boolean;
+    required?: boolean;
     tooltip?: any;
     tooltipOptions?: TooltipOptions;
     onChange(e: {originalEvent: Event, value: any, checked: boolean}): void;

diff --git a/src/components/radiobutton/RadioButton.js b/src/components/radiobutton/RadioButton.js
@@ -14,6 +14,7 @@ export class RadioButton extends Component {
         style: null,
         className: null,
         disabled: false,
+        required: false,
         tooltip: null,
         tooltipOptions: null,
         onChange: null
@@ -27,6 +28,7 @@ export class RadioButton extends Component {
         style: PropTypes.object,
         className: PropTypes.string,
         disabled: PropTypes.bool,
+        required: PropTypes.bool,
         onChange: PropTypes.func,
         tooltip: PropTypes.string,
         tooltipOptions: PropTypes.object
@@ -116,7 +118,8 @@ export class RadioButton extends Component {
         return (
             <div ref={(el) => this.element = el} id={this.props.id} className={containerClass} style={this.props.style} onClick={this.onClick}>
                 <div className="p-hidden-accessible">
-                    <input id={this.props.inputId} ref={(el) => this.input = el} type="radio" name={this.props.name} defaultChecked={this.props.checked} onFocus={this.onFocus} onBlur={this.onBlur} disabled={this.props.disabled}/>
+                    <input id={this.props.inputId} ref={(el) => this.input = el} type="radio" name={this.props.name} defaultChecked={this.props.checked} 
+                        onFocus={this.onFocus} onBlur={this.onBlur} disabled={this.props.disabled} required={this.props.required}/>
                 </div>
                 <div className={boxClass} ref={(el) => { this.box = el; }}>
                     <span className={iconClass}></span>