Tutorial on Bug Tracker Application

Getting Started with Deluge Scripting

Overview

This tutorial illustrates the power of deluge scripting to incrementally add logic to a simple application, making it more powerful. Let us start with creating a simple Feedback application and incrementally add logic to make it a powerful Bug Tracker. The Bug Tracker application facilitates the creation and assigning of bugs related to software.

About the Bug Tracker Application

Bugs are reported by users using the Submit Feedback form which is embedded in the company's website using Zoho Creator's embed feature. Whenever a bug is submitted, an e-mail is automatically sent to the admin user, informing him about the nature of the bug and the person who has submitted it. The admin user, later assigns each bug to a team member belonging to a specific module. When a module is selected, only the team members belonging to that specific module will be listed, making the job of assigning bugs much easier. When an issue is fixed, the status is set to "Closed" by the Team member to whom the issue is assigned. A mail is sent to the user who submitted the issue, stating that the issue is "Closed". Different reports on bugs assigned with their status is generated to view the list of unassigned issues and assigned issues that are not closed.

You can access the Bug Tracker application at the following link: http://creator.zoho.com/zchelp/feedback-application/

Contents

Create Feedback Application with Submit Feedback form

Set date field with currentdate

Send customized e-mail notification

Embed the form in external website

Transform Feedback form into a Bug Tracker application
Create New Views (Reports)

Create Feedback Application with Submit Feedback form

To create a new application,

Login to Zoho Creator and click on Create New Application
Specify the application name as Feedback Application
Specify the form name as Submit Feedback
Click Create Now to create the application . The application will be created with a blank Submit Feedback form.
Add the following fields to the Submit Feedback form:

Your emailid - Add field of type E-mail to enter the e-mail id of the person submitting the feedback. Make this field as mandatory by selecting Options -> This is required field.
Category - Add field of type Radio button to select the required category the feedback belongs to. Specify the categories as Feature request, Bug report, Usability and General.
Your comments - Add field of type Multi line text, to enter the comments, if any, for the feedback.
Submitted On - Add field of type Date to record the feedback submission date. Hide this field from users, by selection Options -> Hide this field to others.

Access the form by selecting button.

The Submit Feedback form is ready for use. Now, let us incrementally add logic to this form using Deluge Scripting.

Set Date Field with Current Date

As mentioned earlier, we have created a date field named Submitted On in the Submit Feedback form. When the form is loaded, we would like to automatically set this field with the current date and disable this field, so that it cannot be edited by the user. This can be achieved by adding on add -> on load Deluge Script. The script will be executed when a form is loaded by the user to submit new issues.

To add the script,

Go to Edit mode, by selecting Edit this application button.
Click on More Actions -> Script on Add -> Actions on Success from the Submit feedback form header. This will display the Script editor in the Script tab with the Submit_Feedback form selected in the Forms tab.
Drag and drop the Set Variable deluge statement to the editor area.

Click on Edit button. This will display the dialog to set the variable with a value.
Select the field variable Submitted_On from the variable list. To set the Submitted_On field with the current date, select the tab Zoho Variables and select Date variables -> zoho.currentdate from the list displayed, as shown in the screen-shot given below.
Click Done to update the selections to the Set Variable statement.
To disable the Submitted_On field, drag-n-drop the enable/disable client function to the editor area.
Click on Edit button, select the disable function and the field name to be disabled as Submitted_On. Click Done to update the selections.
Click Save Script to update the script to the form definition.

The script we have defined above, will be added to the on add -> on load block of the Form Definition, as shown below. To view the form definition with Action, select Form Definition -> With Action.

actions
    {
        on add
        {
            on load
            {
                input.Submitted_On = zoho.currentdate;
                disable Submitted_On;
            }

        }
    }

Set Customized e-mail notification on record addition

On successful submission of a feedback, the application owner would like to receive a customized e-mail notification from the person who submitted the feedback. Sending of e-mail notifications on submission of form data can be automated by configuring Deluge Script. Please find the steps given below, to do this:

Select Submit Feedback form from the Forms tab and click on More Actions -> Script on Add -> Actions on Success from the form header. This will display the Script editor in the Script tab.
Drag and drop the Send Mail deluge statement to the editor area.
Click on Edit button. This will display the dialog to configure the From, To, Subject and the Message.
By default, the To address will be displayed as zoho.adminuserid, which refers to the login id of the application owner.
Specify the Subject of the message as given below, where, input.<filename> will replace the value of the field, in the record. You can either specify the text directly in the "Subject" text box or click on the "Write expression" icon displayed on the right-side to select the required input fields.

