定制AjaxControlToolkit(2):给CalendarExtender增加清除功能

在定制AjaxControlToolkit(1):使一个CalendarExtender对应N个TextBox 的最后,为了展示主题,我贴了一张截图,也许大家注意到了,我的截图的右下 角有一个“清除”按钮,这就是本文要介绍的更改。

在我们的项目中,大多数的录入日期的文本框是不允许用户手输的,只能通 过 点击--弹出日期选择框的方式选择,这样可以避免烦人的检查动作,当然也可以 用MaskedEdit过滤,不过感觉没必要,有日期控件了,就不弄那么复杂了,另外 ,项目中大部分代码是以前写的,当时没有MaskedEdit可用,一直以来使用只读 的办法来限制日期文本框。

由于文本框只读,所以只要用户一旦选择了某个日期,就没办法使这个文本 框 变空了,大多数情况下,这并不是问题,但是在少数页面,这一点相当烦人,更 重要的是,以前的控件有这个功能,用户已经习惯了这样操作,现在突然告诉用 户你没办法清空它,这不怎么有说服力。而且从系统设计的角度讲,那个文本框 本来就是允许为空的,而且默认就是空的,后来选择了日期以后,就再也没办法 使它恢复到空值状态,也不怎么说得过去。

因此我觉得有必要给CalendarExtender增加清除功能,使它能够清空目标文 本 框。

清空的动作倒是非常简单,但是要把它正确地显示出来比较棘手。首先,要 了 解CalendarBehavior类的展示方法:首先有一个_popupDiv属性,它是整个控件 的 载体,其它的控件都附加在这个div之上;而底部显示“今天”的部分,是直接 附 加在总载体_popupDiv上的,因为本来底部只有它一个控件,它当然可以这样做 , 但是现在要在它右侧增加一个按钮,就要改变一下这种行为: 增加一个_footer 层 作为底部控件的载体, 把今天日期作为子控件附加到_footer上面, 再增加一个 _clearButton控件, 也附加到_footer上面. 实现这一流程的代码如下:

1. 增加私有属性:

    this._clearButton = null;

    this._footer = null;

2. 在_buildFooter方法中, 改写_today的展示方式:

    _buildFooter: function() {

        /// <summary>

        /// Builds the footer for the calendar

        /// </summary>

        this._footer = $common.createElementFromTemplate({

            nodeName: "div",

            properties: { id: this.get_id() + "_footer" },

            cssClasses: ["ajax__calendar_footer"]

        }, this._popupDiv);

        var todayWrapper = $common.createElementFromTemplate({ nodeName: "div" }, this._footer);

        this._today = $common.createElementFromTemplate({

            nodeName: "div",

            properties: {

                id: this.get_id() + "_today",

                mode: "today"

            },

            events: this._cell$delegates,

            //cssClasses: ["ajax__calendar_footer", "ajax__calendar_today"]

            cssClasses: ["ajax__calendar_today"]

        }, todayWrapper);

        var clearWrapper = $common.createElementFromTemplate({ nodeName: "div" }, this._footer);

        this._clearButton = $common.createElementFromTemplate({

            nodeName: "div",

            properties: {

                id: this.get_id() + "_clearButton",

                mode: "clear"

            },

            events: this._cell$delegates,

            cssClasses: ["ajax__calendar_clear"]

        }, clearWrapper);

    },

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索控件
, footer
, this
, 日期
, nodename
, AjaxControlToolkit
, 一个
, CalendarExtender
只读文本框
,以便于您获取更多的相关知识。

时间: 2024-11-03 10:47:41

定制AjaxControlToolkit(2):给CalendarExtender增加清除功能的相关文章

pdf 附注 c# 。net-C#操作PDF增加附注功能

问题描述 C#操作PDF增加附注功能 求高手指教C#如何操作pdf增加和删除附注功能 最好web端操作,没有winfrom也行,在线等急....294707874Q 联系Q也可以的 解决方案 c#操作pdf的类库 解决方案二: 我需要增加附注的案例...

数据库审计-web应用系统如何增加审计功能?

