Thread tagged as: Question, Forms, Members

use member information as default values in a perch form

When a member is signed in I would like to use their information (i.e. name, phone, email etc...) as default values in a form. Here is the code in my contact form template.

<perch:form class="nobottommargin" id="sponsorregistration" app="perch_forms" method="post" role="form">
<div class="col_one_half col_last">
                <perch:label for="company">Company</perch:label>
                <perch:input type="text" id="company" class="sm-form-control" value="<perch:member id="company" />" label="Company" />
                <div class="alert success">
                    <perch:content id="success" type="textarea" label="Thank you message" textile="true" editor="markitup"/>
            <perch:input type="submit" id="submit" value="Send" class="btn btn-primary" />
Justin Jojola

Justin Jojola 0 points

  • 5 years ago

Hi Justin,

I do exactly this on a client website, the way I achieved it was to grab the Perch member properties using PHP in a page template and echo them out to data attributes on a HTML element, then use JavaScript to grab these and assign them to the value of the relevant input in the form.

                            if (perch_member_logged_in()) {         
                                <div class="client-intro" data-js-action="populate-form" 
                                data-member-first-name="<?php echo perch_member_get('first_name'); ?>" 
                                data-member-last-name="<?php echo perch_member_get('last_name'); ?>" 
                                data-member-email="<?php echo perch_member_get('email'); ?>"
                                data-member-company="<?php echo perch_member_get('company'); ?>">
                                    <h4>Order Consumables</h4>                                    
                        <?php perch_content('Order Consumables'); ?>

Javascript might be something like

// populate form fields if ($('[data-js-action="populate-form"]')[0]) { var firstName = $('[data-js-action="populate-form"]').data("member-first-name"); var lastName = $('[data-js-action="populate-form"]').data("member-last-name"); $('#form1_name').val(firstName); $('#form1_surname').val(lastName); if ($('#form1_email')[0]){ var email = $('[data-js-action="populate-form"]').data("member-email"); $('#form1_email').val(email); } if ($('#form1_company')[0]) { var company = $('[data-js-action="populate-form"]').data("member-company"); $('#form1_company').val(company); } }

Alternatively you might be able to assign these member properties to variables and pass them to the template?

I haven't explored this though so can't comment on it's feasibility.