Question

我正在使用jQuery Datatable来显示数据库中的表并使用s:iterator

进行迭代

 <html>
 <head>   
    <link href="css/forum.css" rel="stylesheet" type="text/css" /> 
            <link href="css/media/dataTables/demo_page.css" rel="stylesheet" type="text/css" />
            <link href="css/media/dataTables/demo_table.css" rel="stylesheet" type="text/css" />
            <link href="css/media/dataTables/demo_table_jui.css" rel="stylesheet" type="text/css" />
            <link href="css/media/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" media="all" />
            <link href="css/media/themes/smoothness/jquery-ui-1.7.2.custom.css" rel="stylesheet" type="text/css" media="all" />
            <script src="js/jquery.js" type="text/javascript"></script>
            <script src="js/jquery.dataTables.min.js" type="text/javascript"></script>

<script type="text/javascript">
        $(document).ready(function () {
            $("#display").dataTable({
                "bJQueryUI": true,
                "iDisplayLength": 5,
                "sPaginationType": "full_numbers",
            });
        });
        </script>

 </head>
<body>
<table id="display">
         <thead>
             <tr><th>Title</th></tr>
             <tr><th>Desc</th></tr>
         </thead>
         <tbody>
           <s:iterator  value="travelBean"  status="i">
           <tr>
            <td>
               <s:url action="Display" var="DisplayLink">
                  <s:param name="title"><s:property value="title"/></s:param>
                </s:url>
              <a href="${DisplayLink}">
             <s:property value="Desc"/></a>
         </td>
        </tr>
       </s:iterator>
       </tbody>
</table>
</body>
<html>

在输出div中，如果我将tr td置于{{s:iterator tr中，则会在查询表格上方显示条目，下方显示条目，上一页和下一页按钮不会显示1}}如果我删除了td div，则{{1}}正在出现，但表中没有可用的表条目。我不确定会出现什么问题？

Answer 1

可以从HTML数据源加载表。您应该尝试基本配置，然后添加功能。因为您的jQuery版本可能不匹配。

<html>
<head>   
    <link href="//cdn.datatables.net/1.10.4/css/jquery.dataTables.css" rel="stylesheet" type="text/css" /> 
    <script src="//code.jquery.com/jquery-1.11.1.min.js" type="text/javascript"></script>
    <script src="//cdn.datatables.net/1.10.4/js/jquery.dataTables.min.js" type="text/javascript"></script>
    <script type="text/javascript">
       $(document).ready(function () {
          $("#display").dataTable();
       });
    </script>
</head>
<body>
   <table id="display">
         <thead>
             <tr>
               <th>Title</th>
               <th>Desc</th>
             </tr>
         </thead>
         <tfoot>
             <tr>
               <th>Title</th>
               <th>Desc</th>
             </tr>
         </tfoot>
         <tbody>
           <s:iterator  value="travelBean">
           <tr>
            <td><s:property value="title"/></td>
            <td>
               <s:url action="Display" var="DisplayLink">
                  <s:param name="title"><s:property value="title"/></s:param>
               </s:url>
               <a href="${DisplayLink}">
                  <s:property value="travelDesc"/>
               </a>
            </td>
           </tr>
           </s:iterator>
         </tbody>
   </table>
</body>
<html>

你迭代的travelBean应该有一个getter，TravelTable应该有属性的getter。

带有Struts 2的jQuery数据表

1 个答案: