用 JSON 和 Ajax 实现异步 Grails（2）
|
- UID
- 1066743
|
用 JSON 和 Ajax 实现异步 Grails（2）
测试控制器在 test/integration 中创建 AirportMappingControllerTests.groovy。添加清单 7 中的 2 个测试：
清单 7. 测试一个 Grails 控制器1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
| class AirportMappingControllerTests extends GroovyTestCase{
void testWithBadIata(){
def controller = new AirportMappingController()
controller.metaClass.getParams = {->
return ["id":"foo"]
}
controller.iata()
def response = controller.response.contentAsString
assertTrue response.contains("\"name\":\"Not found\"")
println "Response for airport/iata/foo: ${response}"
}
void testWithGoodIata(){
def controller = new AirportMappingController()
controller.metaClass.getParams = {->
return ["id":"den"]
}
controller.iata()
def response = controller.response.contentAsString
assertTrue response.contains("Denver")
println "Response for airport/iata/den: ${response}"
}
}
|
输入 $grails test-app 运行测试。在 JUnit HTML 报告中应该可以看到成功信息，如图 2 所示。（要回顾 Grails 应用程序的测试，请参阅 “”）。
图 2. 在 JUnit 中测试通过 看看 中的 testWithBadIata() 中发生了什么。第一行（显然）是创建 AirportMappingController 的一个实例。这是为了后面可以调用 controller.iata() 并针对产生的 JSON 写一个断言。要使调用失败（在此就是如此）或成功（在 testWithGoodIata() 中），需要用一个 id 项为 params hashmap 提供种子。通常，查询字符串被解析并存储到 params 中。但是，在这里，没有 HTTP 请求被解析。相反，我使用 Groovy 元编程直接覆盖 getParams 方法，使期望的值出现在返回的 HashMap 中。（要了解关于 Groovy 元编程的更多信息，请参阅 ）。
现在，JSON 产生器已经可以工作，并且经过了测试，接下来看看如何在一个 Web 页面中使用 JSON。
设置初始的 Google Map我希望可通过 http://localhost:9090/trip/trip/plan 访问旅行计划页面。这意味着将一个 plan 闭包添加到 grails-app/controllers/TripController.groovy 中，如清单 8 所示：
清单 8. 设置控制器1
2
3
4
| class TripController {
def scaffold = Trip
def plan = {}
}
|
由于 plan() 不是以 render() 或 redirect() 结束，根据约定优于配置原则，显示的将是 grails-app/views/trip/plan.gsp。用清单 9 中的 HTML 代码创建文件。（要回顾这个 Google Map 的基础原理，请参阅 “”）。
清单 9. 设置初始 Google Map1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
| <html>
<head>
<title>Plan</title>
<script src="//maps.google.com/maps?file=api&v=2&key=YourKeyHere"
type="text/javascript"></script>
<script type="text/javascript">
var map
var usCenterPoint = new GLatLng(39.833333, -98.583333)
var usZoom = 4
function load() {
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById("map"))
map.setCenter(usCenterPoint, usZoom)
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
}
}
</script>
</head>
<body onload="load()" onunload="GUnload()">
<div class="body">
<div id="search" style="width:25%; float:left">
<h1>Where to?</h1>
</div>
<div id="map" style="width:75%; height:100%; float:right"></div>
</div>
</body>
</html>
|
如果一切正常，在浏览器中访问 http://localhost:9090/trip/trip/plan 将看到如图 3 所示的界面：
图 3. 一个普通的 Google Map 有了基本的地图之后，现在应该添加两个字段，分别用于出发地机场和目的地机场。 |
|
|
|
|
|
