テーブルに行を追加した際にスマホで数値フィールドはテンキーを表示したい

kintone カスタマイズ
1

pushコードで追加した行に対し、数値フィールド入力時にスマホではテンキーが自動で表示されるようにしたいです。

現在、pushコードで追加された行については、スマホでテンキーが表示されません。(文字列が表示される)

(function () {
    "use strict";
    const table = '運行記録TBL';

  const events = [
        'app.record.create.change.コピー',
        'app.record.edit.change.コピー',
        'mobile.app.record.create.change.コピー',
        'mobile.app.record.edit.change.コピー'
    ];
    kintone.events.on(events, function(event) {
        const record = event.record;

        if (event.changes.field.value.length !== 0) {   //コピーボックスの値が0でなかったら(チェックが付いたら)
            event.changes.row.value.コピー.value = ['✓'];  //コピー元のチェックボックス✓を付ける
            const originData = JSON.parse(JSON.stringify(event.changes.row.value));  //コピー元のデータを一度文字列に変換する
            Object.keys(originData).forEach((code) => {  //値がない場合はvalue情報を空文字で作成
                if(!originData[code].value){
                    originData[code].value = "";
                }
            });
            const addRowData = { "value": originData };  //コピーを挿入するテーブル行のデータを作成
            //以下、コピー後に値を空にする
            addRowData.value.コピー.value = [];
          addRowData.value.重量.value = "";

            var newRow = event.record[table]['value'].push(addRowData);  //指定された行のデータをeventオブジェクトの既存テーブル最下行に挿入

            return event;
      }
        return event;
    });
})();

また、以下のスクリプトを実装済みですが、push して行を追加したときに、イベントが発生していないのではないかと思われます。

jQuery.noConflict();
(function($) {
 "use strict";
kintone.events.on([
    "mobile.app.record.edit.show",
    "mobile.app.record.create.show",
    "mobile.app.record.create.change.運行記録TBL",
    "mobile.app.record.edit.change.運行記録TBL",
    "mobile.app.record.edit.change.コピー",
    "mobile.app.record.create.change.コピー",
    "mobile.app.record.create.submit",
    "mobile.app.record.create.submit.success"
], 
function(event) {
    $('.gaia-ui-decimal-input-input input').attr('type', 'number');
return event;
});
})(jQuery);
2

ご推察通り、サブテーブルをpush()で行追加した時にはサブテーブルのchangeイベントは発生しないです（サブテーブルのchangeイベントは、プラスマイナスのボタンを押下した時に発生します）。

 

その上での対策ですが、1つ目のスクリプトでreturn event（pushした行をレコードに反映）をした後にattr(‘type’, ‘number’)が動くようにすれば良いかと思います。setTimeout()等で実装可能かと思います。

            var newRow = event.record[table]['value'].push(addRowData);  //指定された行のデータをeventオブジェクトの既存テーブル最下行に挿入

setTimeout(() => {
            jQuery('.gaia-ui-decimal-input-input input').attr('type','number');
}, 0);

            return event;
3

mls-hashimoto様

上記を試した結果、想定通りの動きとなりました。

ご教授いただきありがとうございました。

4

このトピックはベストアンサーに選ばれた返信から 3 日が経過したので自動的にクローズされました。新たに返信することはできません。