レコード一覧画面のボタンクリックでチェックボックス入力と当日日付を入力したいです

背景・実現したいこと

①レコード一覧画面にボタンを設置

②一覧画面で条件を絞り込み、該当のレコードを表示させて、ボタンをクリックすると下記2つの処理がその該当レコードすべてに行われる

A. チェックボックス『確認フラグ』の『確認済』にチェックが入る

B. 日付フィールド『確認日』にボタンをチェックした日付が入る

③上記の状態で該当レコードすべてを更新

 

エラー情報 (開発者ツールのコンソール)

初心者のため、やりたいことを検索し、必要な部分をつぎはぎしながら作りました。

直す度にエラーが出るか、動かないかで、現在は下記のコードになりました。

このコードの状態でのエラーは「不正なJSON文字列です」と出ています。

おかしなところだらけかもしれませんが、ご教授いただけますと幸いです。

 

利用したソースコード

(function() {

    “use strict”;

    /*

          レコード一覧画面の表示後イベント

    */

    kintone.events.on([‘app.record.index.show’], function(event) {

        var appId = kintone.app.getId(); //アプリIdの取得

        if (event.viewName == “一覧”) {

            var currentQuery = kintone.app.getQueryCondition(); //現在の検索クエリ

            if (document.getElementById(‘my_index_button’) !== null) {

                return;

            }

            var myIndexButton = document.createElement(‘button’);

            myIndexButton.id = ‘confirm’;

            myIndexButton.innerText = ‘現在表示されているレコードすべてを確認済みにする’;

            myIndexButton.addEventListener(‘click’, toConfirm);

            function toConfirm() {

                kintoneUtility.rest.getAllRecordsByQuery({

                    app: appId,

                    query: currentQuery

                }).then(function(resp) {

                    var records = resp.records;

                    var length = records.length;

                    var putRecords = [];

                    var presentDate = moment().format(‘YYYY-MM-DD’);

                    for (var i = 0; i < length; i++) {

                        putRecords.push({

                            “id”: records[i][‘レコード番号’].value,

                            “record”: {

                                “確認フラグ”: [

                                    ‘確認済’,

                                ],

                                “確認日”: {

                                    value: presentDate.value,

                                },

                            }

                        });

                    }

                    if (confirm(‘本当に本日付で’ + length + ‘件を確認済みにしますか?’)) {

                        kintoneUtility.rest.putRecords({

                            app: appId,

                            records: putRecords,

                        }).then(function(response) {

                            alert(“レコードを更新しました。”);

                            console.log(response);

                        }).catch(function(error) {

                            console.log(error);

                        });

                    }

                });

            }

            // メニュー右側の空白部分にボタンを設置

            kintone.app.getHeaderMenuSpaceElement().appendChild(myIndexButton);

            // メニュー下部分にボタンを設置

            //kintone.app.getHeaderSpaceElement().appendChild(myIndexButton);

        }

        return event;

    });

})();

NKIさん

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

putRecords.push()しているところで、「確認フラグ」プロパティの値も

確認フラグ: {
value: ['確認済'],
},

のようにする必要があるかと思います。
https://developer.cybozu.io/hc/ja/articles/202166330#check-box

余談ですが、kintoneUtilityは非推奨となっているので、今後はkintone-rest-api-clientを使用するとよいかと思います。

江田篤史 様

お世話になります。

コメントいただきありがとうございます。

いただいたアドバイスを元に修正したところ、実装できました。

チェックは入れられたのですが、日付が入らなかったので、その部分も下記のように修正しましたら、実現したいことすべて完了しました。

value: presentDate,

 

kintoneUtilityの件は、知らなかったです。

教えていただき、ありがとうございます。

今後kintone-rest-api-clientが使えるように、また勉強したいと思います。

 

この度はありがとうございました。

江田篤史 様

 

完了しましたとご報告し、終わった件ですが、1点確認させていただけますでしょうか。

 

確かに処理はできるのですが、最後に『レコードを更新しました。』とポップアップウィンドウが表示されても、そのままですと処理は一覧画面に反映されません。

自分で画面を更新すると、処理が反映されています。

これは、自分で画面更新をしなくても、『レコードを更新しました。』と同時に自動的に切り替わることはできないということでしょうか?

それとも、ソースの書き方を変えれば、実現可能でしょうか?

 

続けてで申し訳ありませんが、よろしくお願い致します。

NKIさん

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

location.reload() でページ更新できるかと思います。
https://developer.mozilla.org/ja/docs/Web/API/Location/reload
https://www.javadrive.jp/javascript/webpage/index12.html

江田篤史 様

 

お世話になります。

コメント、リンクありがとうございます。

無事自動でページ更新ができました。

何度もありがとうございました。

江田篤史 様

お世話になります。

何度も申し訳ありません。

最初の投稿に記載の『利用したコード』をベースにその後いただいたコメントで修正をし、完了したと思っていたのですが、レコード件数が増え、ページ送りをすると、ボタンが増殖されることが判明しました。

『利用したコード』には、増殖を防ぐためのコード(10~12行目)を入れています。

入れる位置が良くないのかと、前後に動かして試してみましたが、うまくいきませんでした。

ご教授いただけますと幸いです。