Ribbit's works

【kintone】フィールドの入力制限・可否を変更する

#kintone#JavaScript公開 2021-09-03
記事のトップ画像

ここでは kintone における、アプリの各フィールドの入力可否を操作する方法を解説します。

ルックアップと関連付けたフィールドなど、強制的にフィールドが入力不可になる設定がありますが、今回紹介する方法で手入力可能にできます。

ルックアップについては、再度ルックアップを取得したタイミングや、データの取り込みを行ったタイミングで手入力部分は消えてしまうため、その点は注意してください。

ソースコード

フィールドの入力可否はkintone JavaScript APIを利用することで実現できます。

kintone.events.on のコールバック関数内で実行する場合

kintone.events.on('...', (event) => {
  event.record['フィールドID'].disabled = false;

  return event;
});

予め設置したボタンのクリック時など、独自のタイミングで実行する場合

/** 実行時のレコード情報 */
const { record } = kintone.app.record.get();

// フィールドの入力可否を設定
record['フィールドID'].disabled = false;

// レコード情報をセット
kintone.app.record.set({ record });

上記のコードで実装可能です。

注意点

kintone JavaScript API には実行時点のフィールド情報を取得する機能がいくつか用意されていますが、フィールド情報を操作した場合、必ず変更後のフィールド情報を API に返さなければなりません。

kintone.events.onのコールバック関数では、return event の部分。ボタンクリック時では、kintone.app.record.set({ record });の部分がないと、正しく反映されません。

また、kintone で javascript カスタマイズを長くされている方であればわかると思いますが、kintone.app.record.get で取得できるオブジェクトの直下に各フィールドプロパティがあるのではなく、取得したオブジェクトに record プロパティがあり、その中に各フィールドプロパティがあります。 そして、kintone.app.record.setの引数にするオブジェクトは、kintone.app.record.getで取得したオブジェクトの構造でなければなりません。

// レコード情報を取得
const { record } = kintone.app.record.get();

// フィールドの入力可否を設定
record['フィールドID'].disabled = false;

// レコード情報をセット
kintone.app.record.set(record); // これはエラー
kintone.app.record.set({ record }); // これはOK

また、event から取得できる record オブジェクトをそのままセットしたい場合は、オブジェクトの構造を少し操作しておく必要があります。

const events = ['app.record.create.show', 'app.record.edit.show'];

// 処理をイベントに登録します
kintone.events.on(events, (event) => {
  // このオブジェクトはそのままセットできない
  const record = event.record;

  // オブジェクトを整形した後セット
  kintone.app.record.set({ record });
});