2017-02-27 124 views
0

我有一個等待列表類型的應用程序,我正在創建。我現在擁有它,我的桌子將填充集合。我希望能夠按下按鈕,並將表格中的那一行移動到表格的底部。這是表格填充的位置。如何移動流星中的物品?

<tbody> 
          {{#each student}} 
           <tr class="accordion-toggle mainRow"> <!--mainRow if want whole row to change green--> 
            <td>{{> expandButton}}</td> 
            <td>{{Name}}</td> 
            <td>{{PhoneNumber}}</td> 
            <td>{{VipID}}</td> 
            <td class="selectionChange">{{> buttonSelections}}</td> 
           </tr> 
           <tr> 
            <td colspan="12" class="hiddenRow"> 
             <div class="accordian-body collapse" id="{{this._id}}"> 
              <table class="table table-striped"> 
               <thead id="innter-table"> 
                <tr class="info"> 
                 <th id="inner-heading">Reason for Visit</th> 
                 <th id="inner-heading">Current Major</th> 
                 <th id="inner-heading">Intended Major</th> 
                 <th id="inner-heading">Comments</th> 
                </tr> 
               </thead> 
               <tbody> 
                <tr> 
                 <td>{{ReasonForVisit}}</td> 
                 <td>{{CurrentMajor}}</td> 
                 <td>{{IntendedMajor}}</td> 
                 <td>{{Comments}}</td> 
                </tr> 
               </tbody> 
              </table> 
             </div> 
            </td> 
           </tr> 
           {{> autoformModals}} 
          {{/each}} 
         </tbody> 

這裏是按鈕的模板:

<template name="buttonSelections"> 
...//other code for different buttons 

<button class="btn btn-default btn-sm"> 
    <span class="glyphicon glyphicon-arrow-down"></span> 
</button> 

... //other code for different buttons 
</template> 

我知道我需要一些類型的事件的按鈕。但我不知道如何去獲取集合中的項目以便在集合中移動,以便當它再次填充表格時,它將移動到底部。

我該如何獲得集合重新排序,以便選定的項目將移動到集合的末尾?

回答

1

您不會「移動」收藏中的項目,您要做的是在客戶端上對收藏進行排序,以顯示您的需求。我沒有看到相關的幫手,但它會全部是這個樣子:

<template name="Students"> 
    {{#each student in students}} 
     {{student.name}} 
    {{/each}} 
</template> 

在JS,這是相當標準的東西:訂閱在onCreated()的集合,然後輔助排序集合你想要什麼。在這裏,我正在組建一個字段,「waitListedTime」,通過它收集排序。您的按鈕按下可以爲選定的學生添加時間戳,助手會反應性地運行,您的學生列表將在屏幕上更新。

Template.Students.onCreated(function() { 
    this.subscribe('students'); 
}); 

Template.Students.helpers({ 
    students() { 
     return Students.find({}, {sort: {waitListedTime: 1}}); 
    } 
});