Server Java 三：用Ajax得到地图比例尺(客户端代码)

上个讲座我们讲到，服务器端已经得到了当前地图的比例尺，我们需要在客户端做一个处理，把这个比例尺数据给用户看。我们在页面上放一个文本框，用来显示比例尺数据，如下面的代码所示：

<tr>
  <td>Scale</td>
  <td><input type="text" id="scale" size="36" /></td>
</tr>

我们如何将服务器传过来的数据更新这个文本框呢？来看看前面讲座中提到的往服务器端发送请求时候的那个回调函数：

var xmlHttp = EsriUtils.sendAjaxRequest(url, params, true, function() { updateInfoResponse(xmlHttp); });

我们把回调函数的代码也贴在这里：

function updateInfoResponse(xmlHttp) {
if (xmlHttp != null && xmlHttp.readyState == 4 && xmlHttp.status == 200) {

var xml = xmlHttp.responseXML;
  var scale=xml.getElementsByTagName("scale").item(0).firstChild.nodeValue;
  document.getElementById("scale").value = "1:" + scale

}
}

这个代码相比大家都能看明白了，先判断服务器端是不是已经处理结束，并且服务器的状态一切正常，然后得到服务器返回的xml，通过getElementsByTagName把里面包含着的比例尺数据提取出来，组合中我们熟悉的文本，然后把这个文本填充到ID为scale的文本框中。

我们来总结一下，我们发送了一个请求，这个请求包含了MapID参数，和一个标志参数ajaxdemo，MapID参数可以让服务器得到MapControl的实例和WebMap，进而得到比例尺。Ajaxdemo让服务器端的处理程序可以正确的辨识这个请求是我们这个PhaseListener需要处理的请求，处理结束后，返回XML到客户端。客户端的回调函数处理XML文档，提取出比例尺信息，写入到页面的文本框中。撩起Ajax神秘的面纱后，发现原来Ajax不过如此，老酒装新瓶，重新包装了一下。
讲到这里，大家心中想必还有两个疑点，第一个是说了半天，我们是怎么触发这个请求的呢？通过定时器触发么？不是。我们是通过地图的变化进行触发的，这样是最最合理的，每当地图更新了，客户端会自动发送一个请求，要求地图变化后的比例尺。非常合理，但是怎么进行设置呢？我们经常说，我们的控件是支持Ajax的，如何支持？我们支持通过监听器的方式，监听地图的变化，如下面的代码所示：

var map = EsriControls.maps["Map0"];
  map.addUpdateListener("request", updateInfoRequest);

这样，每次地图更新时，都会触发updateInfoRequest函数，该函数用来向服务器端发送请求。

另外一个疑问是Phaselistener怎么设置，看一下JavaDoc可以知道，我们可以在faces-config.xml文件中，用下面的语句进行设置：

<lifecycle>
  <phase-listener>demo.AjaxDemoPhaseListener</phase-listener>
</lifecycle>