[Solved] Password recovery helper doesn't open my modal

I’m using this guide to implement a password reset. When the user clicks the generated link it should open my “resetPassword” modal in Bootstrap.

In my client\main.js I have this code:

Template.recoverpopup.helpers({
    resetPassword : function(t) {
        return Session.get('resetPassword');
        Modal.show('reset_password');
    }
});

if (Accounts._resetPasswordToken) {
    Session.set('resetPassword', Accounts._resetPasswordToken);
}

The resetPassword session variable returns a value through the console. I’m new to Meteor and I’m still figuring it all out but I think the function isn’t running.

Template code:

<template name="recoverpopup">
    {{#if resetPassword}}
        <div class="modal fade" id="reset_password" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
            <div class="modal-dialog">
                <div class="loginmodal-container">
                    <h1>Reset je wachtwoord</h1><br>
                    <div id="reset_error" class="alert alert-danger hide">
                        <strong>Error:</strong>
                    </div>

                    <form id="resetform">
                        <input type="password" name="pass" id="newpassword" placeholder="Nieuw wachtwoord">
                        <input type="submit" name="reset" class="register loginmodal-submit" value="Reset">
                    </form>
                </div>
            </div>
        </div>
    {{else}}
        <div class="modal fade" id="recovermodal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
            <div class="modal-dialog">
                <div class="loginmodal-container">
                    <h1>Wachtwoord vergeten</h1><br>
                    <div id="recover_error" class="alert alert-danger hide">
                        <strong>Error:</strong>
                    </div>
                    <div id="recover_info" class="alert alert-info hide">
                        <strong>Info:</strong>
                    </div>
                    <form id="recoverform">
                        <input type="email" name="email" placeholder="Email-adres">
                        <!--<input type="password" name="pass" placeholder="Password">-->
                        <input type="submit" name="recover" class="login loginmodal-submit" value="Verstuur">
                    </form>

                    <div class="login-help">
                        <a href="#" data-toggle="modal" data-target="#registermodal" onclick="$('#recovermodal').modal('hide');">Registreer</a> - <a href="#" data-toggle="modal" data-target="#loginmodal" onclick="$('#recovermodal').modal('hide');" >Login</a>
                    </div>
                </div>
            </div>
        </div>
    {{/if}}
</template>

Without diving too deep – any code after your return isn’t going to run, so you should probably call your modal first?

1 Like

Wow. How I didn’t think of that… Thanks!

1 Like