Show and Hide fields using Checkboxes

This sample code shows and hides fields depending on the choices selected in a checkbox.

Sample Image

showhidefields.gif

Sample Code

// Show and hide fields based on check box choices

(function() {
    "use strict";

    var CHOICE = 'Choice'; //field code of checkbox field
    var TEXT = 'TextField';  //field code of text field to display/hide
    var TABLE = 'TableField';  //field code of table field to display/hide
    var GROUP = 'GroupField';  //field code of group field to display/hide
    var events = ["app.record.create.show", "app.record.edit.show",
                  "app.record.create.change." + CHOICE, "app.record.edit.change." + CHOICE];

    kintone.events.on(events, function(event) {
        var record = event.record;
        var choiceVal = record[CHOICE].value;

     //State which checkbox labels will display/hide fields
        if (choiceVal.indexOf('Text') >= 0) {
            kintone.app.record.setFieldShown(TEXT, true);
        } else {
            kintone.app.record.setFieldShown(TEXT, false);
        }

        if (choiceVal.indexOf('Table') >= 0) {
            kintone.app.record.setFieldShown(TABLE, true);
        } else {
            kintone.app.record.setFieldShown(TABLE, false);
        }

        if (choiceVal.indexOf('Group') >= 0) {
            kintone.app.record.setFieldShown(GROUP, true);
        } else {
            kintone.app.record.setFieldShown(GROUP, false);
        }

        return event;
    });
}());

Notes

Make sure to match the Field code, with the Field code written in the code.

 

Refer to the Tutorial page, on how to add scripts to your app.

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