Restlet 2.0 边学边写（八）使用jQuery和ajax实现对Restlet资源的CRUD操作

上一次实践实现了各方法返回xml和json格式的数据，并在页面、程序进行读取和展示。本次实践将使jQuery脚本库，通过javascript+ajax来访问Restlet资源的各个方法，实现互联网中的CRUD操作。

[b]1.Customer[/b]

为了方便页面调用Restlet，需要在Customer类中加入id属性作为唯一标识，。

修改com.sunny.restlet.order.Customer类，代码如下：

类中添加了id属性和getter/setter方法，修改了toString()方法。

[b]2.OrderDaoImpl[/b]

因为Customer类中加入了id属性，所以要在add和update Customer前setId(custId)。

修改com.sunny.restlet.order.OrderDaoImpl类中的方法，代码如下：

代码中对addCustomer和updateCustomerById方法进行了修改。

[b]3.Resource[/b]

我们需要修改下资源的各个方法，使得方法返回的数据符合json格式。

修改com.sunny.restlet.order.CustomersResource类中的方法，代码如下：

代码中修改了get方法，使返回数据为new JsonRepresentation(new JSONObject(customers, false))，因为new JsonRepresentation(customers)不能很好的解析map中的对象。

post方法也进行了修改，当customer为空时返回new JsonRepresentation("{}")，否则json解析器会报错。

修改com.sunny.restlet.order.CustomerResource类中的方法，代码如下：

代码中修改了get和put方法，当customer为空时返回new JsonRepresentation("{}")，否则json解析器会报错。

delete方法也进行了修改，返回符合json格式的提示信息new JsonRepresentation("{\"message\":\"success\"}")。

[b]4.jQuery[/b]

本次实践要在页面上使用javascript+ajax访问Restlet资源，最方便的当然是用jQuery库了，这里我使用的是1.2.6版本的jquery.pack.js，其他新版本也可以使用。

在WebRoot/目录下创建lib文件夹，将jquery.pack.js拷贝至该文件夹中。

[b]5.页面[/b]

因为使用javascript来访问资源和页面展示，完全不需要服务端代码实现，所以这次使用html文件就行了。

在WebRoot/目录下创建list.html，代码如下：

[list]

[*]页面加载时访问/customers的get方法读取现有Customers并展示，实现list。

[*]点击create链接时调用create_show()弹出新增Customer界面，提交后调用create()访问/customers的post方法，并将返回结果添加在表格最下方，实现create。

[*]点击update链接时调用read(id)查询Customer并展示在修改Customer界面，提交后调用update()访问/customer的put方法，并将返回结果修改至原来所在行，实现read和update。

[*]点击delete链接时调用deleteCustomer(id)删除Customer，并将原来所在行删除，实现delete。

[/list]

[b]6.测试[/b]

部署程序后，使用浏览器访问[url]http://localhost:8080/firstSteps/list.jsp[/url]，可以看到空的表格和create链接。

依次进行create>read>update>delete操作，可以看到增删改查没有问题，说明使用javascript和ajax对Restlet资源的访问成功。

新开一个页面并将某个Customer删除后，在原来的页面中尝试read、update和delete操作，可以看到提示"no customer 0"信息，说明Restlet返回的new JsonRepresentation("{}")被成功解析为json数据。

[b]7.Application[/b]

在本次实践中我们并没有使用html form配合method参数来访问资源的put和delete方法，而是使用jQuery提供的$.ajax方法中的参数type: 'PUT'和type: 'DELETE'来实现，所以第六章中对Application的配置就不是必须的了。

修改src/目录下的applicationContext.xml，代码如下：

代码中仅注释掉application配置，并将component的defaultTarget引用指向restRouter，其他配置保持不变。这样spring就回到了第五章时的相同配置。

重新部署程序后进行测试，提示信息和效果保持不变，说明Application的配置删除成功。

应支持我的朋友要求，上传源码工程。