由于我在做一个类似Live.com的东西,所以需要类似WebPart的功能。我不清楚Atlas扩展的那个所谓的Cross Browser WebPart到底是什么,支持如何,所以不敢去尝试,从而决定用DragDropList。

首先,关于如何使用DragDropList,可以参考Dflying的以下两篇文章:

  • 使用ASP.NET Atlas实现拖放(Drag & Drop)效果(上)
  • 使用ASP.NET Atlas实现拖放(Drag & Drop)效果(下)

参照第二篇文章轻松制作出WebPark拖放效果来是完全没问题,接下来要做的就是让用户拖放修改后的界面保存下来。这时候ASP.NET 2.0新增的Profile Service就是一个很好的选择,而且Atlas也包括对Profile读写的支持。接着问题就来了,何时能够获取到拖放结束的事件然后更新Profile呢?DragDropList和DraggableListItem没有对外公开任何事件,所以在使用它们快速实现类似WebPart的功能时仅仅能够获得视觉上的效果,无法对它们编程以实现任何有实际意义的东西。

这时候我选择了继承DragDropList来增加对外的事件触发能力,需要做的仅仅是重写onDragEnd方法。感谢Beta1的prototype书写方式,所有函数都是virtual的,这给重写带来了方便,不需要再用registerBaseMethod覆盖掉基类的函数。重写如下:
function MyDragDropList$onDragEnd(cancelled)
{
  debug.trace(cancelled);
  MyDragDropList.callBaseMethod(this, "onDragEnd", [cancelled]);
  this._dragVisual.style.width = null;
  this._dragVisual.style.height = null;
  this._dragVisual.style.zIndex = null;
}

debug.trace(cancelled)在这里是做演示作用,真正放在此位置的应该是一条触发事件的指令,甚至可以根据cancelled值决定是否触发,因为若它为true则实际上拖放没造成任何变化。

后面对样式属性的删除又是什么呢?这是对DragDropList某一个bug的work around。在拖动过程中,由于拖动的DomElement(也就是this._dragVisual)脱离了它原本的上下文,如果它原本的样式属性是width:100%那就会出问题,所以DragDropList取了它的offsetWidth属性来作为它的width,这样width的单位就一定是px。然而这却造成了另外一个问题,拖动后DomElement的width变成了一个单位为px的值,用户缩放浏览器时它就不能跟随缩放,这不符合我在CSS文件中定义width的单位为%时所期望的。于是我就在拖放结束后删除DragDropList对此DomElement样式的影响,让CSS文件定义的样式重新成为当前样式。

最后,提供一篇我觉得比较有价值的文章,方便大家实现自己的IDragSource和IDropTarget:Drag and Drop with Atlas: interfaces。文章中详细解释了这两个接口的各个方法,比起你自己去研究DragDropList的代码要简单一些。

转载于:https://www.cnblogs.com/cathsfz/archive/2006/10/27/541387.html

