Form Fields‎ > ‎


Google Chart field - there are two possibilities to display a Google chart in Action Form:

  • with HTML - you need to copy the HTML code from the charts gallery: for example: - and paste it into the HTML Code field;

  • with tokens as in the example bellow:

1. create a database token with:
Namespace = LogReports
title = ErrorsByType
Input Database Query:
    SELECT LogTypeKey as ErrorType, count(*) as ErrorCount
    FROM EventLog
    group by LogTypeKey

Column Names

2. create a Razor Script token with:
Namespace = LogReports
title = ErrorsByTypeJson
Template Engine = Razor
Code Language = C#
Script Body = @LogReports.ErrorsByType.ToJsonArrays(false)

3. create a constant string token with:
Namespace = LogReports
title = ErrorsByTypePie
Source = Constant String
Input Constant String (here you have to add the code generated on Google Charts page and add the Razor Script token):
    <script type="text/javascript" src=""></script>
    <script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});
      function drawChart() {
    var token = [LogReports:ErrorsByTypeJson],
           headValue = ['Task', 'Hours per Day'];
        var data = google.visualization.arrayToDataTable(token);

        var options = {
          title: 'My Daily Activities'

        var chart = new google.visualization.PieChart(document.getElementById('piechart'));

        chart.draw(data, options);

<div id="piechart" style="width: 900px; height: 500px;"></div>

4. add the Constant String Token on the Google Chart field in Action Form