Require a Membership User to Login to Register for Events & Stay on the Same Page

Jan 5, 2016 4:56 pm

Issue: Some instances you would would want to require Membership Users to login in order to be able to register for Events on your website. We're going to show you how to edit your Events Module Detail Layout to use the Freedom Ajax Login to login to your Membership Account so that the user does not have to navigate to their My Account page...rather, the user stays on the Event Detail page, logged in, and thus allowed to register for the Event.

Solution:

1) Go to > Green > Layouts > Modules > Filter by Events > Edit [Detail]

Use the Following Code (below) to setup a Login Box and Event Ticket Types section where JavaScript is used to show/hide the Login Box based on if a user is logged in or not:


<if 1> <!-- for use when login is required -->
    <div class="membershipLogin-js">
        <h2>Login to Register</h2>
        <div class="memberLoginBox">
            <table cellpadding="0" cellspacing="0" border="0">
                <tr class="memberUser">
                    <td><span class="itemLabel">Username: </span></td>
                    <td><input type="text" id="uid" value="" size="20" /></td>
                </tr>
                <tr class="memberPassword">
                    <td><span class="itemLabel">Password: </span></td>
                    <td><input type="password" id="pwd" value="" size="20" autocomplete="off" /></td>
                </tr>
                <tr class="memberSubmit">
                    <td>&nbsp;</td>
                    <td><input type="button" id="login_submit" value="Login" /></td>
                </tr>
            </table>
        </div>
        <p style="color: red;" id="loginStatus">&nbsp;</p>
        <p>Don't have an Account? <a href="index.php?src=forms&id=Create%20an%20Account">Sign Up Now.</a></p>
    </div>
</if>

<if [[enable_tickets]]>
<div class="ticket-types">
    [[ticket_types_select]]
</div>
</if>

<if 1> <!-- for use when login is required -->
    <script type="text/javascript">InitializeAjaxLogin('membershipLogin-js', 'ticket-types');</script>
</if>

Jan 5, 2016 5:13 pm

I use this on Skunk.guru to limit vet reviews to logged in users. Make sure that you the page you are adding this to has the Freedom Jquery includes with Freedom Libraries set up or the InitializeAjaxLogin will throw an error.