チェックボックスにチェックが入ったらそれ以降編集不可にしたい

お世話になっております。

 

(やりたいこと)

給料申請用のアプリを作成しているのですが、チェックボックスにチェックが入っている間は編集、入力不可にしたいと考えています。

 

(行ったこと)

投稿やサイトを参考にコードを組んでみたのですが上手く組むことが出来ず、入力可能のままになってしまいます。

ご教授頂けないでしょか。

 

(作成コード)

(function() {

  "use strict";

  kintone.events.on(["app.record.create.change.印刷確認", "app.record.edit.change.印刷確認"], function(event) {

   
     if(event.record.印刷確認.value.length > 0) {

 //チェックが無いときは編集可能
    event.record.申請フォーマット.value.forEach(function(row) {

      row.value.申請者.disabled = false;

      row.value.領収書日.disabled = false;

      row.value.内容.disabled = false;

      row.value.金額.disabled = false;


    });

    // チェックが入ったら編集不可にする

      event.record.申請フォーマット.value.forEach(function(row) {

      row.value.申請者.disabled =  true;

      row.value.領収書日.disabled =  true;

      row.value.内容.disabled =  true;

      row.value.金額.disabled =  true;

    

      });

    }

    return event;

  });

})();

(作成アプリ画面)

nekoko様

検証してないですがこちらでどうでしょうか。

if(event.record.印刷確認.value.length >0) {
 //チェックが無いときは編集可能
      row.value.申請者.disabled =false;
      row.value.領収書日.disabled =false;
      row.value.内容.disabled =false;
      row.value.金額.disabled =false;
}else{
   // チェックが入ったら編集不可にする
      row.value.申請者.disabled =  true;
      row.value.領収書日.disabled =  true;
      row.value.内容.disabled =  true;
      row.value.金額.disabled =  true;
    }

ishikawayuito

 

ご教授ありがとうございます。

教えて頂いたコードでもうまく動作せず、エラー表示も無かったのですが、自作したコードとの違いもあり(else による接続)再度コードの構築と、ほかのコードやプラグインによる弊害が無いか確認してみます。

 

もしishikawayuito様が宜しければ引き続きご教授の程を宜しくお願い致します。

nekoko様

row.value.申請者.disabled = false;

ではなく

event.record.申請者,disabled = false;

の形でどうでしょうか。

nekoko さん

テーブル構造は階層が深く、少し複雑になっています。

テーブル内のフィールドに disabled 属性を与えようとした場合、以下のような形式になります。

event.record.<テーブルのフィールドコード>.value[i].value.<テーブル内にあるフィールドのフィールドコード>.disabled =  true;

以下の記事が参考になると思うのでよかったら見てみてください!

kintoneにおけるテーブル操作の基本(行の追加・更新・削除)

ishikawayuito様

引き続きのご教授ありがとうございます。

下記のコードの形で間違いないでしょうか。

こちらのコードでも結果、エラーともに変わらずの状態です。

 

(function() {

  "use strict";

  kintone.events.on(["app.record.create.change.印刷確認", "app.record.edit.change.印刷確認"], function(event) {

   
    if(event.record.印刷確認.value.length > 0) {
 //チェックが無いときは編集可能
     event.record.申請者.disabled = false;
     event.record.領収書日.disabled = false;
     event.record.内容.disabled = false;
     event.record.金額.disabled = false;
}else{
    // チェックが入ったら編集不可にする
      event.record.申請者.disabled =  true;
      event.record.領収書日.disabled =  true;
      event.record.内容.disabled =  true;
      event.record.金額.disabled =  true;
    }
    return event;

  });

})();

nekoko様

