我的Jsp:
下面是我的JSP,我正在尝试获取客户列表并使用foreach标记()并在循环中(foreach标记)我在每行的下拉按钮中都有Action列表,以便能够编辑和删除。问题是我的代码没有显示我的浏览器中有下拉列表的Action按钮。
当我在下面添加模态标记时,会出现此问题。如果模态标签被删除,那么它的工作原理。但我希望能够通过模态对话框添加客户。怎么可能呢?有人可以帮忙吗感谢。
发布Bigin
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset="utf-8"">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet"
href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<script type="text/javascript" src="resources/jquery/jquery-3.2.1.js"></script>
<script
src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<title></title>
<link rel="stylesheet" href="<c:url value="/resources/css/style.css"/>">
<script type="text/javascript"
src="<c:url value="/resources/script/script.js"/>"></script>
</head>
<body>
<div class="navbar-inner">
<img src="<c:url value="/resources/img/StNavBar.PNG"/>" />
</div>
<div class="content">
<div class="headers">
<div class="bottom1nav" id="myBottomnav">
<h4></h4>
</div>
<div class="utilityHeader" id="myUtilityHeader">
<h1>Utility Certificate Management</h1>
<div class="utilitySubHeader" id="mySubUtility">
<h2></h2>
<a href="#" class="createCustomer" data-toggle="modal"
data-target="#createCustomerModal">Create New Customer</a>
<section class="container">
<div class="panel panel-default">
<div class="panel-heading"></div>
<div class="panel-body">
<table class="table table-condensed table-hover outer-table table-sort">
<thead >
<tr>
<th>No.</th>
<th>Customer Name</th>
<th>Contact Name</th>
<th>Street</th>
<th>State</th>
<th>Zip-Code</th>
<th>Country</th>
<th>Email</th>
<th></th>
</tr>
</thead>
<tbody>
<c:forEach var="customer" items="${customers}">
<tr>
<td><c:out value="${status.count}" /></td>
<td><a title="Go to the Company Certificate Detail">${customer.customerName}</a></td>
<td>${customer.contactName}</td>
<td>${customer.customerName}</td>
<td>${customer.address.street}</td>
<td>${customer.address.state}</td>
<td>${customer.address.zipCode}</td>
<td>${customer.address.country}</td>
<td>${customer.email}</td>
<!--below line of code till end of tag </td> not showing on browser -->
<td>
<div class="btn-group">
<button type="button"
class="btn btn-default dropdown-toggle"
data-toggle="dropdown">
Actions <span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a data-toggle="modal"
data-target="#editCustomerModal">Edit Customer Detail</a></li>
<li><a onclick="alert('To be implemented.');">Delete Customer</a></li>
</ul>
</div>
</td>
</tr>
</c:forEach>
<tbody>
</table>
</div>
</div>
</section>
</div>
</div>
</div>
</div>
<!-- All modal dialog goes below this line -->
<!--create customer modal -->
<div id="createCustomerModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
Create New Customer
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
<table class="form-table">
<tbody>
<tr valign="top">
<td style="width: 25% !important;"><label
class="not-required" for="pool-name">Customer Name:</label></td>
<td><input type="text" id="name" title="Company Name" path="#"
class="form-control" /></td>
</tr>
<tr valign="top">
<td style="width: 25% !important;"><label
class="not-required" for="expire-after">Contact Name:</label></td>
<td><input type="text" id="actName" path="#"
class="form-control" /></td>
</tr>
<tr valign="top">
<td style="width: 25% !important;"><label
class="not-required" for="description">Street:</label></td>
<td><input type="text" id="street" path="#"
class="form-control" /></td>
</tr>
<tr valign="top">
<td style="width: 25% !important;"><label
class="not-required" for="expire-after">Zip-Code:</label></td>
<td><input type="text" id="zip" path="#"
class="form-control" /></td>
</tr>
<tr valign="top">
<td style="width: 25% !important;"><label
class="not-required" for="expire-after">Country:</label></td>
<td><input type="text" id="country" path="#"
class="form-control" /></td>
</tr>
<tr valign="top">
<td style="width: 25% !important;"><label
class="not-required" for="expire-after">Email:</label></td>
<td><input type="text" id="email" path="#"
class="form-control" /></td>
</tr>
</tbody>
</table>
</div>
<div class="modal-footer">
<div>
<input type="submit" id="createNewCustomer" value="Create"
class="btn btn-default" onClick="alert('To be Implemented');" />
<button type="button" class="btn btn-default" data-dismiss="modal">close</button>
</div>
</div>
</div>
</div>
</div>
<!--Edit Customer Modal -->
<div id="editCustomerModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
Create New Customer
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
<table class="form-table">
<tbody>
<tr valign="top">
<td style="width: 25% !important;"><label
class="not-required" for="pool-name">Customer Name:</label></td>
<td><input type="text" id="name" title="Company Name" path="#"
class="form-control" /></td>
</tr>
<tr valign="top">
<td style="width: 25% !important;"><label
class="not-required" for="expire-after">Contact Name:</label></td>
<td><input type="text" id="contact" path="#"
class="form-control" /></td>
</tr>
<tr valign="top">
<td style="width: 25% !important;"><label
class="not-required" for="description">Street:</label></td>
<td><input type="text" id="street" path="#"
class="form-control" /></td>
</tr>
<tr valign="top">
<td style="width: 25% !important;"><label
class="not-required" for="expire-after">Zip-Code:</label></td>
<td><input type="text" id="zip" path="#"
class="form-control" /></td>
</tr>
<tr valign="top">
<td style="width: 25% !important;"><label
class="not-required" for="expire-after">Country:</label></td>
<td><input type="text" id="country" path="#"
class="form-control" /></td>
</tr>
<tr valign="top">
<td style="width: 25% !important;"><label
class="not-required" for="expire-after">Email:</label></td>
<td><input type="text" id="email" path="#"
class="form-control" /></td>
</tr>
</tbody>
</table>
</div>
<div class="modal-footer">
<div>
<input type="submit" id="createNewCustomer" value="Save"
class="btn btn-default" onClick="alert('To be Implemented');" />
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
答案 0 :(得分:0)
我已通过以下更改测试您的代码,工作正常。
<c:forEach var="customer" begin="1" end="5">
<tr>
<td><c:out value="${status.count}" /></td>
<td><a title="Go to the Company Certificate Detail">1</a></td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
<td>8</td>
<!--below line of code till end of tag </td> not showing on browser -->
<td>
<div class="btn-group">
<button type="button"
class="btn btn-default dropdown-toggle"
data-toggle="dropdown">
Actions <span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a data-toggle="modal"
data-target="#editCustomerModal">Edit Customer Detail</a></li>
<li><a onclick="alert('To be implemented.');">Delete Customer</a></li>
</ul>
</div>
</td>
</tr>
</c:forEach>
请检查浏览器控制台是否有任何错误?