An event will be triggered when the list of records is displayed. The code will check the value of the "Status" field for each row, and find which rows hold the value of "Not Started". The code will then proceed to change the style of the "To Do" and "Status" values where the row includes a "Not Started" value.
Make changes to your kintone App
Open your App Settings and have the Form tab selected. Hover your mouse over the "To do" field to have a cogwheel appear. Hover over the cog wheel, click on "Settings", and change the field code to "todo".
Do the same for the "Status" drop-down field, and change the field code to "status".
Once you are done, save the form, and update the App.
Follow these steps to apply the code to your kintone App
Step 1. Open the "sample_customize.js" file you were working on in the previous tutorial.
Step 2. Overwrite the current code with the below code, and save your file.
Step 4. View your record list to see the color changes made to your record list.
There are of course other events that can be called, such as the app.record.create.show event that will run when the record create page loads.
The elements of the fields are retrieved using kintone.app.getFieldElements('fieldcode'); .
You could technically get the elements of the fields by using document.getElementsByClassName('classname'); , but class names in kintone have a risk of changing on a product update. As kintone.app.getFieldElements('fieldcode'); only specifies the field code of the field, any changes to class names will have no effect on retrieving the element.
Did your code run successfully?
If not, there's nothing to worry about. It may most likely be due to incorrect field codes. The field codes are case sensitive, so have a check in your App Settings again to see if the field codes you specified are correct (and make sure you are not specifying the "field name" instead).
If this still doesn't solve the issue, have a look through the Debugging Tips for kintone JS article for any hints.
We will look into running a script with a different event in the next tutorial