Difference between revisions of "Tracking Forms (JavaScript)"
m |
|||
(4 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
− | The ''' | + | The '''__CR.submit''' function is a [[JavaScript]] function which enables you to track when visitors to your web site submit a form. |
== Simple implementation == | == Simple implementation == | ||
− | The syntax for using ''' | + | The syntax for using '''__CR.submit''' in a form is as follows: |
'''Before:''' | '''Before:''' | ||
Line 15: | Line 15: | ||
'''After:''' | '''After:''' | ||
− | <pre><form method="post" action="." onsubmit="return | + | <pre><form method="post" action="." onsubmit="return __CR.submit(this, '1')"> |
<label for="first_name">First Name</label> | <label for="first_name">First Name</label> | ||
<input type="text" name="first_name" value="" /> | <input type="text" name="first_name" value="" /> | ||
Line 30: | Line 30: | ||
Note that the [[Action Code]] (in this case, "1") will change for different actions. | Note that the [[Action Code]] (in this case, "1") will change for different actions. | ||
− | Finally, note that you need to [[Install the Tracking Snippet]] on each page where you use ''' | + | Finally, note that you need to [[Install the Tracking Snippet]] on each page where you use '''__CR.submit''' for the above code to work. |
== Advanced implementation == | == Advanced implementation == | ||
Line 39: | Line 39: | ||
'''After:''' | '''After:''' | ||
− | <pre><form method="post" action="." onsubmit="return validate_form() ? | + | <pre><form method="post" action="." onsubmit="return validate_form() ? __CR.submit(this,'1') : false"> ... </form></pre> |
+ | |||
+ | '''Alternate:''' | ||
+ | <pre><form method="post" action="." onsubmit="if (validate_form()) { return __CR.submit(this,'1'); } else { return false; }"> ... </form></pre> | ||
The above solution may change on a case-by-case basis. If you are ever in need of assistance, please contact [[ConversionRuler Support]]. | The above solution may change on a case-by-case basis. If you are ever in need of assistance, please contact [[ConversionRuler Support]]. | ||
Line 50: | Line 53: | ||
* [[JavaScript onclick]] | * [[JavaScript onclick]] | ||
* [[Tracking Links (JavaScript)]] | * [[Tracking Links (JavaScript)]] | ||
+ | * [[When to use __CR.submit, __CR.link, and __CR.track]] | ||
[[Category:ConversionRuler]] | [[Category:ConversionRuler]] | ||
[[Category:ConversionRuler JavaScript Functions]] | [[Category:ConversionRuler JavaScript Functions]] | ||
[[Category:Technical]] | [[Category:Technical]] | ||
− | [[Category: | + | [[Category:ConversionRuler Installation]] |
Latest revision as of 15:40, 26 February 2016
The __CR.submit function is a JavaScript function which enables you to track when visitors to your web site submit a form.
Simple implementation
The syntax for using __CR.submit in a form is as follows:
Before:
<form method="post" action="."> <label for="first_name">First Name</label> <input type="text" name="first_name" value="" /> <label for="last_name">Last Name</label> <input type="text" name="last_name" value="" /> <label for="email">Email</label> <input type="text" name="email" value="" /> </form>
After:
<form method="post" action="." onsubmit="return __CR.submit(this, '1')"> <label for="first_name">First Name</label> <input type="text" name="first_name" value="" /> <label for="last_name">Last Name</label> <input type="text" name="last_name" value="" /> <label for="email">Email</label> <input type="text" name="email" value="" /> </form>
Specifically, you will add an JavaScript onsubmit handler to your form to invoke our tracking prior to the user submitting the form.
Add this code to any link you wish to track. As well, you will likely need to create a Conversion Action to assign to each type of link you want to track.
Note that the Action Code (in this case, "1") will change for different actions.
Finally, note that you need to Install the Tracking Snippet on each page where you use __CR.submit for the above code to work.
Advanced implementation
If you want to track a form which already has the onsubmit event in use, then you'll need to modify how you invoke it:
Before:
<form method="post" action="." onsubmit="return validate_form()"> ... </form>
After:
<form method="post" action="." onsubmit="return validate_form() ? __CR.submit(this,'1') : false"> ... </form>
Alternate:
<form method="post" action="." onsubmit="if (validate_form()) { return __CR.submit(this,'1'); } else { return false; }"> ... </form>
The above solution may change on a case-by-case basis. If you are ever in need of assistance, please contact ConversionRuler Support.
As always, there are tools in ConversionRuler to help you do this.