0
모달 폼을 invoque 할 때 문제가 있습니다. 수정 버튼을 클릭하면 양식을로드해야하지만 문제를 찾은 후에는 아무 것도 나타나지 않습니다. 그것이 문제가 여전히 해결하지만 아무것도 .... 노력하고 내가 오늘 여기 stucked있어, 남아모달 통합 중에 부트 스트랩 문제가 발생했습니다.
코드 조각 전체 코드를 보여주고있다 : 그것은 보인다
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title th:text="#{title}">Spring 4 MVC</title>
<meta charset="UTF-8" />
<link rel="stylesheet" type="text/css"
href="../static/css/bootstrap.min.css"
th:href="@{css/bootstrap.min.css}"
/>
<link rel="stylesheet" type="text/css"
href="../static/css/dataTables.bootstrap4.min.css"
th:href="@{css/dataTables.bootstrap4.min.css}"
/>
<link rel="stylesheet" type="text/css"
href="../static/css/buttons.bootstrap4.min.css"
th:href="@{css/buttons.bootstrap4.min.css}"
/>
<script type="text/javascript"
src="../static/js/jquery-3.2.1.min.js"
th:src="@{js/jquery-3.2.1.min.js}"></script>
<script type="text/javascript"
src="../static/js/jquery.dataTables.min.js"
th:src="@{js/jquery.dataTables.min.js}"></script>
<script type="text/javascript"
src="../static/js/dataTables.buttons.min.js"
th:src="@{js/dataTables.buttons.min.js}"></script>
<script type="text/javascript"
src="../static/js/pdfmake.min.js"
th:src="@{js/pdfmake.min.js}"></script>
<script type="text/javascript"
src="../static/js/dataTables.bootstrap4.min.js"
th:src="@{js/dataTables.bootstrap4.min.js}"></script>
<script type="text/javascript"
src="../static/js/buttons.bootstrap4.min.js"
th:src="@{js/buttons.bootstrap4.min.js}"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#example').DataTable({
});
table.buttons().container()
.appendTo('#example_wrapper .col-md-6:eq(0)');
});
</script>
<script type="text/javascript">
$(document).ready(function(){
$("#mytable #checkall").click(function() {
if ($("#mytable #checkall").is(':checked')) {
$("#mytable input[type=checkbox]").each(function() {
$(this).prop("checked", true);
});
} else {
$("#mytable input[type=checkbox]").each(function() {
$(this).prop("checked", false);
});
}
});
$("[data-toggle=tooltip]").tooltip();
});
</script>
</head>
<body>
<div class="container">
<div th:if="${not #lists.isEmpty(produit)}">
<h2>Product List</h2>
<table id="example" class="table table-striped table-bordered">
<thead>
<tr>
<th>Id</th>
<th>Product Id</th>
<th>Description</th>
<th>Price</th>
<th>View</th>
<th>Edit</th>
<th>Delete</th>
</tr>
</thead>
<tbody>
<tr th:each="product : ${produit}">
<td th:text="${product.idProduit}">Id</td>
<td th:text="${product.code}">code</td>
<td th:text="${product.libelle}">descirption</td>
<td th:text="${product.indice}">price</td>
<td><p data-placement="top" data-toggle="tooltip" title="Edit"><button data-title="Edit" data-toggle="modal" data-target="#edit">Edit</button></p>
</tr>
</tbody>
</table>
</div>
</div>
<div class="modal fade" id="edit" tabindex="-1" role="dialog" aria-labelledby="edit" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></button>
<h4 class="modal-title custom_align" id="Heading">Edit Your Detail</h4>
</div>
<div class="modal-body">
<div class="form-group">
<input class="form-control " type="text" placeholder="Mohsin"/>
</div>
<div class="form-group">
<input class="form-control " type="text" placeholder="Irshad"/>
</div>
<div class="form-group">
<textarea rows="2" class="form-control" placeholder="CB 106/107 Street # 11 Wah Cantt Islamabad Pakistan"></textarea>
</div>
</div>
<div class="modal-footer ">
<button type="button" class="btn btn-warning btn-lg" style="width: 100%;"><span class="glyphicon glyphicon-ok-sign"></span> Update</button>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
<div class="modal fade" id="delete" tabindex="-1" role="dialog" aria-labelledby="edit" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></button>
<h4 class="modal-title custom_align" id="Heading">Delete this entry</h4>
</div>
<div class="modal-body">
<div class="alert alert-danger"><span class="glyphicon glyphicon-warning-sign"></span> Are you sure you want to delete this Record?</div>
</div>
<div class="modal-footer ">
<button type="button" class="btn btn-success" ><span class="glyphicon glyphicon-ok-sign"></span> Yes</button>
<button type="button" class="btn btn-default" data-dismiss="modal"><span class="glyphicon glyphicon-remove"></span> No</button>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
</body>
</html>
''파일을 포함하지 않은 것으로 보입니다. '/ jquery-3.2.1.min.js' 다음에 그 파일을 포함 시키면 작동 할 것입니다. – Subash
감사합니다. @Subash –
안녕하세요. – Subash