1

This is my first attempt at setting up a front-end form so my users can update their profile information. The profile is using the VZ Address plugin for the address field.

When I go to the page, it pulls all of my details in. When I update something on the front-end and submit, I get a confirmation message ("Your profile has been updated.") that it went fine, but the fields are not updated. I have template debugging turned on and there are no errors.

Here is my form

{% block content %}
<div class="cell small-12 medium-9">
    {% if craft.session.getFlash('notice') == 'User saved.'|t %}
    <div class="grid-x">
        <div class="cell">
            <div class="callout alert">Your profile has been updated.</div>
        </div>
    </div>
    {% endif %}

    <form method="post" accept-charset="UTF-8">
        {{ getCsrfInput() }}
        <input type="hidden" name="action" value="users/saveUser">
        <input type="hidden" name="redirect" value="/clients/account/profile">
        <input type="hidden" name="userId" value="{{ currentUser.id }}">

        {% macro errorList(errors) %}
            {% if errors %}
                <ul class="errors">
                {% for error in errors %}
                    <li>{{ error }}</li>
                {% endfor %}
                </ul>
            {% endif %}
        {% endmacro %}
        {% from _self import errorList %}

        <div class="grid-x grid-padding-x">
            <fieldset class="cell small-12">
                <label for="firstName">Mailing Name</label><input type="text" id="currentUser.address.name" name="fields[currentUser.address.name]" value="{{ currentUser.address.name }}">
            </fieldset>
        </div>
        <div class="grid-x grid-padding-x">
            <fieldset class="cell small-12">
                <label for="firstName">Address</label><input type="text" id="currentUser.address.street" name="fields[currentUser.address.street]" value="{{ currentUser.address.street }}">
            </fieldset>
        </div>
        <div class="grid-x grid-padding-x">
            <fieldset class="cell small-12">
                <label for="firstName">Address 2</label><input type="text" id="currentUser.address.street2" name="fields[currentUser.address.street2]" value="{{ currentUser.address.street2 }}">
            </fieldset>
        </div>
    <div class="grid-x grid-padding-x">
        <fieldset class="cell small-6">
            <label for="city">City</label><input type="text" id="currentUser.address.city" name="fields[currentUser.address.city]" value="{{ currentUser.address.city }}">
        </fieldset>
        <fieldset class="cell small-3">
            <label for="region">State
            <select>
                <option value="AL"{%if currentUser.address.region=="AL" %} selected{% endif %}>Alabama</option>
                <option value="AK"{%if currentUser.address.region=="AK" %} selected{% endif %}>Alaska</option>
                <option value="AZ"{%if currentUser.address.region=="AZ" %} selected{% endif %}>Arizona</option>
                <option value="AR"{%if currentUser.address.region=="AR" %} selected{% endif %}>Arkansas</option>
                <option value="CA"{%if currentUser.address.region=="CA" %} selected{% endif %}>California</option>
                <option value="CO"{%if currentUser.address.region=="CO" %} selected{% endif %}>Colorado</option>
                <option value="CT"{%if currentUser.address.region=="CT" %} selected{% endif %}>Connecticut</option>
                <option value="DE"{%if currentUser.address.region=="DE" %} selected{% endif %}>Delaware</option>
                <option value="DC"{%if currentUser.address.region=="DC" %} selected{% endif %}>District Of Columbia</option>
                <option value="FL"{%if currentUser.address.region=="FL" %} selected{% endif %}>Florida</option>
                <option value="GA"{%if currentUser.address.region=="GA" %} selected{% endif %}>Georgia</option>
                <option value="HI"{%if currentUser.address.region=="HI" %} selected{% endif %}>Hawaii</option>
                <option value="ID"{%if currentUser.address.region=="ID" %} selected{% endif %}>Idaho</option>
                <option value="IL"{%if currentUser.address.region=="IL" %} selected{% endif %}>Illinois</option>
                <option value="IN"{%if currentUser.address.region=="IN" %} selected{% endif %}>Indiana</option>
                <option value="IA"{%if currentUser.address.region=="IA" %} selected{% endif %}>Iowa</option>
                <option value="KS"{%if currentUser.address.region=="KS" %} selected{% endif %}>Kansas</option>
                <option value="KY"{%if currentUser.address.region=="KY" %} selected{% endif %}>Kentucky</option>
                <option value="LA"{%if currentUser.address.region=="LA" %} selected{% endif %}>Louisiana</option>
                <option value="ME"{%if currentUser.address.region=="ME" %} selected{% endif %}>Maine</option>
                <option value="MD"{%if currentUser.address.region=="MD" %} selected{% endif %}>Maryland</option>
                <option value="MA"{%if currentUser.address.region=="MA" %} selected{% endif %}>Massachusetts</option>
                <option value="MI"{%if currentUser.address.region=="MI" %} selected{% endif %}>Michigan</option>
                <option value="MN"{%if currentUser.address.region=="MN" %} selected{% endif %}>Minnesota</option>
                <option value="MS"{%if currentUser.address.region=="MS" %} selected{% endif %}>Mississippi</option>
                <option value="MO"{%if currentUser.address.region=="MO" %} selected{% endif %}>Missouri</option>
                <option value="MT"{%if currentUser.address.region=="MT" %} selected{% endif %}>Montana</option>
                <option value="NE"{%if currentUser.address.region=="NE" %} selected{% endif %}>Nebraska</option>
                <option value="NV"{%if currentUser.address.region=="NV" %} selected{% endif %}>Nevada</option>
                <option value="NH"{%if currentUser.address.region=="NH" %} selected{% endif %}>New Hampshire</option>
                <option value="NJ"{%if currentUser.address.region=="NJ" %} selected{% endif %}>New Jersey</option>
                <option value="NM"{%if currentUser.address.region=="NM" %} selected{% endif %}>New Mexico</option>
                <option value="NY"{%if currentUser.address.region=="NY" %} selected{% endif %}>New York</option>
                <option value="NC"{%if currentUser.address.region=="NC" %} selected{% endif %}>North Carolina</option>
                <option value="ND"{%if currentUser.address.region=="ND" %} selected{% endif %}>North Dakota</option>
                <option value="OH"{%if currentUser.address.region=="OH" %} selected{% endif %}>Ohio</option>
                <option value="OK"{%if currentUser.address.region=="OK" %} selected{% endif %}>Oklahoma</option>
                <option value="OR"{%if currentUser.address.region=="OR" %} selected{% endif %}>Oregon</option>
                <option value="PA"{%if currentUser.address.region=="PA" %} selected{% endif %}>Pennsylvania</option>
                <option value="RI"{%if currentUser.address.region=="RI" %} selected{% endif %}>Rhode Island</option>
                <option value="SC"{%if currentUser.address.region=="SC" %} selected{% endif %}>South Carolina</option>
                <option value="SD"{%if currentUser.address.region=="SD" %} selected{% endif %}>South Dakota</option>
                <option value="TN"{%if currentUser.address.region=="TN" %} selected{% endif %}>Tennessee</option>
                <option value="TX"{%if currentUser.address.region=="TX" %} selected{% endif %}>Texas</option>
                <option value="UT"{%if currentUser.address.region=="UT" %} selected{% endif %}>Utah</option>
                <option value="VT"{%if currentUser.address.region=="VT" %} selected{% endif %}>Vermont</option>
                <option value="VA"{%if currentUser.address.region=="VA" %} selected{% endif %}>Virginia</option>
                <option value="WA"{%if currentUser.address.region=="WA" %} selected{% endif %}>Washington</option>
                <option value="WV"{%if currentUser.address.region=="WV" %} selected{% endif %}>West Virginia</option>
                <option value="WI"{%if currentUser.address.region=="WI" %} selected{% endif %}>Wisconsin</option>
                <option value="WY"{%if currentUser.address.region=="WY" %} selected{% endif %}>Wyoming</option>
                <option value="">&nbsp;</option>
                <option value="" disabled>-- US Outlying Territories --</option>
                <option value="AS"{%if currentUser.address.region=="AS" %} selected{% endif %}>American Samoa (AS)</option>
                <option value="GU"{%if currentUser.address.region=="GU" %} selected{% endif %}>Guam (GU)</option>
                <option value="MP"{%if currentUser.address.region=="MP" %} selected{% endif %}>Northern Mariana Islands (MP)</option>
                <option value="PR"{%if currentUser.address.region=="PR" %} selected{% endif %}>Puerto Rico (PR)</option>
                <option value="UM"{%if currentUser.address.region=="UM" %} selected{% endif %}>United States Minor Outlying Islands (UM)</option>
                <option value="VI"{%if currentUser.address.region=="VI" %} selected{% endif %}>Virgin Islands (VI)</option>
                <option value="">&nbsp;</option>
                <option value="" disabled>----- Canada Province -----</option>
                <option value="AB"{%if currentUser.address.region=="AB" %} selected{% endif %}>Alberta</option>
                <option value="BC"{%if currentUser.address.region=="BC" %} selected{% endif %}>British Columbia</option>
                <option value="MB"{%if currentUser.address.region=="MB" %} selected{% endif %}>Manitoba</option>
                <option value="NB"{%if currentUser.address.region=="NB" %} selected{% endif %}>New Brunswick</option>
                <option value="NL"{%if currentUser.address.region=="NL" %} selected{% endif %}>Newfoundland and Labrador</option>
                <option value="NS"{%if currentUser.address.region=="NS" %} selected{% endif %}>Nova Scotia</option>
                <option value="NT"{%if currentUser.address.region=="NT" %} selected{% endif %}>Northwest Territories</option>
                <option value="NU"{%if currentUser.address.region=="NU" %} selected{% endif %}>Nunavut</option>
                <option value="ON"{%if currentUser.address.region=="ON" %} selected{% endif %}>Ontario</option>
                <option value="PE"{%if currentUser.address.region=="PE" %} selected{% endif %}>Prince Edward Island</option>
                <option value="QC"{%if currentUser.address.region=="QC" %} selected{% endif %}>Quebec</option>
                <option value="SK"{%if currentUser.address.region=="SK" %} selected{% endif %}>Saskatchewan</option>
                <option value="YT"{%if currentUser.address.region=="YT" %} selected{% endif %}>Yukon</option>
            </select>
            </label>
        </fieldset>
        <fieldset class="cell small-3">
            <label for="postalCode">Zip Code</label><input type="text" id="address.postalCode" name="fields[address.postalCode]" value="{{ currentUser.address.postalCode }}">
        </fieldset>
        </div>
        <input type="submit" value="Save Profile">
    </form>
