フォームブリッジでパラメータの値をテーブルに入れ込みたい

[Light_shun]

フォームブリッジでパラメータの値をテーブルに入れ込みたいです。

例えば、フォームブリッジを開いた時点で、テーブル内の各行に回答を収集したい項目が含まれており、対応する行の２列目以降に値を入力してもらうといった運用を想定しています。

テーブルA
｜field_a, field_b｜
｜値1 , ｜
｜値2 , ｜

パラメータからフィールドへ初期値を入れることが可能なのは確認済みですが、テーブルへの入れ方がわかりません。

テーブルの最低行数を4行などに設定し、以下のようにパラメータを作成すると、「field_a」すべての行が「値１」という同じ値になります。
・・・?field_a=値１

初歩的な質問かもしれませんが、何卒お力添えいただけますと幸いです。
よろしくお願いいたします。

[aaa]

現在はどのようなコードなのですか？

[Light_shun]

現在は以下のようなコードであり、試行錯誤している状態です。
テーブル内でなければ、パラメータをフィールドに初期値としてセットすることはカスタムコードがなくても可能なため、以下のスクリプト以外にjsファイルはございません。

(function() {
    "use strict";

    fb.events.form.mounted = [function() {
        console.log("Form is mounted");

        // URLパラメータを取得する関数
        function getQueryParam(param) {
            var urlParams = new URLSearchParams(window.location.search);
            return urlParams.get(param);
        }

        // パラメータ取得のログ
        var categories = getQueryParam('categories');
        var values1 = getQueryParam('values1');
        var values2 = getQueryParam('values2');

        console.log("Categories:", categories);
        console.log("Values1:", values1);
        console.log("Values2:", values2);

        if (categories && values1 && values2) {
            var categoryList = categories.split(',');
            var value1List = values1.split(',');
            var value2List = values2.split(',');

            console.log("Category list:", categoryList);
            console.log("Value1 list:", value1List);
            console.log("Value2 list:", value2List);

            // 各行のデータをログ出力しながら初期値設定
            for (var i = 0; i < categoryList.length; i++) {
                var rowSelector = '依頼内容TBL_' + i;  // 適切なIDに修正

                // HTML構造に応じてクラス名やIDを修正
                console.log("Setting values for row:", rowSelector);
                console.log("Category:", categoryList[i]);
                console.log("Value1:", value1List[i]);
                console.log("Value2:", value2List[i]);

                // 各フィールドに値を設定
                var categoryField = document.querySelector('#' + rowSelector + '_categoryField');
                var value1Field = document.querySelector('#' + rowSelector + '_value1Field');
                var value2Field = document.querySelector('#' + rowSelector + '_value2Field');

                if (categoryField) categoryField.value = categoryList[i];
                if (value1Field) value1Field.value = value1List[i];
                if (value2Field) value2Field.value = value2List[i];
            }
        } else {
            console.log("One or more parameters are missing.");
        }

        // MutationObserver を使って DOM の変更を監視
        var targetNode = document.querySelector('body'); // 監視したいノードを指定（適切に修正してください）
        var config = { attributes: true, childList: true, subtree: true };

        var callback = function(mutationsList, observer) {
            for (var mutation of mutationsList) {
                if (mutation.type === 'childList') {
                    console.log('A child node has been added or removed.');
                } else if (mutation.type === 'attributes') {
                    console.log('The ' + mutation.attributeName + ' attribute was modified.');
                }
            }
        };

        var observer = new MutationObserver(callback);
        observer.observe(targetNode, config);

        // フォームのアンマウント時に監視を解除
        fb.events.form.unmounted = [function() {
            observer.disconnect();
        }];
    }];
})();

[aaa]

ブレークポイントを仕掛けてみてどこまで値が入っているかわかりますか？

var rowSelector = '依頼内容TBL_' + i;  // 適切なIDに修正

// HTML構造に応じてクラス名やIDを修正
console.log("Setting values for row:", rowSelector);
console.log("Category:", categoryList[i]);
console.log("Value1:", value1List[i]);
console.log("Value2:", value2List[i]);

ぐらいまでは意図通りに値が取れていますか？
テーブルに値をいれたいなら、テーブルから値を取れるかを試して
入れてみるのがよいと思います。

パラメターから取得するカテゴリーと
テーブルの関係が読み取れませんでした。
教えていただけないですか？

[Light_shun]

失礼いたしました。
以下の画像の通り、パラメータからの値は取れており、各行に入れ込めるように分解されているのですが、入れ込むところがうまくいっていないのだと認識しております。

パラメータは次の通りです。
?categories=CategoryA,CategoryB,CategoryC&values1=1,2,3&values2=4,5,6

「依頼内容TBL」というフィールドコードのテーブルに各項目を入れ込もうとしております。
以下テーブル内のフィールドコードです。
列１：categoryField
列２：value1Field
列３：value2Field

[aaa]

以下のあたりにブレークポイントを入れて値が取れているのでしょうか？

// 各フィールドに値を設定
var categoryField = document.querySelector('#' + rowSelector + '_categoryField');
var value1Field = document.querySelector('#' + rowSelector + '_value1Field');
var value2Field = document.querySelector('#' + rowSelector + '_value2Field');

[Light_shun]

フォームブリッジ側のフィールドが取得できていないようですかね？
デベロッパーツールを使い慣れていないため、認識正しいか不安なところですが。。。

[aaa]

kintone JavaScriptカスタマイズデバッグまとめ - cybozu developer network

kintone JavaScriptカスタマイズデバッグまとめ

をよく読まれてから続きをやりませんか？（話が全然前に進まないため）

[aaa]

前提
1)フォームのアドレス?categories=CategoryA&values1=1&values2=4
アクセスする
2)仮で1行だけの前提で
3)フォームの構成がよくわからないのでフィールドコードなどは調整してください。

(() => {
    fb.events.form.mounted = [(state) => {
        // URLパラメータを取得する関数
        function getQueryParam(param) {
            var urlParams = new URLSearchParams(window.location.search);
            return urlParams.get(param);
        }

        // パラメータ取得のログ
        const categories = getQueryParam('categories');
        const values1 = getQueryParam('values1');
        const values2 = getQueryParam('values2');

        console.log("Categories:", categories);
        console.log("Values1:", values1);
        console.log("Values2:", values2);

        state.record.テーブル.value[0].value.categoryField.value = categories
        state.record.テーブル.value[0].value.value1Field.value = values1
        state.record.テーブル.value[0].value.value2Field.value = values2

        return state;
    }];
})();

[aaa]

[Light_shun]

ありがとうございます。
まったくの素人で、ご迷惑をおかけいたしました。

いただいたものをもとに調整してみます。
大変助かりました。