0

I currently have the following code as part of the address form in Craft Commerce.

        <label class="label" for="{{ modelName }}-firstName">First Name (*)</label>
        <input type="text" id="{{ modelName }}-firstName" {% if model and model.getErrors('firstName') %}class="has-error"{% endif %} name="{{ modelName }}[firstName]" value="{{ model ? model.firstName : '' }}">
        {% if model and model.getErrors('firstName') %}
            <span class="has-error">
                <svg role="img" class="icon" title="Error Icon">
                    <use xlink:href="/assets/img/icons.svg#icon-error"></use>
                </svg>
                {{ model.getError('firstName') }}
            </span>
        {% endif %}

This repeats several times for each form item (surname, address1, address2, postcode, country etc).

I also want to reuse the error code part for other areas on the website, when errors occur, be this discount code box, login form etc.

<span class="has-error">
    <svg role="img" class="icon" title="Error Icon">
        <use xlink:href="/assets/img/icons.svg#icon-error"></use>
    </svg>
    {{ model.getError('firstName') }} //This part will change based on application.
</span>

My question is how can I extract this part to ensure it is DRYer and not repeat it over and over? So if I want to change the class, the icon etc, I won't have loads of separate pieces of code to update.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.