问题描述 web应用系统如何增加审计功能? 打算给当前的一个web应用增加审计功能.初步想法是在 *web应用层(侧重记录当前账号操作信息)和数据库层(借用Oracle自身的审计功能* ,侧重记录sql语句更改信息),这两个层次分别审计.但是怎么将两层的审计关联那,如实现查询某账号所执行的所有sql语句和数据更改情况. 除专业审计产品外,业界给web应用系统增加审计一般用什么方案?还有一种方案是 所有审计都放在web层完成 ,这样就没有上面方案的关联问题,因为完全可以自己控制数据的关联关系,这样

java-在csdn下了一个ssh的机票预订网站,但是坑爹却没有订票的功能,要增加这个功能还要写哪些代码?

问题描述 在csdn下了一个ssh的机票预订网站,但是坑爹却没有订票的功能,要增加这个功能还要写哪些代码? 这个系统偏向于管理功能,实现了登陆,查看航班,查看订单,查看旅客列表,取消订单等功能,要想增加一个订票功能该怎么写,求前辈指导!感激不尽! 解决方案 你现在怎么查看订单,你什么时候下单? 订票其实也是下单吧.你现在数据库有订单表吗?没有的话你的添加一个订单表,至少有用户id,订单id,航班id,座位号id 然后查看航班,然后查看座位,进行选择,最后下单.

MIUI6也上榜了:安卓定制系统中十个最实用的功能

[TechWeb报道]为了使自己的产品在市场脱颖而出,手机厂商们都会开发基于安卓的定制系统,在安卓原生系统上加入一些好用的功能.下面我们就来盘点一下各大厂商的安卓定制系统中最好用的十个功能.1. 三星的智能暂停功能有时一些细节 就会大幅提升用户体验,三星的这一功能就是如此.它可以让手机屏幕无限期长亮,并且不会和你设定的屏幕长亮时间冲突.有了这个功能,你就能将屏幕长亮时间设定到最低值来避免耗电,在上网或看书的时候再开启该功能.LG和索尼的手机也提供这一功能喔.2.三星的单手操作模式安卓手机的屏幕确

Android UI设计系列之自定义EditText实现带清除功能的输入框(3)_Android

最近公司的产品在陆续做升级,上级领导给的任务是优化代码结构以及项目架构,力争把项目写的精巧简练,于是我们满工程找冗余... 我们都知道每一个项目基本上都是有登陆页的,在登陆页中肯定是少不了输入框了,当我们在输入框中输入数据后如果输入的内容不正确或者是错误的或者是想重新输入,如果嗯键盘上的删除键就得一个一个的去删除,这时候我们或许就想要是能有一个标记当点击了这个标记能把我们刚刚输入的内容清空就好了.这样可以极大的提升用户体验,就拿QQ的登陆来说吧,效果如下: 当点击密码框右侧的小×图标时输入的内容

PHP上传图片进行等比缩放可增加水印功能_php技巧

啥也不说,直接上代码,大家可以自行添加增加水印功能: 复制代码 代码如下: <?php /** * * @author zhao jinhan * @date 2014年1月13日11:54:30 * @email xb_zjh@126.com * */ header('Content-type:text/html; charset=utf-8'); //定义缩略图的宽高 define('THUMB_WIDTH',300); define('THUMB_HEIGHT',300); /** * 重

原创:163邮箱增加附件功能

// 原创作品: 作者:jimmy 所属:www.111cn.net 注明:转载请说明来处 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content=&

安卓开源画图app“MK画图”增加水印功能,呵呵

 安卓开源画图app"MK画图"增加水印功能,呵呵 源码路径:https://github.com/JumpingYang001/markers-cn 源码和apk百度云下载地址:http://pan.baidu.com/s/1kVqGtwV Markers画图中文版 Forked from https://github.com/dsandler/markers, but a Chinese version:Markers画图中文版 Release apk https://gith

使用 AI 为 Web 网页增加无障碍功能

本文讲的是使用 AI 为 Web 网页增加无障碍功能, 原文地址:Making the Web More Accessible With AI 原文作者:Abhinav Suri 译文出自:掘金翻译计划 本文永久链接:github.com/xitu/gold-m- 译者:lsvih 校对者:Tina92,Cherry 使用 AI 为 Web 网页增加无障碍功能 图为一位盲人正在阅读盲文(图片链接) 根据世界健康组织的统计,全球约有 2.85 亿位视力障碍人士,仅美国就有 810 万网民患视力障碍