如何在jsp中显示从数据库返回的所有行的html表？ [英] How to display the html table with all the rows returned from the database in jsp?

问题描述

 < table id =myTable border =0cellspacing =0style =border-spacing：0; width：100％; border-collapse：collapse;> 
 <％
 Object object = request.getAttribute（myContact）; 
 MyModel myModel =（MyModel）对象; 
 
 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>名称：< / label>< / td> 
< td class =table-border-bottom>< input id =nametype =textvalue ='<％= name％>'name =nameclass = requiredstyle =height：17px;/> 
< / td> 
< td class =table-border-bottom>< label for =contactTitle>标题：< / label>< / td> 
< td class =table-border-bottom> < input id =titletype =textvalue ='<％= title％>'name =titleclass =requiredstyle =height：17px;/> 
 
< / td> 
< td class =table-border-bottom>< label for =mail>电子邮件地址：< / label>< / td> 
< td class =table-border-bottom>< input id =mailtype =textvalue ='<％= mail％>'name =mailclass = required emailstyle =height：17px;/> 
 
< / td> 
< / tr> 
 
 
< tr align =center> 
< td valign =bottomcolspan =6style =height：45px;> 
< input type =buttonid =submitname =submitvalue =Savestyle =width：80px; height：24px; text-align：center; border-radius：10px 10px 10px 10px;/> 
< input type =buttonid =revertname =revertvalue =Revertstyle =width：80px; height：24px; text-align：center; border-radius：10px 10px 10px 10px;/>< / td> 
< / tr> 
 
< / table> 
  

我从数据库中得到一行并保持请求范围，然后我访问jsp中的相同内容并显示在上面的html表格中。它运作良好，没有任何问题。现在的问题是，我从数据库中获取行的列表，然后我需要在html中显示为多行。此外，我必须为行的每个组件分配唯一的ID，并且还需要像上面那样应用CSS styes。在这种情况下，我如何重复循环中的逻辑以正确显示行的CSS列表？

谢谢！

解决方案

不要从您的服务器代码发送一个对象发送要作为列表显示的对象的列表。

我还没有测试过，请您注意处理空检查。

 < table id =myTableborder =0cellspacing =0style =border-spacing：0; width：100％; border-collapse：collapse;> 
<％
列表< 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>名称：< / label>< / td> 
< td class =table-border-bottom>< input id =nametype =textvalue ='<％= name％>'name =nameclass = requiredstyle =height：17px;/> 
< / td> 
< td class =table-border-bottom>< label for =contactTitle>标题：< / label>< / td> 
< td class =table-border-bottom> < input id =titletype =textvalue ='<％= title％>'name =titleclass =requiredstyle =height：17px;/> 
 
< / td> 
< td class =table-border-bottom>< label for =mail>电子邮件地址：< / label>< / td> 
< td class =table-border-bottom>< input id =mailtype =textvalue ='<％= mail％>'name =mailclass = required emailstyle =height：17px;/> 
 
< / td> 
< / tr> 
 
<％}％> 
 
< tr align =center> 
< td valign =bottomcolspan =6style =height：45px;> 
< input type =buttonid =submitname =submitvalue =Savestyle =width：80px; height：24px; text-align：center; border-radius：10px 10px 10px 10px;/> 
< input type =buttonid =revertname =revertvalue =Revertstyle =width：80px; height：24px; text-align：center; border-radius：10px 10px 10px 10px;/>< / td> 
< / tr> 
 
< / table> 
  

另外，使用JSTL而不是使用scriptlet会对您有所帮助。

对于行的样式，应用类如

CSS

  .rowClass {
 / *应用风格到行* / 
} 
  

I have below html and java code to display one row in html table.

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

I get one row from the database and keep in request scope then i access the same in jsp and displayed in html table as above. It works well without any issues. Now the problem is i get list of rows from database and i need to display then in html as multiple rows. Also, i have to assign unique ids for each component of the row and also CSS styes need to be applied as above. In such a case how can i repeat above the logic in loop to display list of rows with css styles properly?

Thanks!

解决方案

Instead of sending one object from your server code send list of object which you want to display as list of rows.

I have not tested, you please take care of handling null check.

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

Also, it would be helpful to you by going with JSTL instead of doing with scriptlet.

For styling of rows, apply class like

CSS

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

这篇关于如何在jsp中显示从数据库返回的所有行的html表？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！