精通 Grails: 用 JSON 和 Ajax 实现异步 Grails

核心提示： 在浏览器中单击 Refresh 按钮，看看新的变化，精通 Grails: 用 JSON 和 Ajax 实现异步 Grails(2)，如图 4 所示： 图 4. 添加表单字段图片看不清楚？请点击这里查看原图（大图），如果使用常规的 <g:form>，并将它添加到地图中， 要使 <

在浏览器中单击 Refresh 按钮，看看新的变化，如图 4 所示：

图 4. 添加表单字段

　　图片看不清楚？请点击这里查看原图（大图）。

如果使用常规的 <g:form>，那么，当用户提交表单时，将刷新整个页面。如果选择 <g:formRemote>，则由一个 Ajax.Request 在幕后异步地执行表单提交。输入文本字段被命名为 id，确保在控制器中填充 params.id。<g:formRemote> 上的 url 属性清楚地表明，当用户单击提交按钮时，将调用 AirportMappingController.iata()。

这里不能使用 “使用 Ajax 实现多对多关系” 中的 <g:formRemote>，因为不能将一个 HTML 表单嵌入到另一个 HTML 表单中。但是，这里可以创建两个不同的表单，而且不必自己编写 Prototype 代码。异步 JSON 请求的结果将被传递给 addAirport() JavaScript 函数。

接下来的任务是创建 addAirport()。

添加处理 JSON 的 JavaScript

您将创建的 addAirport() 函数负责两项简单的任务：将 JSON 对象装载到内存中，然后为各种目的使用字段。在这里，您使用纬度和经度值创建一个 GMarker，并将它添加到地图中。

要使 <g:formRemote> 工作，必须在 head 部分包含 Prototype 库，如清单 11 所示：

清单 11. 在 GSP 中包含 Prototype

<g:javascript　library="prototype"　/>