Microsoft Ajax Beta1 - 边学边用边补充 (Part 2 - DragDropList)相关推荐

  1. 深入了解 Microsoft AJAX Library (转自msdn,觉得不错)

    深入了解 Microsoft AJAX Library Dino Esposito 代码下载位置: CuttingEdge2007_12.exe (152 KB) Browse the Code On ...

  2. 使用 Microsoft Ajax Library 创建自定义客户端脚本

    MSDN地址:http://msdn.microsoft.com/zh-CN/library/bb386453.aspx Microsoft Ajax Library是微软提供的一套基于客户端的Aja ...

  3. 实例讲解《Microsoft AJAX Library》(2):DomEvent类

    引言: 大家都知道Ajax的之所以能如此丰富地实现,客户端脚本功不可没.而像Asp.Net Ajax这般庞大的工程,没有脚本类库的支撑是很难想象的.<Microsoft AJAX Library ...

  4. ASP.NET MVC中使用AJAX(XMLHttpRequest、Microsoft AJAX Library......)

    AJAX的好处就是不会堵塞页面,可以提高用户体验,可以减少数据传输尺寸,提高应用程序的性能.目前,AJAX技术可以说是已经成为WEB开发的标准技术. AJAX技术是纯客户端技术,任何客户端框架(如:M ...

  5. [前端优化]使用Microsoft Ajax Minifier对资源文件进行压缩优化

    在前端优化中,js.css等文件的优化一般都是压缩的优化,进行合并.减小体积以达到减小请求的目的. 今天发现了一个集成在VS中的压缩插件,使得压缩变得比较快捷. 配置方法 首先需要去下载Microso ...

  6. ASP.NET AJAX深入浅出系列课程(10):基于Microsoft AJAX Library扩展客户端组件.zip(10.77 MB)...

    讲座内容: 利用面向对象类型系统是扩展组件的常用方法,但是我们在客户端进行开发的时候也不能忘记正在使用的是JavaScript这个非常灵活的动态语言,使用一些特殊的方式来扩展组件有时候会得到更好的效果 ...

  7. [导入]ASP.NET Ajax程序设计第II卷:客户端Microsoft Ajax Library与异步通信层及源代码.zip(101.50 MB)...

    ASP.NET Ajax程序设计第II卷:客户端Microsoft Ajax Library与异步通信层及源代码 文章来源:http://www.isheu.com/data_8435_2.aspx ...

  8. 【转】用Microsoft Ajax Minifier帮你的Javascript瘦身

    从Web 2.0兴起后,使用者对于网页互动的需求愈来愈大,不仅要求使用界面美观,也希望操作功能的友善度上能与过去的Winform程式看齐,而为了达到更良好的操作效果,程式设计师不得不在网页设计上加入许 ...

  9. VS2008下, Microsoft AJAX 组件开发单独js智能提示

    VS2008下,在使用单独JS文件开发 Microsoft AJAX 组件时,在js的第一行加上引用标记即可实现js智能提示. ASP.NET 2.0 /// <reference name & ...

最新文章

  1. java基础(六) switch语句的深入解析
  2. hibernate入门知识-01
  3. 【数据科学】 推荐一个更高效的数据清洗方法,建议收藏
  4. python如何导入hotp库_Google Authenticator在Python中的实现
  5. Direct3D顶点结构使用总结
  6. python--自己实现的单链表常用功能
  7. 电梯里的爱情华科oj
  8. Oracle 11g服务器安装详细步骤——图文教程
  9. mysql忘记密码怎样重置
  10. Spring Security(二) UserDetailsService 和 PasswordEncoder 密码解析器 详解
  11. [附源码]计算机毕业设计JAVA 宠物医院管理系统
  12. python爬房源信息_Python爬虫-爬取300个短租网房源信息
  13. JAVA 访问windows共享文件夹
  14. linux终端ppt,[转]TPP:linux终端下的ppt
  15. Unity Fleck Map 参数说明
  16. 能够有效提升开发效率的 20 余款 VSCode 插件(多图带效果展示)
  17. vue视频播放插件vue-video-player
  18. 书论92 侯仁朔《侯氏书品》
  19. 关于VMWare Data Protection VDP的使用心得
  20. Radiology:脑损伤患者基于语言任务的功能磁共振成像与静息态功能磁共振成像对躯体运动网络的识别

热门文章

  1. python 设置横坐标刻度_python 双误差棒(上下误差棒)主刻度 副刻度
  2. 数字图像处理与python实现 pdf_正版 数字图像处理与Python实现 高等院校计算机科学 人工智能 信号与信息处理 通信工程等专业的...
  3. python代码解读软件_5种带你轻松分析Python代码的软件库
  4. 面试了3个 85前 的嵌入式软件工程师
  5. 真人出镜,微信视频号第一期视频来了!
  6. mysql alert table 日志_MySQL日志
  7. java 着色问题 回溯算法,C语言使用回溯法解旅行售货员问题与图的m着色问题
  8. mysql正则替换字符串_mysql中替换字符串(正则) 模糊
  9. php中update语句修改多个字段,Myabtis中批量更新update多字段
  10. lacp静态和动态区别_lacp静态与动态区别