AJAX实现的多人协同设计
Download board.zip - 39.6 KB - Old Version
Download board_2008.zip - 55.03 KB - Latest VS 2008 Version
Introduction
This is an AJAX based WhiteBoard application. Typically unlike their desktop based counterparts, web applications need to be designed to use optimal server resources. This is one of the reasons for AJAX being popular. Here I demonstrate a powerful use of AJAX to make communication possible between two or more clients.
So, What can this do?
As I said, this is a WhiteBoard Application. Users are provided with certain drawing tools, color selections, etc. The basic idea is to share the user drawings among all the clients. All the users viewing the main page can participate in the drawing and share it with all other users. Clearing local canvas, server data, etc is also possible.
Background
A couple of years ago I was assigned the task of researching the capabilities of AJAX. Being a tech freak I was hell bent on convincing the client to use the then NEW AND HOT technology. I wasted a few days thinking on my right approach to the design and GUI. I wanted the application to look something like a desktop application and yet be executed in a browser. My aim was to avoid postbacks completely.(To impress the client). I was scampering through every result on google, reading every article on AJAX so as to get the perfect Application as a demo.
I happened to see a javascript (wz_jsgraphics.js) by Walter Zorn Link . It was then that the idea of building a web based WhiteBoard struck me. I give full credit to Walter for his excellent javascript. Once I learned using his script, it was just a matter of days before my own Web based Whiteboard was up and running.
The Basics...
As in all AJAX based applications, I have a main page that is displayed to the user. A page on the server handles all the requests and responses to this page. All the drawing part is done using Walters javascript. I designed a messaging mechanism to iden
相关文档:
function Ajax(url)
{
var m_xmlReq=null;
if(window.ActiveXObject)
{
try
{
m_xmlReq = new ActiveXObject('Msxml2.XMLHTTP');
}
catch(e)
{
try{m_xmlReq = new ActiveXObject('Microsoft.XMLHTTP');}catch(e){}
}
}
else if(window.XMLHttpRequest ......
1:Ajax可以通过JavaScript的XMLHttpRequest对象与服务器进行通信,通过XMLHttpRequest,JavaScript可以在不重载页面的情况下与服务器进行通信。
2:XMLHttpRequest 浏览器支持
<script type="text/javascript">
function ajaxFunction()
{
var xmlHttp;
try
{
xmlHtt ......
AJAX的分页,实现思路是:
1.利用$.fn.extend在JQuery框架下扩展pager类
2.将获取记录总数与相应页记录的后台方法,写在继承自IHttpHandler类的Handler.ashx.cs类,当然实际上用aspx.cs文件写后台方法也没问题,但由于.ashx.cs文件无需处理页面诸多事件因而效率更高。
3.在呈现页面上加载pager类
......
1:Ajax可以通过JavaScript的XMLHttpRequest对象与服务器进行通信,通过XMLHttpRequest,JavaScript可以在不重载页面的情况下与服务器进行通信。
2:XMLHttpRequest 浏览器支持
<script type="text/javascript">
function ajaxFunction()
{
var xmlHttp;
try
{
xmlHtt ......
ajax提交表单
关键字: ajax
function ajaxSubmitForm(form, resultDivId) {
var elements = form.elements;// Enumeration the form elements
var element;   ......