I have a form with fields. If RiskType field is ILI and at the same time 'Limit Type' field is I or Y, then
The Settlement drop down list is inserted
my question is how to make the netSettlement variable set value the first option in select. If this form has been inserted in the DOM (logically, if the form is not inserted, the value is not set)
{(riskType === 'ILI' && (limitType === 'Y' || limitType === 'I')) &&
<Form.Row>
<Form.Group controlId='formGridNetSettlement'>
<Form.Label>Settlement</Form.Label>
<Form.Control name='netSettlement' as='select' value={netSettlement}
onChange={e => {setNetSettlement(e.currentTarget.value)} }
required={!isSearch}>
<option>True</option>
<option>False</option>
</Form.Control>
</Form.Group>
</Form.Row>
}
You'll want to add the selected attribute to the option that you want pre-selected when the form is loaded:
<option selected value="true">True</option>
<option value="false">False</option>
Also, you will want to set the value attribute with the actual value you want to submit.
You do not have values in options at all. If you're receiving Boolean value for netSettlement try this
{
riskType === "ILI" && (limitType === "Y" || limitType === "I") && (
<Form.Row>
<Form.Group controlId="formGridNetSettlement">
<Form.Label>Settlement</Form.Label>
<Form.Control
name="netSettlement"
as="select"
value={netSettlement.toString()}
onChange={(e) => {
setNetSettlement(e.currentTarget.value);
}}
required={!isSearch}
>
<option value="true">True</option>
<option value="false">False</option>
</Form.Control>
</Form.Group>
</Form.Row>
);
}