先说说思路,前台还是用datalist控件把数据从后台读出来,现在关键是怎么样把新的留言加到datalist中并且不刷新页面,看了一些其他人的做法就是把所有的数据重新以异步的方式读到前台,数据量大的话觉得这样并不好,我的想法是不用重新读取所有数据但还能把新的留言呈现的前台页面。
当点击确认留言的时候,利用javascript创建一些HTML代码,把留言的内容呈现在前台,只要控制好样式,和原来datalist里面留言的样式一样就ok了,其他那些数据现在并没有在datalist中!!!那现在数据怎样传到后台数据库呢?呵呵,当然是利用javascript调用webserver了!!!这样就避免了异步读取所有的数据到前台,只需要把新留言的数据异步的方式传到数据库就ok了~~~
看看效果,点击提交按钮以后:
上图“原来的数据”那行留言是页面载入的时候在datalist控件中呈现的,而新添的数据那行是点击提交留言之后利用javascript创建的一些HTML控件呈现的,并没有在datalist控件中!!!只是控制好样式和datalist里面的一样就行了~~~,点击提交按钮的同时数据已经通过javascript调用webserver传到数据库里面了,
手动的刷新页面或下次打开页面的时候的效果图:
这次新添加的数据是在datalist中呈现的
前台代码:
namediv.setAttribute("className","article-controls");
websever代码:
源程序下载:/Files/dushouke/ajaxcomment.rar