首页 > 编程 > .NET > 正文

用.Net实现基于CSS的AJAX开发(1)

2024-07-10 13:12:45
字体:
来源:转载
供稿:网友

前面我介绍了我做的.net版的ajax库(.net下的简单ajax处理库 ),现在要介绍的是一种开发模式:样式绑定式驱动开发。
   样式驱动是我自己命名的,(我也不知道它叫什么,嘿嘿)以便区别目前的请求驱动式开发(如struts、webwork等)和事件驱动式开发(如asp.net、jsf等)。
  正文:
  1 简介
   首先,让我们来看看传统的流程:
   ·请求驱动: 最常见的一类web框架实现了以请求驱动的流程。一个http请求近来,被一个通用的分发器servlet
  (dispather servlet)分析,再被分发到一个对应的应用处理器。处理器依次处理ui特有的控制逻辑,调用业务对象和处理会
  话状态,准备一个模型,再转发到视图。
   ·事件驱动: 事件驱动框架的设计目标是将桌面ui编程中著名的事件驱动模式搬到web环境中来。其特征是;对于如何将
  表单提交到url、如何将url映射到控制器这些问题它们不关心;在事件驱动的框架中,表单组件和监听器联系在一起,监听器
  通过事件开调用。而且,这类框架通常不打算实现可插拔的试图技术来呈现给特定的模型对象,而是把web页看作一写列界面组
  件的组合物,每个组件可以保持自己的状态,并且知道如何呈现自己,甚至可能使用不同界面皮肤。
   从上面可以看到一个是传统的mvc架构是开发,一个是以页面为中心的快速应用开发(rad)两者各有各的好处。
  
   样式驱动式开发在请求驱动开发或事件驱动开发的基础上进行简单的封装,在界面层融合了以上两者概念优势,它以最前台
  的界面层为基础,通过css样式或htc事件绑定界面元素来执行相应后台业务,从而达到执行相应请求,处理相应的事件的目的
  。
   样式驱动的优势在于只需把前台元素赋予特定的样式,即可实现特殊的动能以及特定的业务处理,从而减少编码量和编译的
  次数,具有“一次编写,到处绑定”的特点。比传统开发复用性更强。尤其是在ajax大行其道的今天,在请求驱动框架或事件
  驱动现有框架的基础上利用样式绑定式开发基于ajax的应用,你会发现你的ajax程序的开发效率会提高很多,尤其是当反复应
  用同一(或相似)后台逻辑的情况会更明显,同样,样式绑定式开发对于面向服务式开发也具有很大的优势。
  
  2 基于asp.net的样式驱动开发
  
   样式驱动的操作不依赖与后台实现,asp.net的runat=server可以魔法搬地将前台元素转化为后台的元素,不过这样的转化
  依赖于特定的元素和后台,比如<input type=text runat=server> 这样确实是将input元素扩展成后台可以使用的服务器元素
  了,但是对于后台来讲他要在页面对应的里进行特定的处理,而且input type=text只能是input type=text也不可能扩展自己
  的功能。样式驱动则可以把一切元素、控件或控件中的元素利用js的强大功能在前台转换为你想要的功能和效果,然后再送入
  原请求或自定义请求,从而弥补asp.net的一些不足,“一次编写,到处绑定”的特点也为我们省去了多个页面类写重复代码的
  诸多困扰。
  
   也许你会说不是有用户控件吗,很抱歉,用户控件跟前台严重耦合,你将它拿到一个项目中也许派不上一点用场。
  
   那web控件库呢?虽然能重用,跟用户控件比不耦合了,但是局限性太强,复杂度高,我觉得叫一个普通程序员写一个带模
  板项的datagird能排序的,可以删除、修改、上移下移]可以查看详细信息的控件出来是一件很费事的事。
  
   又有人说了,真笨,我直接拖一个datagrid然后再这个基础上加按纽,模板列,排序,详细连接好不好啊,还用特意做个
  控件吗?有很抱歉的告诉你,如果是1000个datagird,每一个都有这些功能的一种或几种,那么你后台够写的了,即使你抽象
  出一层、封装出一个专门的datagirdbuilder类,也够复杂的,各种重载方法,晕。
  
   那么使用样式绑定式的开发就简单了,给datagird个排序的样式(比如cssclass=sort),后台几句代码,或者干脆不写(
  你的准备比较充足),就可以了,再加个列变为删除按钮(比如其中的一个列里itemstyle cssclass="delbtn"),就可以了,
  别的datagrid不需要排序,那么样式去掉。而后页面类里干干静静。样式绑定后变化的元素传值到统一的业务对象进行处理,
  一切都很规矩。
  
  3 实现
   利用我之前做过的ajax库,再结合javascript脚本构建一个这样的库不成问题。自然,跟做烧饭做菜一样,这里选料非常的
  重要,这里我要选用来自dean edwards和tino zijdel的事件操作脚本库(common.js)和neil cro~~~~y制作的样式基本操作库(
  css.js)来做好我们这道美味,噢,当然,还有大名鼎鼎的prototype.js库.
  
  
   好了,,前台的制作工序基本完成。
   然后就是利用我前一阵子做的ajax库了。
   假设是删除,querystring: command=delrow&js生成的参数……
   则后台调用ajaxdelrow.cs
  
  protected override void doajax()
  ...{
   // 搜集参数
   string parlist = request.params["pars"];
   string[] paritem = parlist.split('|');
   hashtable hash = new hashtable(paritem.length);
   for(int i=0;i<paritem.length-1;i++)
   ...{
   string[] paritempart = paritem[i].split('^');
   hash.add(paritempart[0],paritempart[1]);
   }
  
   bool isdeled = false;
   string table = request.params["table"];
   // 判断来源
   if(table!=null)
   ...{
   if(table.equals("dgbigclassmanage")) //datagrid的id号
   ...{
   // 调用对应业务外观的dao来删除
   // hash["0"]为datagrid的第0列,假设第0列传过来是id值
   isdeled = (new businessfacade()).deletebyid(hash["0"].tostring());
   }
   if(isdeled)
   ...{
   output("true");
   }
   else
   ...{
   output("false");
   }
  }
  ajaxdelrow制作流程请参考.net下的简单ajax处理库

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表