newrelic.addPageAction(string NAME, JSON object ATTRIBUTES)
Reports a Browser PageAction event with your user-defined name and attributes to New Relic Insights.

Requirements

Requires New Relic Browser agent version nr-593 or higher.

This feature requires an Insights Pro or Browser Pro subscription.

Description

This API call sends a Browser PageAction event with your user-defined name and attributes to New Relic Insights, along with several default attributes. This is useful to track any event that is not already tracked automatically by the Browser agent, such as clicking a Subscribe button or accessing a tutorial.

  • PageAction events are sent to Insights every 10 seconds, with a maximum of 20 events per 10-second harvest cycle, per browser.
  • After the 20-event limit is reached, additional events are not captured.

Parameters

Parameter Description

NAME

string

Optional. Name or category of the action. Reports to Insights as the actionName attribute.

Avoid using reserved NRQL words when you name the attribute or value.

ATTRIBUTES

JSON object

Required? JSON object with one or more key/value pairs. For example: {key:"value"}. The key will report to Insights as its own PageAction attribute with the specified values.

Avoid using reserved NRQL words when you name the attribute/value.

Example(s)

This example records a PageAction event whenever a user selects the Try Me link. The event is recorded with an actionName of clickedTryMe:

<a href="/demo" id="try-me">Try Me!</a>
<script>
    document.getElementById('try-me').addEventListener('click',function (e) {
        newrelic.addPageAction('clickedTryMe');
    })
</script>

You can then query the number of times the Try Me button was clicked with the following NRQL query:

SELECT count(*) FROM PageAction WHERE actionName='clickedTryMe' SINCE 1 hour ago

This example sends a PageAction event when a user clicks on an element with the class copy-text. The actionName is copy-text-button and the value is reported as another attribute called Result that corresponds to methods named success and error that handle the outcome.

$('.copy-text').click(function (){
    var clipboard = new Clipboard ('.copy-text');
    clipboard.on('success', function(event) {
      // Do stuff
      // Report data to Insights
      if (typeof newrelic == 'object') {
        newrelic.addPageAction('copy-text-button', {result: 'success'});
      }
    });
    clipboard.on('error', function(event) {
      // Do stuff
      // Report data to Insights
      if (typeof newrelic == 'object') {
        newrelic.addPageAction('copy-text-button', {result: 'error'});
      }
    });
});

Then in Insights, you can create a pie chart to see the breakdown of how many button clicks resulted in success versus error over the past 30 days:

SELECT count(*) AS 'Clicks' FROM PageAction WHERE actionName = 'copy-text-button' FACET result SINCE 30 days ago

Or you can create a query to see what pages have the most copy button clicks in the last 30 days:

SELECT count(*) AS 'Clicks' FROM PageAction WHERE actionName = 'copy-text-button' FACET currentUrl SINCE 30 days ago

Capture form input

This example captures user input (email addresses) from a form called Signup. The event is recorded with an actionName of userSignup:

<form action="/signup" id="myform">
   <input id="email" name="email">
   <input type="submit" value="Signup">
</form>
<script type="text/javascript">
    document.getElementById('myform').addEventListener('submit', function (e) {
        var email = e.target.elements['email'].value;
        newrelic.addPageAction('userSignup', {email: email});
    })
</script>

You can then see the emails that you gathered with the following NRQL query:

SELECT uniques(email) FROM PageAction WHERE actionName='userSignup' SINCE 1 hour ago