</div>
{% endblock %}

If I update the information in the CP, then the new information is displayed on the front end.

The "action" value of "users/saveUser" - is this something that I need to create, or is it a system file?

I'm stumped.

  • 1
    What happens if you try using bracket instead of dot syntax for your field names? For example, ...type="text" name="fields[address][name]"...? – Damon Oct 25 '17 at 14:12
  • Same - tells me that it updated successfully, but still the old information. – Todd Oct 25 '17 at 15:41
  • Actually, this does work for my custom fields (not for the built-in fields though like firstName, lastName, email). – Todd Oct 25 '17 at 16:32
  • I figured out the "built-in" fields. If you can add your comment as an answer I will give you credit! – Todd Oct 25 '17 at 16:48
2

The First Name and other built-in fields are kind of special. You can access them directly without having to prefix them with fields.

To use other custom fields, try using bracket syntax instead of dot syntax.

For example:

<div class="form-group">
    <label for="address">
        Street Address<span><small><i class="fa fa-asterisk"></i></small></span>
    </label>
    <input type="text" name="fields[address][name]" class="form-control" {%- if currentUser is defined %} value="{{ currentUser.address.name }}"{% endif -%}>
    {{ currentUser is defined and currentUser ? errorList(currentUser.getErrors('address.name')) }}
</div>

Hope this helps!

1

I think that instead of

fields[currentUser.address.city]

you need to refer to the fields like this

fields[address.city]

or even

fields[address][city]

perhaps even

fields[0][address][city]

In retrospect, this answer isn't very helpful.

  • It turns out, for my custom fields this works <input type="text" id="city" name="fields[address][city]" value="{{ currentUser.address.city }}">. Technically Damon's "answer" is correct but thank you so much for chiming in! – Todd Oct 25 '17 at 16:48

Your Answer

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

Not the answer you're looking for? Browse other questions tagged or ask your own question.