【问题标题】:Pagination Issue in Meteor?Meteor 中的分页问题?
【发布时间】:2014-02-27 13:17:04
【问题描述】:

我做了一个示例示例,使用流星中的集合显示人员信息。在这里我需要在显示更多人员信息时进行分页。我也在引导程序的帮助下进行了分页,但没有工作。所以请参阅下面的代码和建议我做什么?

代码:

<template name="userlist">
   <link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" rel="stylesheet">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script>
    <script src="/js/bootstrap-paginator.min.js"></script>

   <div class="clist">
       <div class="clistname" style="float:left;width:400px;"><h2>Client List</h2></div>
       <div class="search" style="float:left;width:400px;padding-top:20px;"><div style="float:left;">Serch:</div><div style="float:left;"><input type="text" id="search" /></div></div>
       <div class="addnewuser" style="float:right;padding-top:20px;"><input type="button" id="addnewuserD"  value="Add" /></div>
   </div>

    <div class="chmenu" style="float:left;">
      <table class="cinfotable">
                <thead>
                    <tr>
                        <th><div class="cmenu"><u>UserId</u></div></th>

                        <th><div class="cmenu"><u>Patient</u></div></th>

                        <th><div class="cmenu"><u>Address</u></div></th>

                        <th><div class="cmenu"><u>SSN</u></div></th>

                        <th><div class="cmenu"><u>Action</u></div></th>
                    </tr>
                </thead>

                <tbody id="udatacontent">

                    {{#each patientInfo}}
                       <tr class="cdata">

                           <td><div class="cname">{{UserId}}</div></td>
                           <td><div class="cdata">
                               <div class="user {{selected}}">{{Firstname}} {{Lastname}}</div>

                                                <div class="userinfo">{{#if selected}}
                                                      City: {{City}}<br>
                                                      State: {{State}}<br>
                                                      Country: {{Country}}<br>
                                                      ZipCode: {{ZipCode}}<br>
                                                      PhoneNo: {{PhoneNo}}<br>
                                                {{/if}}</div>
                               </div></td>
                           <td><div class="cdata">{{City}}<br>
                                                  <br></div></td>
                           <td><div class="cdata">{{SSN}}</div></td>
                           <td><div class="paction">Access Ptient</div></td>

                       </tr>
                    {{/each}}

                </tbody>

            </table>
    </div>


    <script type='text/javascript'>
        var options = {
            currentPage: 3,
            totalPages: 10
        }

        $('#udatacontent').bootstrapPaginator(options);
    </script>
</template>

【问题讨论】:

    标签: twitter-bootstrap pagination meteor


    【解决方案1】:

    meteor 中的分页使用reactive-table 之类的表格/数据网格包最容易工作。查看项目的 GitHub,那里有几个示例。

    一个更强大的分页包,但不是表格增强包,是meteor-pages

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2014-02-23
      • 1970-01-01
      • 1970-01-01
      • 2017-03-30
      • 1970-01-01
      • 2020-03-07
      • 2016-07-09
      相关资源
      最近更新 更多