Question

我在html中有一个下拉菜单。当用户选择限制为10行时，单击按钮时，将选择10行数据。但下拉菜单仍显示"Limit to 5 rows"。如何更改默认值？

 <div class="starter-template">
        <div class="row" style="margin-bottom:30px">
            <div class="col-md-12" style="margin-top:20px">
                <form id="form" name="form" class="form-inline">
                    <div class="form-group">
                        <select id="limit" name="limit" class="form-control">
                            <option value="5">Limit to 5 rows</option>
                            <option value="10">Limit to 10 rows</option>
                            <option value="50">Limit to 50 rows</option>

                        </select>
                    </div>
                    <button type="submit" class="btn btn-primary">Filter</button>
                </form>
            </div>
        </div>

控制器类

@RequestMapping(value="/scoreLog", method = RequestMethod.GET)
    public String scoreLogList(Model model, @RequestParam(value = "limit", defaultValue = "5") Integer limit) {
        model.addAttribute("scoredList", txnLogRepository.findByScore(23, new PageRequest(0, limit)));
        return "scoreList";
    }

Answer 1

首先在控制器中为模型添加属性：

model.addAttribute("limit", limit);

它会将限制的当前值公开给您的模板。

然后在您的模板中，您需要修改选项标签：

<option value="5" th:selected="${limit == 5}">Limit to 5 rows</option>
<option value="10" th:selected="${limit == 10}">Limit to 10 rows</option>
<option value="50" th:selected="${limit == 50}">Limit to 50 rows</option>

请参阅：

Bootstrap下拉菜单删除默认值

1 个答案: