I am simply trying to disable a field in redux-form as shown below but it does not seem to have any effect. This is redux-form version 7.4.2.
<Field name="mu" type="text" component={renderField} label="DRIFT FUNCTION [ μ(X(t),t) ]:" disabled={true} validate={[required]} /> Also
<Field name="mu" type="text" component={renderField} label="DRIFT FUNCTION [ μ(X(t),t) ]:" props={{ disabled: true }} validate={[required]} /> Any help please
You can pass the props object:
props : object [optional]: Object with custom props to pass through the Field component into a component provided to component prop. This props will be merged to props provided by Field itself.
// outside your render() method const renderField = field => ( <div> <input {...field.input} disabled={field.disabled} // you'll use it here type="text" /> </div> ); // inside your render() method <Field name="myField" props={{ disabled: true, // like this }}, component={renderField} /> 
input={{ disabled: true, }} if you need set disabled by conditions.Apparently, it works if you provide primitive react components rather than functions:
<Field name="firstName" component="input" type="text" disabled={true} placeholder="First Name" /> 
So I think the problem in your case is inside the renderField function you have not shown.
disabled={true} in case of "true" booleans. Putting just disabled is also ok.
Field just passes this (as any unknown prop) to the inner component. HTML builtin components tags like <input> take a disabled attribute; custom componend={...} may take some else, or not support disabling at all...input={{ disabled: true, }}
add this to your Field tag
If you are working with redux-Form given code can work as @Vanun explained
<Field name="Name" component="fieldset" type="text" disabled={true} /> 