Because I used a similar address model to the one supplied in the Craft Commerce templates, which essentially uses the same form partials for both address and billing, and also hides and shows the form using JavaScript, I can't use HTML required attributes.
Is there an easy way to add in the config files a way to make 'shipping.phone' required and return an error in the same way the default required fields work?
<div class="inputGroup{% if model and model.hasErrors('phone') %} error{% endif%}">
<h3 class="small">Contact details</h3>
<div class="inputWrap">
<input type="text" id="{{ modelName }}-phone" class="u-full-width" name="{{ modelName }}[phone]" value="{{ model ? model.phone : '' }}">
<span class="highlight"></span>
<span class="bar"></span>
<label for="{{ modelName }}-phone">Telephone number</label>
<span class="flash">{% if model and model.hasErrors('phone') %}{{ model.getError('phone') }}{% else %}Required{% endif %}</span>
</div>
<p class="footnote">In case we need to contact you about important details regarding your order.</p>
</div>
<div class="inputGroup{% if model and model.hasErrors('phone') %} error{% endif%}">
<h3 class="small">Contact details</h3>
<div class="inputWrap">
<input type="text" id="{{ modelName }}-phone" class="u-full-width" name="{{ modelName }}[phone]" value="{{ model ? model.phone : '' }}">
<span class="highlight"></span>
<span class="bar"></span>
<label for="{{ modelName }}-phone">Telephone number</label>
<span class="flash">{% if model and model.hasErrors('phone') %}{{ model.getError('phone') }}{% else %}Required{% endif %}</span>
</div>
<p class="footnote">In case we need to contact you about important details regarding your order.</p>
</div>