I'm afraid I'm getting stuck. Here's where I am:
<label for="street">Residential address* (e.g. 1)</label>
<SELECT class="form-control" name="streetlist" form="payment-form">
<option value=""></option>
<option value="Street1">1</option>
<option value="Street2">2</option>
</SELECT>
<input class="form-control" maxlength="13" type="text" name="street" id="street" value="<?php if (!$form_valid && !empty($_POST)){ echo $street;} ?>" required >
I made the 1st <option> blank as an attempt to have the person select a street instead of leaving it at default.
The page still displays the original input field AND now a select box. So I remove the <input> section leaving:
<label for="street">Residential address* (e.g. 1)</label>
<SELECT class="form-control" name="streetlist" form="payment-form">
<option value=""></option>
<option value="Street1">1</option>
<option value="Street2">2</option>
</SELECT>
Now I've lost the php required validation. Some more messing around and found this to work:
<label for="street">Residential address* (e.g. 1 Douglas Carr)</label>
<SELECT class="form-control" name="streetlist" form="payment-form" value="<?php if (!$form_valid && !empty($_POST)){ echo $street;} ?>" required >
<SELECT class="form-control" name="streetlist" form="payment-form">
<option value=""></option>
<option value="Street1">1</option>
<option value="Street2">2</option>
</SELECT>
Problem solved. Happiness. Well, almost