我有这个thymeleaf模板代码片段
` <tr th:each="file : ${files}">
<td>
<a target="_blank" class="btn btn-success"
th:href="@{/home/get-file/{file}(file = ${file})}">View</a>
<a class="btn btn-danger"
th:href="@{/home/delete-file/{file}(file = ${file})}">Delete</a>
</td>
<th scope="row" th:text="${file}">ExampleFile.txt</th>
</tr>`
当文件为String[]
时它不工作,当文件为List<String>
时也不显示任何内容
我试过在两种不同的类型之间转换。
我的迭代方式有什么问题吗?我相信语法是正确的。另外,这是我的model:Model
,就在控制器端点方法返回之前,看起来所有的数据都在那里:
enter image description here
“”“UPDATE'"”这是传递模型的方式:“控制器”
@PostMapping("/upload")
public String handleFileUpload(@RequestParam("fileUpload") MultipartFile file,
->>Model model<--) throws IOException {
fileService.addFile(SecurityContextHolder.getContext().getAuthentication(), file, model);
return "result";
}
“服务”
public int addFile(Authentication authentication, MultipartFile multipartFile, Model model) throws IOException {
String userName = authentication.getName();
User user = userMapper.getUser(userName);
Integer userId = user.getUserId();
String fileName = multipartFile.getOriginalFilename();
if (!fileIsDuplicate(userId, fileName)) {
try {
byte[] fileData = multipartFile.getBytes();
String contentType = multipartFile.getContentType();
String fileSize = String.valueOf(multipartFile.getSize());
File file = new File(fileName, contentType, fileSize, (long)userId, fileData);
int id = fileMapper.insertFile(file);
-----> ------->>>model.addAttribute("files", fileMapper.getFilesByUserId(userId).toArray(new String[0]));
model.addAttribute("result", "success");
return id;
} catch (IOException e) {
e.printStackTrace();
model.addAttribute("result", "error");
model.addAttribute("message", "Exception occurred while trying to save file.");
return -1;
}
}
model.addAttribute("result", "error");
model.addAttribute("message", "You have tried to add a duplicate file.");
return -1;
}
请注意,正如在所附的调试器会话屏幕截图中所看到的,当我回到控制器层并准备返回视图时,模型中有文件值,这意味着在后端控制器端点方法返回时,模型不为空。
这是我的主页
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="https://www.thymeleaf.org">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" type="text/css" media="all" th:href="@{/css/bootstrap.min.css}">
<title>Home</title>
</head>
<body class="p-3 mb-2 bg-light text-black">
<div class="container">
<div id="logoutDiv">
<form action="#" th:action="@{/logout}" method="POST">
<button type="submit" class="btn btn-secondary float-right" id="btn-logout">Logout</button>
</form>
</div>
<div id="contentDiv" style="clear: right;">
<nav style="clear: right;">
<div class="nav nav-tabs" id="nav-tab" role="tablist">
<a class="nav-item nav-link active" id="nav-files-tab" data-toggle="tab" href="#nav-files" role="tab" aria-controls="nav-files" aria-selected="true">Files</a>
<a class="nav-item nav-link" id="nav-notes-tab" data-toggle="tab" href="#nav-notes" role="tab" aria-controls="nav-notes" aria-selected="false">Notes</a>
<a class="nav-item nav-link" id="nav-credentials-tab" data-toggle="tab" href="#nav-credentials" role="tab" aria-controls="nav-credentials" aria-selected="false">Credentials</a>
</div>
</nav>
<div class="tab-content" id="nav-tabContent">
<div class="tab-pane fade show active" id="nav-files" role="tabpanel" aria-labelledby="nav-files-tab">
<form action="#" enctype="multipart/form-data" th:action="@{/file/upload}" method="POST">
<div class="container">
<div class="row" style="margin: 1em;">
<div class="col-sm-2">
<label for="fileUpload">Upload a New File:</label>
</div>
<div class="col-sm-6">
<input type="file" class="form-control-file" id="fileUpload" name="fileUpload">
</div>
<div class="col-sm-4">
<button type="submit" class="btn btn-dark" id="uploadButton">Upload</button>
</div>
</div>
</div>
</form>
<div th:if="${not #strings.isEmpty(error)}" th:text="${error}"></div>
<div class="table-responsive">
<table class="table table-striped" id="fileTable">
<thead>
<tr>
<th style="width: 20%" scope="col"></th>
<th style="width: 80%" scope="col">File Name</th>
</tr>
</thead>
<tbody>
<tr th:each="file : ${files}">
<td>
<a target="_blank" class="btn btn-success"
th:href="@{/file/{file}(file = ${file})}">View</a>
<a class="btn btn-danger"
th:href="@{/file/delete/{file}(file = ${file})}">Delete</a>
</td>
<td scope="row" th:text="${file}">ExampleFile.txt</td>
</tr>
</tbody>
<tbody>
<tr th:each="file : ${filess}">
<td scope="row" th:text="${file}">File</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="tab-pane fade" id="nav-notes" role="tabpanel" aria-labelledby="nav-notes-tab">
<button style="margin: 0.25em;" type="button" class="btn btn-info float-right"
onclick="showNoteModal()" id="btnAddNewNote">
+ Add a New Note
</button>
<div class="table-responsive">
<table class="table table-striped" id="userTable">
<thead>
<tr>
<th style="width: 20%" scope="col"></th>
<th style="width: 20%" scope="col">Title</th>
<th style="width: 60%" scope="col">Description</th>
</tr>
</thead>
<tbody>
<tr th:each="note : ${notes}">
<td>
<button id="btnEditNote" type="button" class="btn btn-success"
th:data-id="${note.getNoteId()}"
th:data-title="${note.getNoteTitle()}"
th:data-description="${note.getNoteDescription()}"
th:onclick="showNoteModal(this.getAttribute('data-id'), this.getAttribute('data-title'), this.getAttribute('data-description'))">
Edit
</button>
<a id="ancDeleteNote" class="btn btn-danger"
th:href="@{/note/delete-note/{noteId}(noteId = ${note.getNoteId()})}">Delete</a>
</td>
<th id="tableNoteTitle" scope="row" th:text="${note.getNoteTitle()}">Example Note Title</th>
<td id="tableNoteDescription" th:text="${note.getNoteDescription()}">Example Note Description</td>
</tr>
</tbody>
</table>
</div>
<div class="modal fade" id="noteModal" tabindex="-1" role="dialog" aria-labelledby="noteModalLabel"
aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="noteModalLabel">Note</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form action="#" method="POST" th:action="@{/note/add-note}" th:object="${newNote}">
<input type="hidden" name="noteId" th:field="*{noteId}" id="note-id">
<div class="form-group">
<label for="note-title" class="col-form-label">Title</label>
<input type="text" name="noteTitle" th:field="*{title}" class="form-control"
id="note-title" maxlength="20" required>
</div>
<div class="form-group">
<label for="note-description" class="col-form-label">Description</label>
<textarea class="form-control" name="noteDescription" th:field="*{description}"
id="note-description" rows="5" maxlength="1000" required></textarea>
</div>
<button id="noteSubmit" type="submit" class="d-none"></button>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" id="btnSaveChanges" class="btn btn-primary" onclick="$('#noteSubmit').click();">Save
changes
</button>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="nav-credentials" role="tabpanel" aria-labelledby="nav-credentials-tab">
<button style="margin: 0.25em;" type="button" class="btn btn-info float-right" onclick="showCredentialModal()">
+ Add a New Credential
</button>
<div class="table-responsive">
<table class="table table-striped" th:object="${credentials}" id="credentialTable">
<thead>
<tr>
<th style="width: 20%" scope="col"></th>
<th style="width: 35%" scope="col">URL</th>
<th style="width: 20%" scope="col">Username</th>
<th style="width: 25%" scope="col">Password</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<button type="button" class="btn btn-success">Edit</button>
<a class="btn btn-danger">Delete</a>
</td>
<th scope="row">Example Credential URL</th>
<td>Example Credential Username</td>
<td>Example Credential Password</td>
</tr>
</tbody>
</table>
</div>
<div class="modal fade" id="credentialModal" tabindex="-1" role="dialog" aria-labelledby="credentialModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="credentialModalLabel">Credential</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form action="#" method="POST">
<input type="hidden" name="credentialId" id="credential-id">
<div class="form-group">
<label for="credential-url" class="col-form-label">URL</label>
<input type="text" name= "url" class="form-control" id="credential-url" maxlength="100" required>
</div>
<div class="form-group">
<label for="credential-username" class="col-form-label">Username</label>
<input type="text" name= "username" class="form-control" id="credential-username" maxlength="30" required>
</div>
<div class="form-group">
<label for="credential-password" class="col-form-label">Password</label>
<input type="text" name= "password" class="form-control" id="credential-password" maxlength="30" required>
</div>
<button id="credentialSubmit" type="submit" class="d-none"></button>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary" onclick="$('#credentialSubmit').click();">Save changes</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="/js/home.js"></script>
<script th:src="@{/js/jquery-slim.min.js}"></script>
<script th:src="@{/js/popper.min.js}"></script>
<script th:src="@{/js/bootstrap.min.js}"></script>
<!--For opening the note modal-->
<script type="text/javascript">
// For opening the note modal
function showNoteModal(noteId, noteTitle, noteDescription) {
$('#note-id').val(noteId ? noteId : '');
$('#note-title').val(noteTitle ? noteTitle : '');
$('#note-description').val(noteDescription ? noteDescription : '');
$('#noteModal').modal('show');
}
// For opening the credentials modal
function showCredentialModal(credentialId, url, username, password) {
$('#credential-id').val(credentialId ? credentialId : '');
$('#credential-url').val(url ? url : '');
$('#credential-username').val(username ? username : '');
$('#credential-password').val(password ? password : '');
$('#credentialModal').modal('show');
}
</script>
</body>
</html>
和我的result.html模板
<link rel="stylesheet" type="text/css" media="all" th:href="@{/css/bootstrap.min.css}">
<title>Result</title>
</head>
<body class="p-3 mb-2 bg-light text-black">
<div class="container justify-content-center w-50 p-3" style="margin-top: 5em;">
<div th:if="${result == 'success'}" class="alert alert-success fill-parent">
<h1 class="display-5">Success</h1>
<span>Your changes were successfully saved. Click <a href="/home" id="aResultSuccess">here</a> to continue.</span>
</div>
<div th:if="${result == 'notSaved'}" class="alert alert-danger fill-parent">
<h1 class="display-5">Error</h1>
<span>Your changes were not saved. Click <a>here</a> to continue.</span>
</div>
<div th:if="${result == 'error'}" class="alert alert-danger fill-parent">
<h1 class="display-5">Error</h1>
<span th:text="${message}">Example Error Message</span>
<span>Click <a href="/home" id="aResultFailure">here</a> to continue.</span>
</div>
</div>
</body>
1条答案
按热度按时间yjghlzjz1#
我认为原因是我提供了一个result.html视图,当我从result.html单击返回到home.html时,它只是一个将我带到home.html的元素。当我添加了一个请求到按钮,把我从结果视图带回到主视图,这是负责更新模型。我认为模型's的信息保存在前端的某个地方,但我猜事实并非如此?