首页 > 代码库 > Xitrum学习笔记08 - JavaScript and JSON

Xitrum学习笔记08 - JavaScript and JSON

JavaScript

Xitrum包含jQuery,有一些 jsXXX辅助方法

1. 添加JavaScript代码片段到View中

在action中,调用jsAddToView添加JS代码(可以多次调用)

class MyAction extends AppAction {
  def execute() {
    ...
    jsAddToView("alert(‘Hello‘)")
    ...
    jsAddToView("alert(‘Hello again‘)")
    ...
    respondInlineView(<p>My view</p>)
  }
}

在 layout 中,调用jsForView:

import xitrum.Action
import xitrum.view.DocType
trait AppAction extends Action {
  override def layout = DocType.html5(
    <html>
    <head>
      {antiCsrfMeta}
      {xitrumCss}
      {jsDefaults}
    </head>
    <body>
      <div id="flash">{jsFlash}</div>
      {renderedView}
      {jsForView}
    </body>
  </html>
)

2. 没有View的情况下,直接响应返回JavaScript

由JavaScript发出响应,使用jsRespond

jsRespond("$(‘#error‘).html(%s)".format(jsEscape(<p class="error">Could not login.</p>)))

重定向

jsRedirectTo("http://cntt.tv/")
jsRedirectTo[LoginAction]()

JSON

Xitrum包含JSON4S(一个JSON抽象语法分析树)。Scala case对象和JSON字符串的转换示例:

import xitrum.util.SeriDeseri
case class Person(name: String, age: Int, phone: Option[String])
val person1 = Person("Jack", 20, None)
val json = SeriDeseri.toJson(person1)
val person2 = SeriDeseri.fromJson[Person](json)

响应返回JSON:

val scalaData = http://www.mamicode.com/List(1, 2, 3) // An example
respondJson(scalaData)

Knockout.js插件 

在 build.sbt文件中配置  libraryDependencies += "tv.cntt" %% "xitrum-ko" % "1.7",就可以在项目中使用Knockout JS了

参考 https://github.com/xitrum-framework/xitrum-ko

 

Xitrum学习笔记08 - JavaScript and JSON