Has anyone found a way to create matrix field submissions with a frontend form?

The docs for 5.x mention this section hasn't been updated and that the functionality has changed drastically.

Craft 5.x - Saving Matrix Fields

I'm trying to store user social media profiles (title and url fields) but can't find a way to save them upon registration. I have even tried setting the min/max to 5 so I know how many there will be. Each new user has 5 fields available in their profile via the CP, but they do not show up on the front end, my query returns no results.

With the code below, I am able to display existing matrix content, once either field contains data.

{% set userSocialProfiles = user.socialMediaProfiles %}

{% set profileCount = userSocialProfiles|length %}

{% if userSocialProfiles|length > 0 %}
    {% set socialCount = 0 %}
    <div class="relative formGroup">
        <label for="SocialMediaProfiles" class="formLabel w-full">
            <strong>Social Media Profiles</strong>
        <div class="relative formGroupSplit flex-wrap">

            {% for  profile in  userSocialProfiles %}
                {% set socialCount = socialCount+1 %}
                <div id="social_Profile_{{socialCount}}" class="relative formGroupMulti">
                    <label for="socialProfile-{{socialCount}}" class="formLabel text-sm">Profile
                    <div class="relative formGroup w-full gap-2">
                        {% set profileTitle = 'fields[socialMediaProfiles][entries][uid:' ~ (profile.uid) ~ '][fields][altTitle]' %}
                        {{ input('text', profileTitle, profile.title ? null, {
                            id: profileTitle,
                            name: profileTitle,
                            class: 'formInputText ' ~ (user ? user.hasErrors('profileTitle') ? ' formInputError' : ''),
                            autocomplete: profileTitle ? null,
                        }) }}
                        {{ _self.errorList(user.getErrors(profileTitle)) }}
                        {% set profileUrl = 'fields[socialMediaProfiles][entries][uid:' ~ (profile.uid) ~ '][fields][offSiteUrl]' %}
                        {{ input('url', profileUrl, profile.offSiteUrl, {
                            id: profileUrl,
                            class: 'formInputText ' ~ (user ? user.hasErrors('profileUrl') ? ' formInputError' : ''),
                            autocomplete: profileUrl,
                        }) }}
                        {{ _self.errorList(user.getErrors(profileUrl)) }}
            {% endfor %}
{% endif %}

These users will not have access to the CP so I need to find a way to display the phantom fields visible in the CP, via the frontend.

Any suggestions would be appreciated!


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.