Allow users to change email address on front-end form

Question

I've got a front-end user profile form working on a client site I'm developing, but the one thing that I'm having trouble with is allowing users to change the email address associated with their account via this form.

When I use my email field to attempt an email address change, I get a verification email generated by Craft sent to the new email address, but the email change is not reflected in either the CP or on the front-end when I refresh the form.

I've pasted an abbreviated version of my form below with some irrelevant fields omitted.

What am I missing?

 <form method="post" accept-charset="UTF-8" enctype="multipart/form-data">

    {{ getCsrfInput() }}
    <input type="hidden" name="action" value="users/saveUser">
    <input type="hidden" name="redirect" value="account/my-account?m=updated">
    <input type="hidden" name="userId" value="{{ currentUser.id }}">

    {% macro errorList(errors) %}
        {% if errors %}
            {% for error in errors %}
                <p class="error-block">{{ error }}</p>
            {% endfor %}
        {% endif %}
    {% endmacro %}

    {% from _self import errorList %}

    <fieldset>

        <label for="firstName">Username</label>
        <input id="username" type="text" name="username" value="{{ currentUser.username}}">
        {% if account is defined %}
            {{ errorList(account.getErrors('username')) }}
        {% endif %}

        <label for="firstName">First name</label>
        <input id="firstName" type="text" name="firstName" value="{{ currentUser.firstName}}">

        <label for="lastName">Last name</label>
        <input id="lastName" type="text" name="lastName" value="{{ currentUser.lastName }}">

    </fieldset>

    <fieldset>
        <p>Fill in both fields below to change the email address associated with your account</p>

        <label for="email">Email</label>
        <input id="email" type="text" name="email" value="{{ currentUser.email }}">
        {% if account is defined %}
            {{ errorList(account.getErrors('email')) }}
        {% endif %}

        <label for="password">Current Password</label>
        <input type="text" id="currentPassword" name="password" />
        {% if account is defined %}
            {{ errorList(account.getErrors('currentPassword')) }}
        {% endif %}
    </fieldset>      

    <input class="btn btn-primary btn-large" type="submit" value="Save changes" />

</form>

Answer 1

When I use my email field to attempt an email address change, I get a verification email generated by Craft sent to the new email address, but the email change is not reflected in either the CP or on the front-end when I refresh the form.

The user's email address won't actually update until you click the link in the verification email the user receives.