Логика для предварительного заполнения select data в a для каждой таблицы

#javascript

#javascript

Вопрос:

У меня есть таблица, которая заполняется a для каждого, поэтому каждая строка представляет собой один набор данных, извлекаемых из таблицы SQL, назовите эту таблицу a (или таблицу marketAccess). Внутри каждой строки один столбец содержит выпадающий список, который заполняется a для каждого из другой таблицы SQL (назовем ее TableB), которая содержит названия компаний. Во втором столбце показан код компании. Мне нужно, чтобы этот код был предварительно заполнен на основе того, какое название компании было выбрано в первом столбце. Эти данные хранятся в таблице B (или таблице носителей). У меня возникли проблемы с поиском наилучшего способа предварительного заполнения кода компании. Я смог заставить его работать, выполнив выпадающий список для каждого кода компании… но это выглядит немного странно. И если вы выбираете новую компанию, вам необходимо обновить страницу, чтобы повторно заполнить код компании. Было интересно, есть ли лучший способ заполнить код и представить его в виде текста, а не выпадающего списка, используя Javascript, чтобы выяснить, какой вариант был выбран, а затем каким-то образом передать эту информацию обратно в столбец …?

Любые мысли о наилучшем способе решения этой проблемы были бы очень признательны!

Вот код для таблицы, причем код отображается как отключенный выпадающий список.

 <table id="carrier-table" class="table table-striped">
     <thead>
        <tr>
            <th>Company Name</th>
            <th>Agency Code</th>
         </tr>
      </thead>
      <tbody>
        <tr th:each="access,stat : *{marketAccess}">
            <td>
                <select id="carrierDropDown" class="form-control" style="width:150px;" th:field="*{marketAccess[__${stat.index}__].marketAccessCarrier}">
                    <th:block th:each="carrier : ${carriers}">
                        <option th:value="${carrier.id}" th:text="${carrier.carrierName}"></option>
                    </th:block>
                </select>
            </td>
            <td>
                <select class="form-control" style="width:150px;" th:field="*{marketAccess[__${stat.index}__].marketAccessCarrier.agencyCode}" disabled="true">
                    <th:block th:each="carrier : ${carriers}">
                        <option th:value="${carrier.id}" th:text="${carrier.agencyCode}"></option>
                    </th:block>
                </select>
            </td>
            <td><input type="text" class="form-control" style="width:125px;" id="username" th:field="*{marketAccess[__${stat.index}__].username}"/></td>
            <td><input type="text" class="form-control" style="width:125px;" id="password" th:field="*{marketAccess[__${stat.index}__].password}"/></td>
        </tr>
      </tbody> 

Комментарии:

1. Либо вам нужно обновить страницу, либо вам нужно задействовать Javascript. Статический HTML не может переписать часть DOM, потому что вы меняете поле на экране. В любом случае, я вообще не вижу в этом проблемы на стороне сервера. Я не вижу, чтобы этот вопрос имел какое-либо отношение к Java, Spring Boot или даже к Thymeleaf.

2. Если обновление страницы решает вашу проблему, то серверная сторона делает все, что может.

3. @Steve, мой вопрос: есть ли лучший способ заполнить это, чем a для каждого с помощью Thymeleaf. Могу ли я каким-то образом сделать то, что я пытаюсь выполнить, с помощью встроенного Javascript?

4. Thymeleaf просто пишет HTML для вас. Это все, что он делает. Он не предоставляет никакой логики выполнения. Он просто обрабатывает отправку обратно нужного вам HTML-кода, когда Spring отвечает на запрос. Вам нужно подумать о своей проблеме с Thymeleaf out of the picture и выяснить, как вы хотите, чтобы ваше приложение действовало. Затем, как только вы это сделаете, вы используете Thymeleaf для генерации HTML, который, по вашему мнению, вам нужен. Thymeleaf не имеет ничего общего с логикой вашего приложения. -ну, за исключением того, что он объединяет HTML и код для вас. Но он делает это как статическую операцию, которая просто создает одну HTML-страницу.

5. Это очень простой вопрос дизайна веб-приложения. Я не думаю, что это имеет какое-то отношение к тому, какую технологию вы используете на стороне сервера. Вы могли бы говорить о Node.js сервер написан на Javascript, и ваш вопрос не изменится.