【问题标题】:JSP part of my html code not showing on browser我的 html 代码的 JSP 部分未在浏览器上显示
【发布时间】:2017-09-08 21:36:41
【问题描述】:

我的 Jsp:

下面是我的 JSP,我正在尝试获取我的客户列表并使用 foreach 标记 () 并在循环中 (foreach 标记) 我在每一行的下拉按钮中都有 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">&times;</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">&times;</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>
    

    【问题讨论】:

      标签: javascript html jsp spring-mvc


      【解决方案1】:

      我已经用以下更改测试了你的代码,它工作正常。

        <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>
      

      请检查浏览器控制台是否有错误?

      【讨论】:

      • 问题出在我的 JavaScript 函数解决之后问题就解决了
      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2020-06-28
      • 1970-01-01
      • 2015-09-15
      • 2016-04-27
      • 1970-01-01
      • 2012-03-29
      • 2016-04-20
      相关资源
      最近更新 更多