9、ArcGIS Server JAVA讲座--实现后台JSF Bean和前台Javascript的联动
很多开发人员都梦寐以求的方案，我在论坛里面也看到很多人提出这样的问题，今天集中对这些问题做一个解答，也是作为Server JAVA讲座的一个部分。另外，要说明的是，今天的讲座不包括AJAX技术。AJAX技术会另开一个讲座。
先以一个问题开始，如果我们的webapplication中对geodatabase进行了编辑，大家都知道，这个时候需要一个提交编辑并保存，或者提交编辑并取消的过程，大家都用过ArcMAP，如果没有用过ArcMAP，word总是用过的，编辑过的东西，一关闭，肯定会给你警告。这个问题在桌面程序中简直就不是问题，在web上，我们倒是可以来说一说了，因为server和你的browser可能相距几万公里，你这边要关闭browser，在美国的服务器怎么能够知道你要关闭呢？服务器上运行的是JSF的Bean，而客户端运行的是Javascript，怎么让Javascript去感知后台的情况，给用户一个提示，这样就会很好地显示我们程序的友好性，对建设以人为本的和谐社会也大有好处。那么我们来看看如何做这个事情。
Browser关闭时会产生onUnload事件，有了这个事件，使我们有机会做一些事情，比如下面的语句，显示一个信息
在body中添加了这一句后，是不是已经看到了那个温柔的问句呢？如果是，那么你的Browser是支持这个onUnload事件的。下面来看这段代码：
function checkTime(){
var isModified= 这个代码很有意思，其它的好说， private boolean edited=false; public boolean isEdited() { return edited; } public void setEdited(boolean edited) { this.edited = edited; 24 } 你在开始编辑的时候，设置edited为true就可以了。JSTL能够用过 是不是看了这个文章，马上摩拳擦掌，准备去修改您的程序呢？ 10、ArcGIS Server JAVA讲座 --AJAX基础 咱也来跟跟潮流，讲一讲AJAX和JSF如何结合。我相信，这也是将来SERVER JAVA的开发人员都会问的一个问题。我们来看看如何能够让AJAX能够在服务器上和客户端跑起来。 要应用AJAX的条件是： 1、 一个支持javascript的浏览器，当然，现在主流的浏览器都是支持Javascript的。 2、 浏览器必须支持XMLHTTP或者XMLHttpRequest对象。 3、 能够以XML发送响应的服务器端。服务器端可以有很多的技术来实现，不管你是用ASP，JAVA，都可以实现。当然，本文要讨论的局限于JSF技术。 对于熟悉大多数服务器端程序编写的工程师，比如我，Javascript完全是另外一个世界。但是了解Javascript，将使你的程序更加强大，开发起来更加容易。一个很有意思的功能是如果用户在编辑地图的时候，编辑到中途，忘记保存了，这提醒我们可以做一个比较有意思的功能，自动保存。在google mail中，你是不是已经感觉到过这个自动保存的功能了呢？反正我当时看到的时候吓了一跳。以一个服务器端程序员的思路去思考，会觉得不可思议。事实上这个功能就可以用Ajax技术来实现，用一个定时器，每隔5分钟自动发送一个保存的请求就可以实现这样的功能。 再看一个自动查找的例子，比如一个输入一个用户后自动出来和该用户有关的信息，可以通过这样的方法来实现： Search(‘query’)方法可以发送一个Ajax请求到客户端，进行查询后，将结果以XML请求返回，这样就不需要刷新整个页面而进行部分更新。就这么一个小小的技术，让用户在继续Web 浏览的时候感觉更好，也成为了各个网站争相模仿的对象，一些开发人员也发现了宝贝一样言必称Ajax，甚至成为项目选型的关键，这大概也是最初的开发者想象不到的。 来看看Javascript如何来发送一个XMLHttpRequest请求的。来看一下下面的代码： if (window.XMLHttpRequest) { req = new XMLHttpRequest(); } else if (window.ActiveXObject) { req = new ActiveXObject(\} 25 这是再简单不过的实例化XMLHttpRequest的一段代码，实例化一个之后，你就可以像操作一个普通的对象一样操作它，它有很多的方法，比如下面的方法是建立和服务器端的链接： req.open(\ 第一个参数是HTTP请求的方式：”Get”或者”Post”，第二个参数是服务器的URL，第三个参数是是否进行非同步的请求。大家如果已经仔细研究了我们ESRI的工具标签，你会发现这些标签里面有一个clientPostBack属性可以设置是否进行异步请求。我们可以知道，Web ADF在后面肯定用了open方法的第三个参数来进行。要小心的是，如果你要设置clientPostBack为true，你的javascript代码可能需要重新构建一下。不然这些代码可能不会被执行。因为异步请求更新的是部分页面。 异步请求的意思是在请求时浏览器可以做其它的事情，那么如何得知服务器端的处理已经结束，可以更新页面上的数据了呢？我们来看看XMLHttpRequest对象的方法 req.onreadystatechange = processXMLResponse; 当服务器端的处理结束时，就可以调用processXMLResponse方法，我们就可以通过对这个方法进行编程来处理请求，当然可以是任何的名字的方法，只要将方法注册到onreadystatechange方法即可。 XMLHttpRequest初始化完成后就可以发送到请求到服务器端了，用一个很简单的方法即可： req.send(null); 当然，一般get用的实在太少，我们最关心的是Post，看看Post应该怎么做： req.open(\ req.setRequestHeader(\ req.send(\ Post可以发送一些数据到服务器端，这正是我们所需要的。我们来继续看看一个请求当前比例尺的代码： function updateInfoResponse(xmlHttp) { if (xmlHttp != null && xmlHttp.readyState == 4 && xmlHttp.status == 200) { var xml = xmlHttp.responseXML; document.getElementById(\ xml.getElementsByTagName(\alue; } } 看一下判断了(xmlHttp != null && xmlHttp.readyState == 4 && xmlHttp.status == 200，判断4是表示处理已经结束，判断200表示HTTP请求正常，相信大家都见过404的HTTP请求，令人讨厌的“page not found”。 判断结束后，就用xml.getElementsByTagName(\语句把比例尺 26 取过来。 相信大家都大致知道AJAX是怎么回事了，下一次我会写一个简单的例子。 IBM网站上有一篇很好的介绍AJAX的文章，大家可以去看看： http://www-128.ibm.com/developerworks/cn/xml/wa-ajaxintro1.html 11、ArcGIS Server JAVA开发讲座--- ADF中的Ajax函数 ESRI为了使Server ADF能够支持Ajax，做了大量的工作，Sever ADF中有很多可以利用的代码，我们来看看： 代码1：创建XMLHttpRequest，可以看一下下面的代码： this.createXmlHttpObject = function() { if (this.isIE) { try { return new ActiveXObject(\ } catch (exception) { return new ActiveXObject(\ } } return new XMLHttpRequest(); } 这个代码写得很妙吧，前面两个处理IE浏览器，最后一个支持Firefox，XMLHttpRequest是Firefox的。 发送请求，用如下命令： EsriUtils.sendAjaxRequest(url, params, true, function() { updateInfoResponse(xmlHttp); }); 解释一下，怎么得到这个url，ESRI也提供了办法： var url = EsriUtils.getServerUrl(formId); getServerUrl的代码如下： this.getServerUrl = function(fId) { if (document.forms[fId].action.indexOf(\ 27 return document.forms[fId].action; else if (this.getJSessionId()) return document.forms[fId].action + \ else return document.forms[fId].action; } 嗯，url已经解释了，我们看看第二个参数params，这个参数包含了我们需要传递到服务器端的参数。看一下源代码就可以知道，xh.send(params);将这些参数发送到服务器端。 doGet参数就比较简单了，用来说明这个请求是get还是post。看看源代码，发送的方法是不一样的，如果是get方法，那些参数用?进行连接，传送到服务器端。它返回的仍然是XMLHttpRequest对象。 Callback函数是我们自己写的函数，用来在服务器数据处理完成后，处理服务器端传送过来的数据。大家看着是不是一目了然了呢？ sendAjaxRequest的源代码 this.sendAjaxRequest = function(url, params, doGet, callback) { try { var xh = this.createXmlHttpObject(); xh.onreadystatechange = callback; if (doGet) { xh.open(\ xh.send(null); } else { xh.open(\ xh.send(params); } return xh; } catch (exception) { return null; 28