0

I have a lift code that render an HTML table with some cells with editable content.

For editing I'm using editinplace.js

<script src="/js/jquery.editinplace.js"></script> 

I set the editable attribute in lift rendering the table:

def renderTable(columns: List[(String,List[Model])]) = {
          {val entityCountMax = columns.maxBy(_._2.size)
           for(i <- 0 until entityCountMax._2.size) yield {
            <table style="font-size:80%; float: left; margin-left: 30px; width: auto;" class="table table-striped table-condensed table-hover">
                <tr>{ <th> { prettifyClassName(entityCountMax._2(i))} </th> % Attribute(None, "colspan", Text((columns.size+1).toString), Null)}</tr>
                {renderHeader(columns.map(_._1))}
            {for((key,value) <- entityCountMax._2(i).fields) yield {
            <tr>
            <th style="text-align: right;">{key}</th>
            {for(j <- 0 until columns.size) yield {
              <td>{try{
                            printField(columns(j)._2(i).fields.get(key))
                  }catch { case e:Exception => ""}
             }</td> % Attribute(None, "class", Text({ if(columns(j)._1 contains "DB") "editable" else "" }), Null)
            }}
            </tr>
        }}
        </table> 
         }} ++
          <script><![CDATA[ 
            $(document).ready(function(){
            $('.editable').editInPlace({ callback: function(unused, enteredText){ 
            $(this).css('color','red'); return enteredText;},
            default_text: ''
            })});]]>
          </script>
        } 

Don't look too much at rendering function above, it's working fine and I can edit the wanted cells with no problems. Edited cells are colored in red.

What I want to do now is to get the content of edited cells and return it to my scala application but I have no idea how to do it.

What I was thinking to do is to build a DIY lift CRUD for my model. The problem is that this way (I'm guessing) I have to make an html page to edit every cells one-by-one but I don't like this solution very much.

So here comes the real question:

Is it possible to directly map the html table with my data structure in scala? And If it is, how can I do it?

4

1 回答 1

2

如果您只是想直接将变量映射到服务器,并自动发送更改 - Lift 提供了一种连接机制,它将在更新发生时将更新发送回服务器并更新任何相关数据。您仍然需要处理该事件以保留任何更改。另外,我不确定它与您创建的机制的工作情况如何。

我知道您正在使用外部库,但开箱即用的产品可以为您Lift提供SHtml.swappable一种在可编辑状态和不可编辑状态之间切换的机制。当与 ajaxText 框结合使用时,将为您提供一种就地编辑数据的方式,即:

var name="myname"
SHtml.swappable(
  <span>{name}</span>, 
  SHtml.ajaxText(name, (v) => name = v)
)

如果您只是生成 aNodeSeq并希望将其返回给由 处理的浏览器Lift,您可以查看LiftSession.processSurroundAndInclude

如果您使用他们的 CSS 选择器和响应处理,我发现 Lift 的功能效果最好。但是,如果您使用 Javascript 创建表单,并且您的库负责管理数据,那么您最好使用 Rest 类型的服务将数据返回到您的应用程序中。RestHelper这很容易。我经常与AngularJS一起使用它来做一个与你正在尝试的类似类型的应用程序。

于 2013-06-04T16:49:29.600 回答