Как использовать идентификатор Thymeleaf в Javascript?

Я использую HTML для назначения своего идентификатора в Thymeleaf (данные взяты из PostgreSQL, фреймворка SpringBoot на Eclipse. PHP и JQuery не включены в учебную программу).

Я хочу проверить, не выбрал ли пользователь какие-либо переключатели, и хочу попробовать это на Javascript.

HTML:

<!DOCTYPE html>
<html>
<head>
<meta charset = "UTF-8" name = "viewport"
    content = "width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0" />
<!-- CSSの読み込み -->
<link type = "text/css" rel = "stylesheet" href = "./css/examMain.css">
<title>模擬試験オンラインー英単語試験</title>
</head>

<body>
    <form method = "post" action = "/result" data-th-object = "${form}">
        <!-- ヘッダータイトル -->
        <div class = "headerbackground">
            <h6>模擬試験オンライン</h6>
        </div>
        <br>
        <!-- 試験指示 -->
        <div class = "examinstruction">
            <p>表示された言葉の英単語を以下から1つを選び、</p>
            <p>OKボタンをクリックしてください。</p>
        </div>
        <br>
        <!-- 質問 -->

        <div data-th-each = "list, st : ${form.list}">
            <p style = "text-align: center; font-size: 12px;">
                <span data-th-text = "${list.questionCount}">n</span> <span>/</span> <span
                    data-th-text = "${list.questionTotal}">/n</span>
            </p>
            <div class = "questionborder">
                <p style = "font-size: 22px; font-weight: bold"
                    data-th-text = "${list.content}">question</p>
            </div>
            <!-- 解答選択肢 -->
            <fieldset style = "border: 0">
                <div class = "choiceradiobox"
                    data-th-each = "choice, stat : ${list.choice}">
                    <input data-th-id = "|choice_id${st.index}${stat.index}|"
                        data-th-name = "|choice${st.count}|" type = "radio"
                        data-th-value = "${choice}"
                        data-th-field = "*{list[__${st.index}__].choiceAnswer}" /> <br>
                    <label data-th-for = "|choice_id${st.index}${stat.index}|"
                        data-th-text = "${choice}"></label>
                </div>
            </fieldset>
        </div>

        <!-- 解答完了ボタン -->
        <div class = "submitsection">
            <input class = "btn btn-secondary" style = "font-size: 25px"
                type = "submit" value = "OK!">
        </div>
    </form>
</body>
</html>

Застряли в части идентификатора. Есть ли способ изменить этот бит?

data-th-id = "|choice_id${st.index}${stat.index}|"

в код Javascript как нечто, начинающееся с document.getElementById, как это?

var choiceselect = document.getElementById("|choice_id${st.index}${stat.index}|".checked);

Я прочитал официальный документ Thymeleaf, но все еще не мог понять часть Js :( (приведенный выше код создает ошибку, в которой говорится, что java.lang.IndexOutOfBoundsException: индекс 1 выходит за пределы для длины 1)

Заранее спасибо!

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
0
96
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

я думаю, что понял - для переключателей вместо идентификатора лучше использовать имя. так:

for (var j = 0; j < 8; j++) {
    var radio_choice = document.getElementsByName("list[" + j +"].choiceAnswer");

Другие вопросы по теме