"Issue Reported On " + input.Submitted_On+ "By " + input.Your_emailid

Specify the message as input.Your_comments to send the email with the feedback comments.

Click Done to update the configurations in the send mail function, as shown below:

Click Save Script to update the changes to the script definition. The script we have defined above, will be added to the on add -> on success block of the Form Definition. To view the Form definition with Action, select the link show Form/field actions displayed in the top left corner and select Form Definition -> With Action.

actions
    {
        on add
        {
            on load
            {
                input.Submitted_On = zoho.currentdate;
                disable Submitted_On;
            }
            Submit
            (
                type  =  submit
                displayname  =  "Submit"
                on success
                {
                    sendmail
                    (
                        To       :  zoho.adminuserid, "yourname@domain.com" 
                        From     :  zoho.adminuserid 
                        Subject  :  "Issue reported on " + input.Submitted_On + "By " + input.Your_emailid 
                        Message  :  input.Your_Comments 
                    )
                }
            )
         }
      }

Embed the form in external website

The Submit Feedback form is ready for use. Zoho Creator provides the advantage of embedding Forms into your website/blog with simple copy and past code.
To embed the Submit Feedback form to your website,

Go to Live mode by selecting the button Access this application
Select the Submit Feedback form form the left-side tree and click on More Actions -> Embed in Website.
Copy and paste the <iframe> code displayed to your blog.

Note: By default, the embedded form will prompt for login. To disable login to the form, select the Click Here option displayed in the Embed dialog and then copy/paste the <iframe> code displayed to your blog.

Transforming the Feedback form into a Bug Tracker application

The Feedback form we have created above, can be used only to submit issues. Let us further enhance this form and make it capable of assigning the issues submitted to team members working on different modules and generate reports to view the status of the issues. Now, let us learn how to achieve this by doing the following task:

Creation of support teams and modules

Assigning issue to a support team member

Populate the Assign to field based on the module selected

Send mail when issue status is closed

Creation of Support Teams and Modules

To assign issues to team members working on different modules, we need to know the modules in a project and also the team member names. Hence, we will create the Modules form and the Team Member form, as explained below:

1. Create the Modules form with a single text field named Module Name and enter the name of each module in the project. For example, let us enter the modules as Testing, GUI, Scripting, Usability etc. A screen-shot of the Modules View is given below:

2. Create a Team Member form with the following fields to enter the team members in each module.

Name - Add a text field to enter the team members for each module.

Module - Import the Module Name field from the "Module" form as a Lookup field as shown in the screen-shot given below:

Enter the team members in each module. A screen-shot of the Team Members view is given below:

Assigning Issue to a support team member

We will add the following fields to the Submit Feedback form to enable the application owner to assign issues to team members:

a. Module - Lookup field imported from the module form to assign the module

b. Assign To - Lookup field imported from the Team Member form to assign the issue to a team member.

c. Status - List field to assign the status of an issue with values "Open" and "Closed". By default, the status is set to "Open". If the issue is closed, the status will be set to "Closed"

Populate the Assign To field based on the module name change

While assigning issues, when a module is selected, only the team members belonging to that module should be listed in the Assign To field, as shown in the screen-shot given below.

This is achieved by adding the on user input script to the Module Name field, as shown in the code given below. This script will be executed when a module is selected from the Module pick list.

Using Script Builder to add the script to the Module Name field

Edit the Module Name field in the Submit feedback form and select Actions on User Input . This will display the Script editor in the Script tab.

Drag and drop the required If condition and If statements, as shown in the screen-shot below and use the Edit button to select the required fields and variables.

The If condition with the count deluge statement, counts the number of records in the Team_Members form, whose Module_Name is equal to the Module_Name selected in the Submit_Issue form.

Note: Count function is not supported in the Script editor. Hence, please specify the if condition (count(Team_Member[Module == input.Module]) == 0) directly in the text area.

The clear picklist deluge statement, clears the Assign_To picklist field, if the count is 0, (i.e) no records exist in Team_Members form with the selected Module name. If the count is more than 0, the else statements will be executed.

Drag and drop the else statements as given below:
- The r in the for each statement is a collection variable that fetches and holds all the members in the Team_Member form whose Module is same as the selected module. Since the variable r is an array, it has to be iterated to get the properties of each team member. The iteration is achieved using the for each deluge statement.

- For each iteration the team members Name in variable r is added to the Assign To picklist. This is achieved using the Add to picklist deluge statement.