if(event.record.印刷確認.value.length <0) { //不等号を逆に

こちらでどうでしょうか

ponyo

>event.record.<テーブルのフィールドコード>.value[i].value.<テーブル内にあるフィールドのフィールドコード>.disabled =  true;とリンクありがとうございます。

 

両方を参考に再度組みなおしをしてみたと思います。

ishikawayuito

ありがとうございます。

不等号は質問する前に一度試してみたのですが動作に変わりはなかったです。

 

 

nekoko様

申し訳ございません。こちらテーブルの値でしたか…

ponyo様がおっしゃっている通りにすると動作すると思います。

ishikawayuitoponyo様の意見を参考に再度組み直してみようと思います。

また何かありましたら、その際はご教授して頂けると幸いです。

ishikawayuito

私の方こそ言葉足らずで申し訳ございません。

 

今回の件では使用しないもののご教授頂き有難うございます。

ponyo

お世話になっております。

 

コードの形は下記の形でよろしいのでしょうか。

どこか違和感があるのですがJS初心者の為、違和感の正体が分からずにいます。

 

ご教授して頂けると幸いです。

(function() {

  "use strict";

  kintone.events.on(["app.record.create.change.印刷確認", "app.record.edit.change.印刷確認"], function(event) {


    if (event.record.印刷確認.value.length > 0) {

      //チェックが無いときは編集可能
      event.record.申請フォーマット.value.forEach(function(row) {

        event.record.申請フォーマット.value[i].value.申請者.disabled = false;
        event.record.申請フォーマット.value[i].value.領収書日.disabled = false;
        event.record.申請フォーマット.value[i].value.内容.disabled = false;
        event.record.申請フォーマット.value[i].value.金額.disabled = false;

      });

      // チェックが入ったら編集不可にする

      event.record.申請フォーマット.value.forEach(function(row) {

        event.record.申請フォーマット.value[i].value.申請者.disabled = true;
        event.record.申請フォーマット.value[i].value.領収書日.disabled = true;
        event.record.申請フォーマット.value[i].value.内容.disabled = true;
        event.record.申請フォーマット.value[i].value.金額.disabled = true;


      });

    }

    return event;

  });

})();

ponyo様ではないですが

[i]の部分でiが定義されていないのが違和感ではないでしょうか。

ishikawayuito

お世話になっております。

代わりのご回答ありがとうございます。

 

>[i]の部分でiが定義されていないのが違和感ではないでしょうか。

引数を用いた定義でよろしいのでしょうか。

nekoko 様

こんにちは。

 

また皆様、横から失礼致します。

答えと言うか別のコードになってますけど、やりたいことのサンプルとしてはこんな感じです。

(function () {
  'use strict';

const table = 'subtablefieldcode'; // サブテーブルのフィールドコードを入力する

  let disabled = function (tableRows, boolean) {
    tableRows.map(function (row) {
      for (let key in row.value) {
        row.value[key].disabled = boolean;
      }
    });
    return tableRows;
  };

  kintone.events.on(['app.record.change.印刷確認', 'app.record.edit.change.印刷確認'], function (event) {
    let subTable = event.record[table].value;
    if (event.changes.field.value.length) {
      disabled(subTable, true);
    } else {
      disabled(subTable, false);
    }
    return event;
  });
})();

まぁ、コードの説明は申し訳ないですけど省きます。

サブテーブルのフィールドコードを差し替えて使って下さい。

 

ポイントは色々ありますが省略して、質問事項について、

サブテーブルの全体を入力不可にする場合は、for文などを使って、テーブル全体を操作しないといけません。

その時に使うのがこの配列[i]と言うやつで、for分で指定回数同じ処理をしたときに利用したりします。

また、今回利用した場合の i には配列の何番目などの数値が入っていきます。

この i が宣言(定義)されていませんということですね。

for - JavaScript | MDN (mozilla.org) : for文の基礎はこの辺り

文法とデータ型 - JavaScript | MDN (mozilla.org) : 変数の宣言はこの辺り

詳しくは、ご自身で検索して色々勉強をしてみて下さい。

 

上記のコードは、いちよう私の中では印刷確認にチェックが付いているときと言うことですので、その動作をしません。

簡潔に伝えると、まだ完成されていません。

 

現在は、印刷確認にチェックが入った時に、もしくは外れた時に動作するようになっています。

イベントタイプの見直しと、17行目 if (event.changes.field.value.length) 辺りを想定している値に修正すれば完成するかと思います。

あとは考えてみて頂ければ幸いでございます。

新屋 育男

こんにちは。

こちらの質問でもご教授頂きありがとうございます。

 

色々と勉強するとともに貼ってただいたコードの見直しと修正をしていこうと思います。