使用片段thymeleaf在模式中填充表单数据
我用的是Spring boot和Thymeleaf。我有一个模式表单来创建/编辑信息：
<div class="modal" id="myModal" th:fragment="content">
<form th:object="${object}">
<div class="modal-dialog">
<div class="modal-content">
<!– Modal Header –>
<div class="modal-header row">
<div class="col-md-10">
<h4 class="modal-title">Create/Edit</h4>
</div>
<div class="col-md-2">
<button type="button" class="close" data-dismiss="modal"
style="float: right;">×</button>
</div>
</div>
<!– Modal body –>
<div class="modal-body">
<div class="form-group">
<label for="ID">ID</label>
<input type="text" class="form-control" id="ID" placeholder="ID"
th:field="*{id}">
</div>
<div class="form-group">
<label for="name">Name</label>
<input type="text" class="form-control" id="name" placeholder="name"
th:field="*{name}">
</div>
<div class="form-group">
<label for="description">Description</label>
<input type="text" class="form-control" id="description" placeholder="Description"
th:field="*{description}">
</div>
<div class="form-group">
<label for="date">Date</label>
<input type="date" class="form-control" id="date" placeholder="Date"
th:field="*{date}">
</div>
<div class="form-group">
<label for="other">Other</label>
<input type="text" class="form-control" id="other" placeholder="other"
th:field="*{other}">
</div>
</div>
<!– Modal footer –>
<div class="modal-footer">
<button type="submit" class="btn btn-primary">Submit</button>
<button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</form>
</div>
我不能放在索引中。html，因为对象为null。当用户单击按钮以装箱/编辑用户时，将弹出模式和数据。按钮为：
<button type="button" class="btn btn-success" onclick="triggerModal(null)">Create New</button>
我的JQuery函数：
function triggerModal(id) {
if(id==null){
var url = "/create";
}else{
var url = "/create/{"+id+"}";
}
$('#content').load(url);
$('#myModal').modal({show:true});
}
控制器：
@GetMapping(value = {"/create","/create/{id}"})
public String createObject(Model theModel, @PathVariable(required = false)String id){
if(id!=null){
Optional<Object> object= objectRepository.findById(id);
if(object.isPresent()){
theModel.addAttribute("Object", object.get());
return "/form-modal::content";
}
}
theModel.addAttribute("Object", new Object());
return "/form-modal::content";
}
这是我放在索引上的div标记。html
<div id="content"></div>
我已经成功地插入模态超文本标记语言体与数据加载，但模态不正确显示。
共有1个答案
我已经解决了。只需将th:fragment放在modal类中：
<div >
<form th:object="${object}" th:fragment="content">
<div class="modal-dialog">
<div class="modal-content">
<!– Modal Header –>
<div class="modal-header row">
<div class="col-md-10">
<h4 class="modal-title">Create/Edit</h4>
</div>
<div class="col-md-2">
<button type="button" class="close" data-dismiss="modal"
style="float: right;">×</button>
</div>
</div>
<!– Modal body –>
<div class="modal-body">
<div class="form-group">
<label for="ID">ID</label>
<input type="text" class="form-control" id="ID" placeholder="ID"
th:field="*{id}">
</div>
<div class="form-group">
<label for="name">Name</label>
<input type="text" class="form-control" id="name" placeholder="name"
th:field="*{name}">
</div>
<div class="form-group">
<label for="description">Description</label>
<input type="text" class="form-control" id="description" placeholder="Description"
th:field="*{description}">
</div>
<div class="form-group">
<label for="date">Date</label>
<input type="date" class="form-control" id="date" placeholder="Date"
th:field="*{date}">
</div>
<div class="form-group">
<label for="other">Other</label>
<input type="text" class="form-control" id="other" placeholder="other"
th:field="*{other}">
</div>
</div>
<!– Modal footer –>
<div class="modal-footer">
<button type="submit" class="btn btn-primary">Submit</button>
<button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</form>
</div>
并更改索引文件中的div标签：
<div class="modal" id="myModal"></div>
-
在Thymeleaf中，我可以使用 但是我不知道如何输出到表单动作属性中。 有人对Thymeleaf超文本标记语言有什么想法吗？ 样例JavaSpring-MVC控制器代码
-
在SpringMVC项目的控制器中，我确实有一个列表，我将其放在模型映射中，如下所示。 现在我想在thymeleaf视图中使用post方法动态填充它。为此，我使用了一个JavaScript脚本。这不是所有的html代码，但为了简单起见，我只添加了JS部分。 这是测试有效的后方法。 它向我显示了错误：错误解析模板[]，模板可能不存在或任何已配置的模板解析程序都无法访问，这肯定是因为：。有没有办法动态
-
我试图使用另一个片段中的数据填充我的Listview。 我可以从另一个片段获取数据，但当我尝试创建listview对象时，它返回null。 结果，该应用程序正在崩溃。 我从一个片段中获取用户的数据，然后从另一个片段中调用一个方法来传递数据。我正在第二个方法的poplist（）方法中创建listview对象和数组适配器。但是，由于空指针异常，应用程序正在崩溃。请帮忙。 我尝试了以下方法，但不起作用
-
我有一个包含大约30个html thymeleaf模板的网站。我有一个home_navigation.html片段，作为标题包含在所有模板中。这个标题定义了一个带有弹出子菜单的主导航菜单。我的一个主菜单下的弹出子菜单需要从我的oracle数据库表中生成。 通常，当将数据从数据库传递到Thymeleaf模板时，我会将代码放在控制器中，以调用java DAO并返回链接对象列表，然后使用将该列表添加到控
-
我有一个基于类的视图（IndexView at views.py），它显示了一个包含数据库中存储的所有数据的表。此视图在索引中呈现。html使用获取所有数据。还没有问题。 对我来说，困难的部分是尝试使用表单来完成它，以便能够修改和保存金额列。我对POST部分没有问题，我使用AJAX来保存新值。我遇到的问题是从数据库中获取初始值以填充Django表单（forms.py） 我尝试在表单字段的定义中使用
-
问题内容： 我有一个HTML表单，可以通过ajax保存到数据库中。为了获得键/值对的查询字符串，我使用了非常方便的函数，如下所示： 现在，我想加载一个空白表格，并用数据库中的数据重新填充它，该数据是通过ajax调用作为JSON字符串传递的。我已经能够获得具有正确键/值对的Javascript对象，如下所示： 重新填写表格的最简单，最优雅的方法是什么？ 请记住，表单的输入元素是文本，选择，复选框和单