Click Save Script to update the changes to the script definition. The script we have defined above, will be added to the on user input block of the Module field definition. To view the Form definition with Action, select the link show Form/Field actions displayed in the top left corner and select Form Definition -> With Action.
        Module
        (
            displayname  =  "Module Name"
            type  =  picklist
            values  =  Modules.Module_Name
          on user input
            {
                if (count(Team_Member[Module == input.Module])  ==  0)
                {
                    clear Assign_To;
                }
                else
                {
                    for each r in Team_Member  [Module == input.Module]
                    {
                        Assign_To:ui.add(r.Name);
                    }
                }
            }
        )
		
Send mail when issue status is "Closed"

When a issue is fixed, the status is set to "Closed" by the Team member to whom the issue is assigned. A mail is sent by the login user to the user who submitted the issue, with the issue status. This is achieved by adding "on update" script to the "Status" field in the Submit Feedback form.

Adding On Update script to the Status field:

Edit the Status field in the Submit feedback form and select Actions on Update . This will display the Script editor in the Script tab.

Drag and drop the required If condition and If Statements as shown in the screen-shot below and use the Edit button to select the required fields and variables.

Click Save Script to update the changes to the script definition. The script we have defined above, will be added to the on update block of the Status field. To view the Form definition with Action, select the link show Form/field actions displayed in the top left corner and select Form Definition -> With Action.
Status
        (
            type  =  picklist
            values  =  {"Open",   "Closed"}
            defaultvalue  =  "Open"
            on update
            {
                if (input.Status  ==  "Closed")
                {
                    sendmail
                    (
                        To       :  Your_emailid 
                        From     :  zoho.adminuserid 
                        Subject  :  "Status of issue with subject " + input.Your_Comments 
                        Message  :  "The issue is " + input.Status 
                    )
                }
            }
        )

Create New Views (Reports)

Create a View for Unassigned issues (with criteria as Assigned to=null)
Create a View for Assigned Issues (with criteria as Assigned to !=null)

Create a View for Unassigned Issues

To create a view that lists the issues not yet assigned to a team member,

Select the View tab and click on New View. The New View dialog will be displayed with the supported view types. The List view will be selected by default.

Specify the view name as Unassigned Issues

Select the form Submit Feedback, based on which the view is created

Select the access permissions for the new view. Refer FAQ - Views - Access Permission.

Click Done to create the view.

To specify the criteria, select Set Criteria -> Restricted Records and specify the criteria as shown in the screen-shot below:

Click Done to add the criteria to the view definition.

To view the script definition of the view, select the Script Tab and select the view name form the Select list box.
list  "Unassigned Issues"
{
    show  all  rows  from  Submit_Feedback [(Assign_To is null)]
    (
        Your_emailid as "Your emailid"
        Category
        Your_Comments as "Your Comments"
        Submitted_On as "Submitted On"
        Module as "Module Name"
        Assign_To as "Assign To"
        Status
    )
    filters 
    (
        Module
        Assign_To
        Category
        Status
        Submitted_On
    )
}
            
In Live mode, the Unassigned Issues view displays the records not assigned to a team member, as shown in the screen-shot below:

Create a View for Assigned Issues with Status "Open" with module-wise grouping

To create a view that lists the issues not yet assigned to a team member,

Select the View tab and click on New View

Specify the view name as Assigned Issues

Select the form Submit Feedback, based on which the view is created

Select the access permissions for the new view. Refer FAQ - Views - Access Permission.

Click Done to create the view.

To specify the criteria, select Set Criteria -> Restricted Records and specify the criteria as shown in the screen-shot below:

Select match all to list the records that matches both the criteria.

Click Done to add the criteria to the view definition.

To view the records grouped under each module, select the Set Grouping option, add the Module Name field to the list.

To view the script definition of the view, select the Script Tab and select the view name form the Select list box.
list  "Assigned Issues"
{
    show  all  rows  from  Submit_Feedback [((Assign_To is not null) && Status == "Open")]
    (
        Your_emailid as "Your emailid"
        Category
        Your_Comments as "Your Comments"
        Submitted_On as "Submitted On"
        Module as "Module Name"
        Assign_To as "Assign To"
        Status
    )
    filters 
    (
        Module
        Assign_To
        Category
        Status
        Submitted_On
    )
    group by
    (
        Module   ascending
    )
}
In Live mode, the Assigned Issues view displays the records assigned to team members and with status as "Open", as shown in the screen-shot below. The records are grouped according to Module Name.

Also Refer: Different type of views supported by Zoho Creator.