Spring & Thymeleaf: обновить одну строку в таблице - PullRequest
0 голосов
/ 06 октября 2018

Я обновляю содержимое таблицы:

<tr id="rows" th:each="entity: ${entities}">
    <!-- ... -->
</tr>

и на стороне сервера:

@RequestMapping(value = "/replace", method = RequestMethod.GET)
public String replace(Model model) {
    model.addAttribute("entities", entities);
    return "/ :: #rows";
}

, вызывая метод с помощью:

$.get('/replace', function(fragment) {
    // fragment gives me all rows of the table
}

, который работаеткак и ожидалось.Однако я не хочу обновлять все строки каждый раз, а только одну, поэтому моя идея заключалась в том, чтобы использовать динамический id следующим образом:

<tr th:id="'row' + ${entity.id}" th:each="entity, iterStat: ${entities}">
    <!-- ... -->
</tr>

и на стороне сервера:

@RequestMapping(value = "/replace", method = RequestMethod.GET)
public String replace(@RequestParam("id") int id, Model model) {
    model.addAttribute("entities", entities);
    return "/ :: #row" + id;
}

вызов метода с:

$.get('/replace', {id: id} function(fragment) {
    // fragment is empty
}

, но это не работает.Глядя на HTML-код и серверную часть, id является правильным.Разве нельзя использовать th:id?Какой будет обходной путь, если я хочу обновить только одну строку в таблице, а не все строки?Спасибо.

Я тоже пробовал то же самое с th:fragment - работает без ${entity.id} и не с.

Ответы [ 3 ]

0 голосов
/ 07 октября 2018

Мне удалось отправить только одну сущность в представление с:

Entity entity = entityService.findById(id);
model.addAttribute("entities", entity);

Это, конечно, не самый красивый способ, но он дает желаемый результат.

0 голосов
/ 08 мая 2019

Очень поздний ответ, но я думаю, что это окончательное решение.

Фрагмент Thymeleaf

<tr th:fragment="entity-row" th:id="'row' + ${entity.id}" th:each="entity, iterStat: ${entities}">
    <!-- ... -->
</tr>

Код контроллера

@RequestMapping(value = "/replace", method = RequestMethod.GET)
public String replace(@RequestParam("id") int id, Model model) {
    Entity entity = entityService.findById(id);
    model.addAttribute("entities", Arrays.asList(entity)); // sending the row as list, so that the loop can iterate and will produce a single row
    return "file :: entity-row";
}

У вас есть нужная единственная строкаHTML в вашем ответе Ajax, теперь вы можете заменить существующую строку

$.get('/replace', {id: id} function(fragment) {
    $("#row" + id).replaceWith(fragment);
}
0 голосов
/ 06 октября 2018

Использование th:fragment должно сработать.Я обычно использую их, чтобы выполнить то, что вы пытаетесь сделать.Это пример того, как это реализовать.

<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns="http://www.w3.org/1999/xhtml">
<head></head>
<body>    
    <th:block th:fragment="entity-row">
        <tr th:id="'row'+${entity.id}">
            <td th:text=${entity.id}></td>
            <!-- Whatever other element you need. -->
        </tr>
    </th:block>
</body>

Добавьте приведенный выше код в новый HTML-файл.Помните, мы ожидаем одну единственную сущность, поэтому нам не нужен th: каждая.Теперь, чтобы получить фрагмент, вам нужно следующее в вашем контроллере:

@RequestMapping(value = "/replace/fragment", method = RequestMethod.GET)
@ResponseBody
public String replaceSingleRow(@RequestParam("id") int id, Model model) {
    Entity entity = entityService.findById(id);
    model.addAttribute("entity", entity);
    return "file :: entity-row";
}

Где file будет именем html-файла, который содержит фрагмент.Конечно, я предполагаю, что вы передаете только желаемый идентификатор нашему контроллеру.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...