Javascript capture HTML form value for Mixpanel

Question

I have a mailchimp form to sign up for my email list, and mixpanel tracking to detect when the form is submitted.

<!-- Begin MailChimp Signup Form -->
<div id="mc_embed_signup"><form id="mc-embedded-subscribe-form" class="validate" action="http://fileoptic.us7.list-manage.com/subscribe/post?u=a1a176055d942403ee4c74a11&amp;id=028333dc80" method="post" name="mc-embedded-subscribe-form" novalidate="" target="_blank"><label for="mce-EMAIL">Subscribe to our mailing list for blog updates:</label>
<input id="mce-EMAIL" class="email" name="EMAIL" required="" type="email" value="" placeholder="email address" />
<!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
<div style="position: absolute; left: -5000px;"><input name="b_a1a176055d942403ee4c74a11_028333dc80" type="text" value="" /></div>
<div class="clear"><input id="mc-embedded-subscribe" class="button" name="subscribe" type="submit" value="Subscribe" /></div>
</form></div>
<!--End mc_embed_signup-->

<script type="text/javascript">
    mixpanel.track_forms("#mc-embedded-subscribe-form", "Subscribed to Email List");
</script>

I want to extract the submitted email address from the form and use mixpanel.alias to identify users by their email addresses as they navigate around my site.

What code do I use to extract the email address and call mixpanel.alias with it?

Answer 1

I don't know anything about mixpanel, but here are two ways to get the value of an input and store it in a variable for later use.

With jQuery (I prefer this method):

$('#mc-embedded-subscribe-form').on('submit', function(){
    var val = $('input.email').val();
    console.log(val); // Use this to test the function
});

Or with plain Javascript. First add this to the form tag in your HTML:

onsubmit="getEmail()"

Then the JS function:

function getEmail() {
    var elem = document.getElementById('mce-EMAIL');
    var val = elem.value;
    console.log(val); // For testing
}

Hope that helps :)