提升框架 : Not able to render table rows using comet properly

Question

在我的网页中，我有一个文本框，用户可以在其中输入一个将异步发送到服务器的项目名称，该消息将被发送到 CometActor，然后它会进一步向它添加其他信息，并在渲染方法中尝试将新行异步附加到页面上的现有表。每当我添加一个项目时，新行总是被放置在表的顶部而不是作为表行，之后如果我按刷新它就会被正确地放置在表中。这里是

<table cellpadding="0" cellspacing="0" border="1" class="display" id="example">
    <thead>
      <tr>
        <th>#</th>
        <th>Name</th>
        <th>Time</th>
      </tr>
    </thead>
    <tbody class="lift:comet?type=ProvisionComet">
      <tr id="tr_content">
        <td></td>
        <td></td>
        <td></td>
      </tr>
    </tbody>
  </table>

LiftActor 对象

object ItemsServer extends LiftActor with ListenerManager {
  private var items = Vector[Item]()
  private lazy val date: Box[Date] = DependencyFactory.inject[Date] // inject the date

  def createUpdate = items

  override def lowPriority = {
    case s: String => items :+= new Item(items.length + 1, s, date.map(_.toString));         updateListeners()
    case _ => None
 }
}

cometd Actor

class ItemComet extends CometActor with CometListener {
  private var items = Vector[Item]()

  def registerWith = ItemsServer

  override def lowPriority = {
    case v: Vector[Item] => items = v; reRender()
  }

  def render = "#tr_content *" #> {
    items.map(i => {
      <td>{i.sNum}</td>
      <td>{i.itemName}</td>
      <td>{i.updatedTime.toString}</td>
  })
}

刷新前的结果是

刷新后的结果

如何在不刷新的情况下得到正确的结果？

render 方法是我添加行的地方

Answer 1

尝试将 class 属性从 tbody 移动到 table:

<table class="lift:comet?type=ProvisionComet" cellpadding="0" cellspacing="0" border="1" class="display" id="example">
<thead>
  <tr>
    <th>#</th>
    <th>Name</th>
    <th>Time</th>
  </tr>
</thead>
<tbody >
  <tr id="tr_content">
    <td></td>
    <td></td>
    <td></td>
  </tr>
</tbody>