Add Buttons (Record Details)

To Start Off

This tutorial will guide you on how to place a button in your Kintone record details page.
We recommend you to look through the Add buttons (Record List) tutorial first before trying this tutorial


Step 1. Set the Record Details Event

Our code here should run only on the record details page, so we will first need to set the record details event. The function used here is Look at the Record Details Event article for more details.

Check that the alert window appears when the record details page appears.
Notice also that the alert window will not appear, when you are viewing other pages such as the record list page and record edit page.

Step 2. Set the Button

For the next step, you can either place a button on the header of the record (Step 2a), or on a Blank space field of your app (Step 2b).

Step 2a. Set the Button on the Header

Rather similar to the Add Buttons (Record List) tutorial, you will need to retrieve the header element of the record with


This code should place a button on the header of the record. Nothing will happen though when the button is clicked!



Step 2b. Set the Button on a Blank space field

If you would rather place the button somewhere inside the form of the record instead, you can retrieve the element of a Blank space field of your app and place the button there.
To do this, first place a Blank space field into your form, through the app's settings.



Hover over the Blank space field and click on "Settings".

Place in a name that will identify that Blank space field, save the settings and apply changes to your application.



Now, we will use to retrieve the element of the Blank space field.


You should now find yourself with a button placed inside the record form.


Step 3. Run a Code when the Button is Clicked

Finally, let's run a code when the button is clicked.
This time, we'll run a kintone JavaScript API that can be found here, when the button is clicked.

When the button is clicked, this should display the date and time of when the record was created, inside an alert window.



We hope this article helped you understand more about the Kintone JavaScript API. Most of the code here is just plain JavaScript - we're just using the Kintone JavaScript API to retrieve data that we need from the Kintone records.

Was this article helpful?
0 out of 0 found this helpful
Do you have any questions or issues related to this article?
Please share your views with us in the Community forums!