看了一个开源的标签库AjaxTag(http://ajaxtags.sourceforge.net/index.html)，提供几个比较简单的应用。我测试下了DropDownSelect应用：
1、首先当然是看安装文档（http://ajaxtags.sourceforge.net/install.html），应该没什么负责的，我要说的是第3步，也是比较重要的一步，创建服务端的控制程序。这部分也就是AjaxTag的原理，AjaxTag是通过服务器端的servelt生成XML文件，当然也可以是其他的服务器端技术只要是能生成格式良好的XML文件就可以了，文件格式如下图：
2、我们的例子就是通过选择制造商可以动态的产生该制造商的车型。下面是需要的一些类文件：
Car类:包含两个String类型属性make,model分别指制造商和车型.
CarService类如下：
public class CarService {
static final List cars = new ArrayList();
static {
cars.add(new Car("Ford", "Escape"));
cars.add(new Car("Ford", "Expedition"));
cars.add(new Car("Ford", "Explorer"));
cars.add(new Car("Ford", "Focus"));
cars.add(new Car("Ford", "Mustang"));
cars.add(new Car("Ford", "Thunderbird"));
cars.add(new Car("Honda", "Accord"));
cars.add(new Car("Honda", "Civic"));
cars.add(new Car("Honda", "Element"));
cars.add(new Car("Honda", "Ridgeline"));
cars.add(new Car("Mazda", "Mazda 3"));
cars.add(new Car("Mazda", "Mazda 6"));
cars.add(new Car("Mazda", "RX-8"));
}
public CarService() {
super();
}
/*该方法在servlet被调用*/
public List getModelsByMake(String make) {
List l = new ArrayList();
for (Iterator iter = cars.iterator(); iter.hasNext();) {
Car car = (Car) iter.next();
if (car.getMake().equalsIgnoreCase(make)) {
l.add(car);
}
}
return l;
}
public List getAllCars() {
return cars;
}
}
DropdownServlet类：
String make = request.getParameter("make");
CarService service = new CarService();
//得到该make的所有model
List list = service.getModelsByMake(make);
//这就是Helper类，能生成像上面的xml文件
return new AjaxXmlBuilder().addItems(list, "model", "make").toString();
4、不要忘记了在web.xml中加上映射DropdownServlet
<servlet>
<servlet-name>dropdown</servlet-name>
<servlet-class>qiya.deng.ajaxtag.DropdownServlet</servlet-class>
<load-on-startup>2</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>dropdown</servlet-name>
<url-pattern>/dropdown.view</url-pattern>
</servlet-mapping>
5.下面就是JSP部分(需要JSTL和EL)：
<c:set var="contextPath" scope="request">${pageContext.request.contextPath}</c:set>
<form id="carForm" name="carForm">
<fieldset>
<legend>Choose Your Car</legend>
<div>
<img id="makerEmblem"
src="<%=request.getContextPath()%>/img/placeholder.gif"
width="76" height="29" />
</div>
<label for="make">Make:</label>
<select id="make">
<option value="">Select make</option>
<option value="Ford">Ford</option>
<option value="Honda">Honda</option>
<option value="Mazda">Mazda</option>
<option value="dummy">Dummy cars</option>
</select>
<label for="model">Model:</label>
<select id="model" disabled="disabled">
<option value="">Select model</option>
</select>
</fieldset>
</form>
<script type="text/javascript">
function showMakerEmblem() {
var index = document.forms["carForm"].make.selectedIndex;
var automaker = document.forms["carForm"].make.options[index].text;
var imgTag = document.getElementById("makerEmblem");
if (index > 0) {
imgTag.src = "<%=request.getContextPath()%>/img/" + automaker.toLowerCase() + "_logo.gif";
}
}
function handleEmpty() {
document.getElementById("model").options.length = 0;
document.getElementById("model").options[0] = new Option("None", "");
document.getElementById("model").disabled = true;
}
</script>
<ajax:select
baseUrl="${contextPath}/dropdown.view"
source="make"
target="model"
parameters="make={make}"
postFunction="showMakerEmblem"
emptyFunction="handleEmpty" />
注意到form里面其实没什么不一样的，就是最后那段的<ajax:select/>,baseUrl就是服务器端处理的Handler,source是关联的源，model是被关联的；parameter是传个servlet的参数，可以有多个用逗号隔开；postFunction,emptyFunctuion就是上面的两个JavaScript.详细的可以看
http://ajaxtags.sourceforge.net/usage.html。
经过简单的修改，我们也可以把这个应用到Struts中。那就后续吧^_^...