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

核心提示： 现在，这个服务已经可以工作，精通 Grails: 用 JSON 和 Ajax 实现异步 Grails(9)，您可以从 Web 页面调用它， 添加 ShowHotels 链接只有当用户提供目的地机场时，因此需要依赖一个纯 JavaScript 解决方案， 您可能注意到对 document.getE

现在，这个服务已经可以工作，您可以从 Web 页面调用它。

添加 ShowHotels 链接

只有当用户提供目的地机场时，才应该显示 Show Nearby Hotels 超级链接。同样，只有确认用户真正想看到一个宾馆列表时，才应该发出远程请求。因此，首先将 showHotelsLink() 函数添加到 plan.gsp 中的脚本块中。另外，将一个对 showHotelsLink() 的调用添加到 addAirport() 的最后一行，如清单 16 所示：

清单 16. 实现 showHotelsLink()

function　addAirport(response,　position)　{　
　...　
　drawLine()　
　showHotelsLink()　
}　
function　showHotelsLink(){　
　if(airportMarkers[1]　!=　null){　
　　var　hotels_link　=　document.getElementById("hotels_link")　
　　hotels_link.innerHTML　=　"<a　href='#'　>Show　Nearby　Hotels...</a>"　
　}　
}　

Grails 提供了一个 <g:remoteLink> 标记，它可以创建异步超级链接（类似于 <g:formRemote> 提供异步的表单提交），但是因为生命周期的问题，它们在这里不能用。g: 标记是在服务器上呈现的。由于这个链接要动态地添加到客户端上，因此需要依赖一个纯 JavaScript 解决方案。

您可能注意到对 document.getElementById("hotels_link") 的调用。将一个新的 <div> 添加到 search <div> 的底端，如清单 17 所示：

清单 17. 添加 hotels_link <div>

<div　id="search"　style="width:25%;　float:left">　
<h1>Where　to?</h1>　
<g:formRemote　name="from_form"　...　>　
<g:formRemote　name="to_form"　...>　
<div　id="hotels_link"></div>　
</div>