如何在jsp中顯示從數據庫返回的所有行的html表？

Question

我有以下的html和java代碼來顯示html表中的一行。

<table id="myTable" border="0" cellspacing="0" style="border-spacing:0; width:100%;border-collapse: collapse;"> 
      <% 
       Object object = request.getAttribute("myContact"); 
       MyModel myModel = (MyModel)object; 

       String mail = myModel.getmail()!=null ? myModel.getmail().toString().trim() : ""; 
       String title = myModel.gettitle()!=null ? myModel.gettitle().toString().trim() : ""; 
       String name = myModel.getname()!=null ? myModel.getname().toString().trim() : "";    
      %> 

      <tr> 
      <td class="table-border-bottom"><label for="name">Name:</label></td> 
      <td class="table-border-bottom"><input id="name" type="text" value='<%=name%>' name="name" class="required" style="height: 17px;"/> 
      </td> 
      <td class="table-border-bottom"><label for="contactTitle">Title:</label></td> 
      <td class="table-border-bottom"> <input id="title" type="text" value='<%=title%>' name="title" class="required" style="height: 17px;"/> 

      </td> 
      <td class="table-border-bottom"><label for="mail">Email:</label></td> 
      <td class="table-border-bottom"><input id="mail" type="text" value='<%=mail%>' name="mail" class="required email" style="height: 17px; "/> 

      </td> 
      </tr> 


      <tr align="center"> 
      <td valign="bottom" colspan="6" style="height: 45px; "> 
      <input type="button" id="submit" name="submit" value="Save" style="width: 80px ; height:24px; text-align: center;border-radius: 10px 10px 10px 10px;"/> 
      <input type="button" id="revert" name="revert" value="Revert" style="width: 80px ; height:24px;text-align: center;border-radius: 10px 10px 10px 10px;"/></td> 
      </tr> 

     </table> 

我從數據庫中獲取一行，並保持在要求的範圍的話，我訪問相同的JSP和如上HTML表顯示。它運作良好，沒有任何問題。現在的問題是，我從數據庫中獲取行的列表，然後我需要在html中顯示爲多行。此外，我必須爲行的每個組件分配唯一的ID，並且還需要像上面那樣應用CSS styes。在這種情況下，我如何重複上面的循環中的邏輯來顯示正確的CSS樣式的行列表？

謝謝！

Answer 1

而是要從中顯示爲行列表對象的服務器代碼發送列表發送一個對象。

我還沒有測試過，請您注意處理空檢查。

<table id="myTable" border="0" cellspacing="0" style="border-spacing:0; width:100%;border-collapse: collapse;"> 
      <% 
       List<Object> object = (List<Object>)request.getAttribute("myContact"); 
     for(int i=0;i<object.size();i++){ 
       MyModel myModel = (MyModel)object.get(i); 
       String mail = myModel.getmail()!=null ? myModel.getmail().toString().trim() : ""; 
       String title = myModel.gettitle()!=null ? myModel.gettitle().toString().trim() : ""; 
       String name = myModel.getname()!=null ? myModel.getname().toString().trim() : "";    
      %> 


      <tr> 
      <td class="table-border-bottom"><label for="name">Name:</label></td> 
      <td class="table-border-bottom"><input id="name" type="text" value='<%=name%>' name="name" class="required" style="height: 17px;"/> 
      </td> 
      <td class="table-border-bottom"><label for="contactTitle">Title:</label></td> 
      <td class="table-border-bottom"> <input id="title" type="text" value='<%=title%>' name="title" class="required" style="height: 17px;"/> 

      </td> 
      <td class="table-border-bottom"><label for="mail">Email:</label></td> 
      <td class="table-border-bottom"><input id="mail" type="text" value='<%=mail%>' name="mail" class="required email" style="height: 17px; "/> 

      </td> 
      </tr> 

    <% } %> 

      <tr align="center"> 
      <td valign="bottom" colspan="6" style="height: 45px; "> 
      <input type="button" id="submit" name="submit" value="Save" style="width: 80px ; height:24px; text-align: center;border-radius: 10px 10px 10px 10px;"/> 
      <input type="button" id="revert" name="revert" value="Revert" style="width: 80px ; height:24px;text-align: center;border-radius: 10px 10px 10px 10px;"/></td> 
      </tr> 

     </table> 

而且，它會用JSTL去，而不是與小腳本做對您有所幫助。

對於行的造型，應用類像

CSS

.rowClass{ 
    /* APPLY STYLE TO ROWS */ 
} 

Answer 2

如果您MyModel類有豆風格干將，如：

public String getMail() { 
    return this.mail; 
} 

您應該使用EL像${myContact.mail}檢索mail屬性的值。

使用JSTL的<c:out value="${myContact.mail}">標籤以避免cross-site scripting甚至更​​好。

---

如果你想顯示List<MyModel>，將其設置在其中將請求轉發到你的JSP在Servlet的request範圍。

request.setAttribute("myModelsList",myModelsListObject); 

然後使用，JSTL的<forEach>循環遍歷List的每個元素，並顯示它。

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> 
... 
<table> 
    <c:forEach items="${myModelsList}" var="myModel" varStatus="count"> 
    <tr id="${count.index}"> 
     <td>${myModel.mail}</td> 
     <td>${myModel.title}</td> 
     <td>${myModel.name}</td> 
    </tr> 
    </c:forEach> 
</table> 

---

閱讀也：

1. How to avoid Java Code in JSP-Files?。
2. Use JSTL forEach loop's varStatus as an ID
3. How to alternate HTML table row colors using JSP?

Answer 3

相反，一個單一的聯繫對象的你現在就設定一個List<Contact>不是作爲一個請求屬性。

List<Contact> myContacts = (List<Contact>) request.getAttribute("myContacts"); 

然後，只需使用一個Iterator與while循環。

<table id="myTable" border="0" cellspacing="0" style="border-spacing:0; width:100%;border-collapse: collapse;"> 
<% 
    List<Contact> myContacts = (List<Contact>) request.getAttribute("myContacts"); 

    Iterator<Contact> contacts = myContacts.iterator(); 
    while (contacts.hasNext()) { 
     Contact myModel = contacts.next(); 

     String mail = myModel.getmail()!=null ? myModel.getmail().toString().trim() : ""; 
     String title = myModel.gettitle()!=null ? myModel.gettitle().toString().trim() : ""; 
     String name = myModel.getname()!=null ? myModel.getname().toString().trim() : "";    
%> 

<tr> 
<td class="table-border-bottom"><label for="name">Name:</label></td> 
<td class="table-border-bottom"><input id="name" type="text" value='<%=name%>' name="name" class="required" style="height: 17px;"/> 
</td> 
<td class="table-border-bottom"><label for="contactTitle">Title:</label></td> 
<td class="table-border-bottom"> <input id="title" type="text" value='<%=title%>' name="title" class="required" style="height: 17px;"/> 

</td> 
<td class="table-border-bottom"><label for="mail">Email:</label></td> 
<td class="table-border-bottom"><input id="mail" type="text" value='<%=mail%>' name="mail" class="required email" style="height: 17px; "/> 

</td> 
</tr> 

<% } // close loop 
%> 

<tr align="center"> 
<td valign="bottom" colspan="6" style="height: 45px; "> 
<input type="button" id="submit" name="submit" value="Save" style="width: 80px ; height:24px; text-align: center;border-radius: 10px 10px 10px 10px;"/> 
<input type="button" id="revert" name="revert" value="Revert" style="width: 80px ; height:24px;text-align: center;border-radius: 10px 10px 10px 10px;"/></td> 
</tr> 

</table>