Как создать скроллБар на thymeleaf возвращающий строку?

Question

[Денис Кузнецов]

Здравствуйте, если я допустим хочу заполнить какое то поля у объекта смапленного со страницей, то это будет выглядеть примерно так :

<form th:action="@{'/plantEdit/'+${boxId}}"
      th:object="${plant}" method="POST">
    <input th:type="hidden" name="id" th:field="${plant.id}" />
    Plant name:
    <input type="text" th:field="*{plantName}" />
    <br/>
    <input type="submit" value="Create" />
    <a href="#" th:href="@{/}" role="button">Cancel</a>
</form>

тоесть при действии на странице вызовется контроллер отвечающий за post и засабмитит значение которое введет пользователь , причем, когда эта страница только вызвалась (get) , то в соответствие параметру "plant" был поставлен объект и потом этот объект был передан в функцию отвечающую за post.
Но мне надо, допустим ,поднимать данные с базы поддерживаемых растений (только имена допустим), после эти имена надо каким то образом передать на страницу в скролл бар, чтобы пользователь уже из них выбрал растение и при сабмите в контроллер передалась эта строка (имя) , по этому имени из базы поддерживаемых растений будут подтянуты еще некоторые данные которые нужны при создании объекта , который пользователь положит в свою коробку.
вот мои контроллеры :

@RequestMapping(value = {"/plantEdit/{boxId}", "/plantEdit/{boxId}/{id}"}, method = RequestMethod.GET)
    public String growBoxesEditForm(Model model,
                                    @PathVariable(name = "boxId") Long boxId,
                                    @PathVariable(required = false, name = "id") Long id) throws ResourceNotFoundException {

        logger.info("now we observe plant with id : " + id);

        if(id != null){
            model.addAttribute("plant", plantService.findById(id));
        }else {
            model.addAttribute("plant", new Plant());
        }

        model.addAttribute("boxId", boxId);

        return "plantEdit";
    }

    @RequestMapping(value = "/plantEdit/{boxId}", method = RequestMethod.POST)
    public String growBoxEditForm(Model model, Plant plant,
                                  @PathVariable(name = "boxId") Long boxId) throws ResourceNotFoundException {

        GrowBox box = growBoxService.findById(boxId);
        plant.setResponsibleGrowBox(box);

        plantService.savePlant(plant);

        model.addAttribute("plants", plantService.findByBoxId(boxId));
        return "showPlants";
    }

вопрос в том как написать скролл бар и обработать выбранное значение в контроллере , заранее спасибо

Answer 1

[Орхан Гасанлы]

Скажу честно, не совсем понял, что вы имеете ввиду под "скроллбар"ом, в данном контексте...
На основании этого текста:

Но мне надо, допустим ,поднимать данные с базы поддерживаемых растений (только имена допустим), после эти имена надо каким то образом передать на страницу в скролл бар, чтобы пользователь уже из них выбрал растение и при сабмите

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

Для реализации нужно сделать следующее:
1) реализовать метод, который возвращает список (List) или массив строк с названиями растений. (в Repository).
2) В GET запросе при открытии страницы через Model ( model.addAttribute("plants", repo.getPlants()) ) передать эту информацию.
3) далее остается все это дело красиво завернуть в dropdown список.
https://getbootstrap.com/docs/4.3/components/dropdowns/

Возможные растение вы можете хранить, как в БД (если предполагается частое добавления и удаление разновидностей) или хранить в виде Enum.

.... как обработать выбранное значение в контроллере ...

зависит от того, что вы выберете. В методе контроллера можно принять объект и сохранить его, можно принять enum и сохранить его, можно принять String и используя String.valueOf(myString) сохранить enum и т.д.

Comments

[Денис Кузнецов]

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

[Орхан Гасанлы]

Денис Кузнецов,

- вы имеете ввиду dropdown список.
- есть хороший jquery скрипт Bootstrap Select, который обладает огромным функционалом. Выбор мультизначений, поиск в дропдоуне, кастомный ввод и т.д.
- если решите использовать enum, то желательно сделать следующее:
1) указать названия на английском заглавными буквами, как и полагается
2) в appllication.properties указать переводы (текстовые значений) этих enum.