Calculations based on Table field edits

Introduction

This article introduces how to use the "Get the object of the edited field or table row" action that can be used in the event handler of the Record Edit Event and the Record Create Event. This action allows user to get data from tables that are being edited.

 

Prepare the App

Create a kintone App with the below fields.

 

Field Type

Field Name

Field Code

Settings

Date

Date

date

 

Number

Unit price

unit_price

 

Number

Number

number

 

Radio button

Unit

unit

Set the following options:
"Piece"
"Dozen"

Number

Total

total

 

 

In the form editor, place the fields side-by-side and set them as a table. Give the table a field code of "Table". Save your form, and create/update your kintone App.

 

US_01.png

 

Sample Code

Copy the code below into a JavaScript file, and upload it to the App through the JavaScript and CSS Customization settings.

Code Details

The Record Edit page and the Record Create page both have events that trigger when fields are edited:

As we want to handle changes of values in the fields "Unit price", "Number", and "Unit" in both the Record Edit page and Record Create page, we will need to register 6 events:

  • 'app.record.edit.change.unit_price'
  • 'app.record.edit.change.number'
  • 'app.record.edit.change.unit'
  • 'app.record.create.change.unit_price'
  • 'app.record.create.change.number'
  • 'app.record.create.change.unit'

With this, the "Unit Price", "Number" and "Unit" fields triggers an event when the values inside are changed by the user. This also includes changing the value of the "Unit" radio button to "Piece" or "Dozen". The "Piece" or "Dozen" is calculated together with the "Unit price" and "Number", and the result is set into the "Total" field.
 

Test the Code

Add a new record, and enter data into the table.

US_02.png

 

When you enter values in the "Unit price" and "Number" fields, calculation results will be displayed in the "Total" field.

 

Check that the total value changes depending on the value specified with the radio button by switching the choice in the "Unit" to "Dozen".

US_1.gif

 

The "Total" field should recalculate to a new calculated total.

The above images show the customization working on the Record Create page - make sure to check that the calculations occur also on the Record Edit page.

 

 

Finally

This article introduced a way to handle table data from the field edit events inside a table. Although kintone has a Calculated field, this field cannot include Radio button fields in it's calculation.

 

In addition to this customization, you can prevent users from manually editing the "Total" field by using the "Enable/Disable field edits" action for both the Record Edit Event and the Record Create Event.

Was this article helpful?
0 out of 0 found this helpful
Comments
Please sign in to leave a comment.