AJAX框架 jMaki (三) – 用日历(Calendar)和表格(Table)实现的Blog首页
2007-12-18 22:38
429 查看
下面使用jMaki中的Yahoo Calendar和Yahoo DataTable 来建立一个迷你Blog首页。这个小程序可以在选择日历的某个日期后,Data Table中只列出这个日期所发表的文章。
jMaki中的Yahoo Calendar和Yahoo DataTable 都是Yahoo UI Library 中的控间, jMaki的作用只是在现有的控件之上作了一些包装(wrapper), 这样,这些Widget可以通过jMaki框架进行通讯,通过很少的代码或者配置就可以完成一个功能丰富的应用程序,也就是通常所说的mashup.
使用NetBeans[u]开发迷你Blog[u]首页的步骤[/u][/u]
1. NetBeans 菜单”文件”-”新建项目”.在出现的”新建项目”窗口中,”类别”选择”Web”, 项目选择”Web应用程序”.点击”下一步”2. 在”新建项目窗口中”, “项目名称”中输入”jMakiCalendarTable”项目. 点击”下一步”3. 在”框架”窗口中,选择”jMaki Ajax Framework” . 点击”完成”.4. NetBeans 中出现 jMakiCalendarTable 项目的同时,也会出现在”组件面板”中出现jMaki的Widgets, 包括Dojo, Flickr, Google, Yahoo等中的一些Widgets. 如果没有出现”组件面板”, 选择菜单”窗口”-> “组件面板”.5. 在netBeans中, 用鼠标直接把”jMaki Yahoo”下的Calendar拖到 jMakiCalendarDemo 项目中的index.jsp文件中. 通常日历会放在左侧栏或者右侧栏中. 这个例子中放在中.把“jMaki Yahoo“下的”Data Table”拖到“Main Content Area”下。
![](http://p.blog.csdn.net/images/p_blog_csdn_net/adali/335014/o_project_calendar_table_drag.JPG)
6. 修改index.jsp 中”yahoo.dataTable”的内容
7. 初始运行jMakiCalendarTable 结果如下:
![](http://p.blog.csdn.net/images/p_blog_csdn_net/adali/335014/o_calendar_result_init.JPG)
8. 要完成这个迷你Blog首页,要做以下几部分工作 获得Calendar的日期
日期发送给服务器端
服务器端返回给客户端列表,列表只包含对应日期的信息
返回的列表信息更新到DataTable
要获得Calendar的日期,根据之前介绍的“发布/订阅机制(publish/subscribe machnism)”, 在index.jsp 的calendar Widget下加入 以下代码代码
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
Sidebar Content Here
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/a41954a27d6ad96fa2c2cf816e677448.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/1327ab569c1ae82736693a50b8e33378.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
因为在web/resources/yahoo/calendar/compenent.js中已经发布(publish)了”/yahoo/calendar/onSelect”, 因此在这段JavaScript中可以直接订阅(subscribe)“/yahoo/calendar/onSelect” topic, 这样在选择Calendar的某个日期时,调用函数calendarListener().
函数calendarListener()完成两件事情, 一个是得到Calendar下显示选中的日期,日期格式为“yyyy/mm/dd”,并显示在定义好的中,一个是向服务器端发送AJAX请求, 是用 jmaki.doAjax()函数实现的.
SelectCallBack()函数是AJAX请求返回的回调函数, 得到服务器端返回的信息后, 发布(publish) “"/table/topic/clear"和”/table/topic/addRows”, 并传递了相关参数. 相应地在 yahoo.dataTable 中订阅(subscribe)这些”
topic”
修改dataTable Widget为:
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
value="{columns : [
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
{ label : 'Post Date', id : 'postdate'},
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
{ label : 'Title', id : 'title'},
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
{ label : 'Author', id : 'author'}
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
],
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
rows : []
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
}"
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
/>
DataTable中 rows内容为空,下面要把这部分信息放在服务器端的Servlet中,9. 修改后的index.jsp的源代码如下:
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
<%@ taglib prefix="a" uri="http://jmaki/v1.0/jsp" %>
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
Page Title
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
Sidebar Content Here
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
Main Content Area
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
value="{columns : [
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/a41954a27d6ad96fa2c2cf816e677448.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/1327ab569c1ae82736693a50b8e33378.gif)
...{ label : 'Post Date', id : 'postdate'},
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/a41954a27d6ad96fa2c2cf816e677448.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/1327ab569c1ae82736693a50b8e33378.gif)
...{ label : 'Title', id : 'title'},
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/a41954a27d6ad96fa2c2cf816e677448.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/1327ab569c1ae82736693a50b8e33378.gif)
...{ label : 'Author', id : 'author'}
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
],
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
rows : []
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
}"
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
/>
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
10. 新建BlogServlet, 作为服务器端接受,处理信息以及返回信息的类. 鼠标右键盘选择项目"jMakiCalendarTable", 选择"新建"->"Servlet",
类名:BlogServlet
包:com.sun.sdn.demo.jmaki
点击"下一步"
![](http://p.blog.csdn.net/images/p_blog_csdn_net/adali/335014/o_new_blogservlet.JPG)
下一个"配置Servlet部署"窗口不做修改, 点击”完成”
修改BlogServlet中protected void processRequest()方法, 内容如下
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
protected void processRequest(HttpServletRequest request, HttpServletResponse response)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/a41954a27d6ad96fa2c2cf816e677448.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/1327ab569c1ae82736693a50b8e33378.gif)
throws ServletException, IOException ...{
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
String [][] blogList = ...{
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
...{"2007/09/07", "NetBeans New and Cool","Tim Boudreau"},
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
...{"2007/09/07","NetBeans Mobility","Ada Li"},
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
...{"2007/09/07","Creating Web 2.0 Rich Internet Applications","Michael Li"},
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
...{"2007/09/08","AJAX and JSF","Ada Li"},
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
...{"2007/09/09","Ruby on Rails in the Enterprise","Liang Ye"},
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
...{"2007/09/09","Beans Binding and the Swing Application Framework","Joey Shen"}
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/717446ca04a6125dc5b6b54e0fa14ab4.gif)
};
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
String dateParam = request.getParameter("date");
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
SimpleDateFormat sdf = new SimpleDateFormat("yyyy/MM/dd");
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
boolean listAll = false;
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
Date date = null;
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
if (dateParam == null || "".equals(dateParam))...{
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
date = Calendar.getInstance().getTime();
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
listAll = true;
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
}else ...{
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
try ...{
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
date = sdf.parse(dateParam);
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
} catch (ParseException ex) ...{
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
ex.printStackTrace();
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/717446ca04a6125dc5b6b54e0fa14ab4.gif)
}
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/717446ca04a6125dc5b6b54e0fa14ab4.gif)
}
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
String dateStr = sdf.format(date);
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
response.setContentType("text/html;charset=UTF-8");
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
PrintWriter out = response.getWriter();
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
out.println("[");
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
boolean first = true;
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
for (int i=0; i
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
String[] blogItem = blogList[i];
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
if (listAll || blogItem[0].equals(dateStr))...{ //Date match
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
if (!first)...{
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
out.println(",");
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/717446ca04a6125dc5b6b54e0fa14ab4.gif)
}
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
out.println("{");
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
out.println("postdate: '" + blogItem[0] + "', ");
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
out.println("title: '" + blogItem[1] + "', ");
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
out.println("author: '" + blogItem[2] + "' ");
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
out.println("}");
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
first = false;
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/717446ca04a6125dc5b6b54e0fa14ab4.gif)
}//End if
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/717446ca04a6125dc5b6b54e0fa14ab4.gif)
}//End i blogList loop
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
out.println("]");//end rows
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
out.flush();
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
out.close();
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/0196c3df5ea9e936f21e9932cca91014.gif)
}processRequest()主要作用是根据日期,筛选显示内容, 并以JSON格式返回给客户端.
11. 最终运行结果如下:
![](http://p.blog.csdn.net/images/p_blog_csdn_net/adali/335014/o_calendar_result.JPG)
最后需要提到的是, jMaki还在发展中, 请到https://ajax.dev.java.net/下载最新的包和plug-in.
参考:
https://ajax.dev.java.net/samples/samples.htmlhttps://ajax.dev.java.net/http://wiki.java.net/bin/view/Projects/jMakiDataModelshttp://developer.yahoo.com/yui/datatable/http://blogs.sun.com/arungupta/entry/jmaki_filters_runners_mashuphttp://blogs.sun.com/patriceg/ http://www.javapassion.com/
Trackback: http://tb.blog.csdn.net/TrackBack.aspx?PostId=1783783
jMaki中的Yahoo Calendar和Yahoo DataTable 都是Yahoo UI Library 中的控间, jMaki的作用只是在现有的控件之上作了一些包装(wrapper), 这样,这些Widget可以通过jMaki框架进行通讯,通过很少的代码或者配置就可以完成一个功能丰富的应用程序,也就是通常所说的mashup.
使用NetBeans[u]开发迷你Blog[u]首页的步骤[/u][/u]
1. NetBeans 菜单”文件”-”新建项目”.在出现的”新建项目”窗口中,”类别”选择”Web”, 项目选择”Web应用程序”.点击”下一步”2. 在”新建项目窗口中”, “项目名称”中输入”jMakiCalendarTable”项目. 点击”下一步”3. 在”框架”窗口中,选择”jMaki Ajax Framework” . 点击”完成”.4. NetBeans 中出现 jMakiCalendarTable 项目的同时,也会出现在”组件面板”中出现jMaki的Widgets, 包括Dojo, Flickr, Google, Yahoo等中的一些Widgets. 如果没有出现”组件面板”, 选择菜单”窗口”-> “组件面板”.5. 在netBeans中, 用鼠标直接把”jMaki Yahoo”下的Calendar拖到 jMakiCalendarDemo 项目中的index.jsp文件中. 通常日历会放在左侧栏或者右侧栏中. 这个例子中放在中.把“jMaki Yahoo“下的”Data Table”拖到“Main Content Area”下。
6. 修改index.jsp 中”yahoo.dataTable”的内容
value="{columns : [ { label : 'Post Date', id : 'postdate'}, { label : 'Title', id : 'title'}, { label : 'Author', id : 'author'} ], rows : [ { postdate : '2007/09/07', title : 'NetBeans New and Cool', author : 'Tim Boudreau'}, { postdate : '2007/09/07', title : 'NetBeans Mobility', author : 'Ada Li'}, { postdate : '2007/09/07', title : 'Creating Web 2.0 Rich Internet Applications', author : 'Michael Li'}, { postdate : '2007/09/08', title : 'AJAX and JSF', author : 'Ada Li'}, { postdate : '2007/09/09', title : 'Ruby on Rails in the Enterprise', author : 'Liang Ye'}, { postdate : '2007/09/09', title : 'Beans Binding and the Swing Application Framework', author : 'Joey Shen'} ] }" /> |
8. 要完成这个迷你Blog首页,要做以下几部分工作 获得Calendar的日期
日期发送给服务器端
服务器端返回给客户端列表,列表只包含对应日期的信息
返回的列表信息更新到DataTable
要获得Calendar的日期,根据之前介绍的“发布/订阅机制(publish/subscribe machnism)”, 在index.jsp 的calendar Widget下加入 以下代码代码
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
Sidebar Content Here
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/a41954a27d6ad96fa2c2cf816e677448.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/1327ab569c1ae82736693a50b8e33378.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
函数calendarListener()完成两件事情, 一个是得到Calendar下显示选中的日期,日期格式为“yyyy/mm/dd”,并显示在定义好的中,一个是向服务器端发送AJAX请求, 是用 jmaki.doAjax()函数实现的.
SelectCallBack()函数是AJAX请求返回的回调函数, 得到服务器端返回的信息后, 发布(publish) “"/table/topic/clear"和”/table/topic/addRows”, 并传递了相关参数. 相应地在 yahoo.dataTable 中订阅(subscribe)这些”
topic”
修改dataTable Widget为:
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
value="{columns : [
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
{ label : 'Post Date', id : 'postdate'},
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
{ label : 'Title', id : 'title'},
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
{ label : 'Author', id : 'author'}
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
],
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
rows : []
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
}"
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
/>
DataTable中 rows内容为空,下面要把这部分信息放在服务器端的Servlet中,9. 修改后的index.jsp的源代码如下:
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
<%@ taglib prefix="a" uri="http://jmaki/v1.0/jsp" %>
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
Sidebar Content Here
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
Main Content Area
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
value="{columns : [
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/a41954a27d6ad96fa2c2cf816e677448.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/1327ab569c1ae82736693a50b8e33378.gif)
...{ label : 'Post Date', id : 'postdate'},
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/a41954a27d6ad96fa2c2cf816e677448.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/1327ab569c1ae82736693a50b8e33378.gif)
...{ label : 'Title', id : 'title'},
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/a41954a27d6ad96fa2c2cf816e677448.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/1327ab569c1ae82736693a50b8e33378.gif)
...{ label : 'Author', id : 'author'}
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
],
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
rows : []
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
}"
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
/>
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
10. 新建BlogServlet, 作为服务器端接受,处理信息以及返回信息的类. 鼠标右键盘选择项目"jMakiCalendarTable", 选择"新建"->"Servlet",
类名:BlogServlet
包:com.sun.sdn.demo.jmaki
点击"下一步"
下一个"配置Servlet部署"窗口不做修改, 点击”完成”
修改BlogServlet中protected void processRequest()方法, 内容如下
![](https://oscdn.geek-share.com/Uploads/Images/Content/2015/2015030196/6810355c2f78c12e91b7997a8e8c583a.gif)
protected void processRequest(HttpServletRequest request, HttpServletResponse response)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/a41954a27d6ad96fa2c2cf816e677448.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/1327ab569c1ae82736693a50b8e33378.gif)
throws ServletException, IOException ...{
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
String [][] blogList = ...{
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
...{"2007/09/07", "NetBeans New and Cool","Tim Boudreau"},
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
...{"2007/09/07","NetBeans Mobility","Ada Li"},
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
...{"2007/09/07","Creating Web 2.0 Rich Internet Applications","Michael Li"},
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
...{"2007/09/08","AJAX and JSF","Ada Li"},
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
...{"2007/09/09","Ruby on Rails in the Enterprise","Liang Ye"},
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
...{"2007/09/09","Beans Binding and the Swing Application Framework","Joey Shen"}
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/717446ca04a6125dc5b6b54e0fa14ab4.gif)
};
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
String dateParam = request.getParameter("date");
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
SimpleDateFormat sdf = new SimpleDateFormat("yyyy/MM/dd");
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
boolean listAll = false;
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
Date date = null;
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
if (dateParam == null || "".equals(dateParam))...{
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
date = Calendar.getInstance().getTime();
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
listAll = true;
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
}else ...{
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
try ...{
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
date = sdf.parse(dateParam);
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
} catch (ParseException ex) ...{
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
ex.printStackTrace();
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/717446ca04a6125dc5b6b54e0fa14ab4.gif)
}
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/717446ca04a6125dc5b6b54e0fa14ab4.gif)
}
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
String dateStr = sdf.format(date);
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
response.setContentType("text/html;charset=UTF-8");
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
PrintWriter out = response.getWriter();
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
out.println("[");
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
boolean first = true;
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
for (int i=0; i
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
String[] blogItem = blogList[i];
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
if (listAll || blogItem[0].equals(dateStr))...{ //Date match
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/7ff8d92cded7e0ce15e7ca1acc870052.gif)
if (!first)...{
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
out.println(",");
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/717446ca04a6125dc5b6b54e0fa14ab4.gif)
}
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
out.println("{");
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
out.println("postdate: '" + blogItem[0] + "', ");
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
out.println("title: '" + blogItem[1] + "', ");
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
out.println("author: '" + blogItem[2] + "' ");
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
out.println("}");
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
first = false;
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/717446ca04a6125dc5b6b54e0fa14ab4.gif)
}//End if
![](https://oscdn.geek-share.com/Uploads/Images/Content/201104/717446ca04a6125dc5b6b54e0fa14ab4.gif)
}//End i blogList loop
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
out.println("]");//end rows
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
out.flush();
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/6a9c071a08f1dae2d3e1c512000eef41.gif)
out.close();
![](https://oscdn.geek-share.com/Uploads/Images/Content/201109/0196c3df5ea9e936f21e9932cca91014.gif)
}processRequest()主要作用是根据日期,筛选显示内容, 并以JSON格式返回给客户端.
11. 最终运行结果如下:
最后需要提到的是, jMaki还在发展中, 请到https://ajax.dev.java.net/下载最新的包和plug-in.
参考:
https://ajax.dev.java.net/samples/samples.htmlhttps://ajax.dev.java.net/http://wiki.java.net/bin/view/Projects/jMakiDataModelshttp://developer.yahoo.com/yui/datatable/http://blogs.sun.com/arungupta/entry/jmaki_filters_runners_mashuphttp://blogs.sun.com/patriceg/ http://www.javapassion.com/
Trackback: http://tb.blog.csdn.net/TrackBack.aspx?PostId=1783783
相关文章推荐
- AJAX框架 jMaki (三) – 用日历(Calendar)和表格(Table)实现的Blog首页
- AJAX框架 jMaki (三) – 用日历(Calendar)和表格(Table)实现的Blog首页
- AJAX框架 jMaki (三) – 用日历(Calendar)和表格(Table)实现的Blog首页
- AJAX框架 jMaki (三) – 用日历(Calendar)和表格(Table)实现的Blog首页
- AJAX框架 jMaki (三) – 用日历(Calendar)和表格(Table)实现的Blog首页
- AJAX框架 jMaki (三) – 用日历(Calendar)和表格(Table)实现的Blog首页
- AJAX框架 jMaki (三) – 用日历(Calendar)和表格(Table)实现的Blog首页
- AJAX框架 jMaki (三) – 用日历(Calendar)和表格(Table)实现的Blog首页
- AJAX框架 jMaki (三) – 用日历(Calendar)和表格(Table)实现的Blog首页
- AJAX框架 jMaki (三) – 用日历(Calendar)和表格(Table)实现的Blog首页
- AJAX框架 jMaki (三) – 用日历(Calendar)和表格(Table)实现的Blog首页
- AJAX框架 jMaki (三) – 用日历(Calendar)和表格(Table)实现的Blog首页
- AJAX框架 jMaki (三) – 用日历(Calendar)和表格(Table)实现的Blog首页
- AJAX框架 jMaki (三) – 用日历(Calendar)和表格(Table)实现的Blog首页
- AJAX框架 jMaki (三) – 用日历(Calendar)和表格(Table)实现的Blog首页
- AJAX框架 jMaki (三) – 用日历(Calendar)和表格(Table)实现的Blog首页
- AJAX框架 jMaki (三) – 用日历(Calendar)和表格(Table)实现的Blog首页
- AJAX框架 jMaki (三) – 用日历(Calendar)和表格(Table)实现的Blog首页
- AJAX框架 jMaki (三) – 用日历(Calendar)和表格(Table)实现的Blog首页
- AJAX框架 jMaki (三) – 用日历(Calendar)和表格(Table)实现的Blog首页