Как установить курсор на нужную строку таблицы на html странице?

Страница получает набор строк и с пом. thymeleaf помещает их в таблицу. Нужно, чтобы после заполнения таблицы курсор устанавливался на выбранную строку. Какой н.б. тег вроде: <td active="true"


Ответы (1 шт):

Автор решения: Slava Ivanov

Thymeleaf вам конечно поможет, но не будет делать то что вы хотите. Вместо этого броузер сделает всю работу по позиционировании страницы. Как броузер может спозиционировать страницу? Самое простое это букмарк, то есть этот URL ...

https://my_website.com/my_page_with_table#my_table_row

загрузит страницу с таблицей и спозиционирует её на элементе с Id my_table_row.

Теперь все вместе... На вашей странице с таблицей, добавте к каждому линку уникальный Id и для этого Thymeleaf нам поможет, например ...

<a th:id="|${series.index}${el.getIdClass()}|" th:href="@{/spaceMosaicItem/{id}/{cls}(id=${series.index}, cls=${el.getIdClass()})}" th:text="${el.textQuestion}" class="nav-link"> </a>

Сейчас каждый линк в таблице имеет свой букмарк. Его также можно переместить из линка в строку таблицы <tr>, будет лучше позиционировать, на мой взгляд.

Далее, в контроллере вашей страниы с деталями spaceMosaicItem когда вы делаете редирект назад на страницу с таблицей, добавте хеш к URL состоящий из параметров ва получили через URL. В нашем случае мы в Thymeleaf скомбенировали {id}{cls} и ваш редирект назад будет тот же плюс решетка хаш ...

same_url + '#' + id + cls

Как-то так по простому. Можно использоать JavaScript, если захотите плавный скроллинг.

→ Ссылка