时间戳

首页 > 解决方案 > 如何从数据库中填充下拉列表并在选择页面时更新页面？

html - 如何从数据库中填充下拉列表并在选择页面时更新页面？

问题描述

我正在制作一个网站，它在哪里有点像 Pokédex单击时将使用选择的任何神奇宝贝更新页面。

我目前面临的问题是，尽管数据库中有许多神奇宝贝，但下拉菜单没有出现，这表明它没有选择正确的值，或者它是，但它无法解释结果正确。

带有下拉菜单的 html 是：

<section class="dropdown">
            <form action="/pokemon" method="post" th:object="${pokemon}">
                <select th:each="pokemon : ${pokemonList}">
                    <option th:value="${pokemon.dexNum}" th:text="${pokemon.name}"></option>
                </select>
            </form>
        </section>

哪个应该在选择时请求这种方法，但如果没有下拉菜单，我无法确认它是如何工作的，所以它可能有缺陷。

private EntityManager em = new EntityManager();

@PostMapping(value = "/pokemon")
    public Pokemon changeCurrentPokemon(int num) {
        pokemonService.setCurrentPokemon(em.find(Pokemon.class, num));
        return pokemonService.getCurrentPokemon();
    }

通过以下方式访问变量：

@GetMapping(value = "/pokemon")
    public ModelAndView showPokemon() {

        return new ModelAndView("pokemon", "pokemon",
                pokemonService.getCurrentPokemon() != null
                        ? pokemonService.getCurrentPokemon()
                        : new Pokemon(1, "Bulbasaur", "Seed Pokemon", "/images/pokemon/1-Bulbasaur.png", "Grass", "Poison")
        );
    }

pokemonService 类是此处显示的 pokemonService 的实现：

package pokedex.services;

import org.springframework.stereotype.Service;
import pokedex.dao.PokemonRepository;
import pokedex.entities.Pokemon;

import java.util.List;

@Service
public class PokemonServiceImpl implements PokemonService {

    private PokemonRepository pokemonRepository;
    private Pokemon currentPokemon;

    public PokemonServiceImpl(PokemonRepository pokemonRepository) {
        this.pokemonRepository = pokemonRepository;
    }

    @Override
    public List<Pokemon> getPokemonList() {
        return pokemonRepository.findAll();
    }

    @Override
    public void addPokemon(Pokemon pokemon) {
        currentPokemon = pokemon;
        pokemonRepository.save(pokemon);
    }

    @Override
    public void setCurrentPokemon(Pokemon pokemon) {
        currentPokemon = pokemon;
    }

    @Override
    public Pokemon getCurrentPokemon() {
        return currentPokemon;
    }

    @Override
    public int getNumberOfPokemon() {
        return (int) pokemonRepository.count();
    }
}

如果有人对如何完成表格有任何提示，我将非常感谢您的帮助，谢谢

标签： htmlspringthymeleafhtml-selecth2

解决方案

你有一个pokemon模型变量和一个pokemon变量th:each。改变其中之一。也pokemonList没有设置。这不只是一个错字吗？

<section class="dropdown">
            <form action="/pokemon" method="post" th:object="${pokemon}">
                <select th:each="pokemon: ${pokemonList}">
                    <option th:value="${pokemon.dexNum}" th:text="${pokemon.name}"></option>
                </select>
            </form>
        </section>

推荐阅读