Fix #82: Also set disabled attr when readonly is true

Author: bhch

src/components/autocomplete.js

@@ -130,6 +130,7 @@ export default class AutoCompleteInput extends React.Component {
                     help_text={this.props.help_text}
                     error={this.props.error}
                     readOnly={true}
+                    disabled={this.props.readOnly || false}
                     onClick={this.toggleOptions}
                     inputRef={this.input}
                     placeholder={this.props.placeholder}

src/components/form.js

@@ -34,6 +34,11 @@ export function FormInput({label, help_text, error, inputRef, ...props}) {
     if (props.type == 'hidden')
         wrapperProps['style'] = {display:  'none'};
 
+    // readonly inputs are automatically marked disabled
+    // if this is undesired, explicitly pass disabled=false
+    if (props.readOnly && (props.disabled === undefined || props.disabled === null))
+        props.disabled = true;
+
     return (
         <div {...wrapperProps}>
             <Label label={label} required={props.required} />
@@ -768,6 +773,7 @@ export class FormDateTimeInput extends React.Component {
                                 value={this.state.hh + ':' + this.state.mm + ':' + this.state.ss + ' ' + this.state.ampm}
                                 onFocus={this.showTimePicker}
                                 readOnly={true}
+                                disabled={this.props.readOnly || false}
                                 inputRef={this.timeInput}
                             />
                             <div ref={this.timePickerContainer}>