Freeform Pro Composer - adding Google conversion code to submit

Question

Good afternoon,

I was wondering whether anyone might know how to change the submit input button code using the Composer Template?

Basically I have been asked to change this code

input type="submit" name="submit" value="Submit"

With the following:

input type="submit" name="submit" value="Submit" onClick=”ga(‘send’, ‘event’, ‘Contact Form’, ‘Form Submit’);"

to allow my client to track the Submit button through Google Analytics.

I presume it's something that needs adding in the code below?

Many thanks in advance for shedding any light on this issue!

{composer:page}
    {composer:rows}
            <div class="line">
        {composer:columns}
                <div class="unit size1of{composer:column_total}">
                {if composer:field_total == 0}
                     
                {/if}
            {composer:fields}
                {if composer:field_label}
                    {if composer:field_type == 'nonfield_captcha'}
                        {if freeform:captcha}
                        <p>
                            <strong>{composer:field_label}</strong>
                        </p>
                        {/if}
                    {if:else}
                        <label class="field_label" {if composer:field_name != ''}for="freeform_{composer:field_name}"{/if}>
                            {composer:field_label}{if composer:field_required}<span class="required_item">*</span>{/if}
                        </label>
                    {/if}
                {/if}
                {if composer:field_output}
                    {if composer:field_type == 'nonfield_title'}
                        <h2>{composer:field_output}</h2>
                    {if:elseif composer:field_type == 'nonfield_captcha'}
                        {if freeform:captcha}
                                {freeform:captcha}<br />
                                <input type="text" name="captcha" value=""
                                       size="20"   maxlength="20" style="width:140px;" />
                        {/if}
                    {if:else}
                        <p>{composer:field_output}</p>
                    {/if}
                {/if}
            {/composer:fields}
                </div>
        {/composer:columns}
            </div>
    {/composer:rows}
{/composer:page}

Answer 1

An alternative, as I'm not too familiar with composer and I don't know where the composer tags put the submit button out with, and as the composer/multipage mode could put out multiple 'submit' buttons...

Use this below Jquery snippet to add what you want to all the submit buttons of the form in question. You don't include the outer freeform tag pair so for this example I'm going to assume you've used the form_id parameter. For this example lets say the form has the id of my_freeform_form.

Pop this underneth your freeform tags (I also assume you have jQuery available)...

<script type="text/javascript">
  $('form#my_freeform_form input[type=submit]').click(function(e){
    if ( ga ) { //saftey, is ga existing?
      ga(‘send’, ‘event’, ‘Contact Form’, ‘Form Submit’);
    }
    //important, return true to allow the 'normal' 
    //form submit through after we're done
    return true; 
  });
</script>