今天用AjaxControlToolkit控件CalendarExtender,想实现一个这样的功能:当用户选择某个日期后,执行一个验证的过程(与asp.net的Calendar控件的SelectionChanged方法)。于是我就找看有没有这样的事件,找了老半天,只找到一个属性:OnClientDateSelectionChanged,从字面上看应该就是这个了,但这个只支持脚本,不支持CS里的函数。那如何实现这个功能呢?于是上网找,还真有人跟我一样遇到这样的问题,但上面的答案不明确。还是自己研究出来了。
思路是这样的: 1、选在面页上放一个Button,把它的Width和Height都成0(注意一定不能设Visible=false,因为这样后面的脚本找不到它的),以达到隐藏的效果,并设ID=”btnSelect"。
2、在Button的OnClick事件中定义好要执行的事件。
3、设置CalendarExtender的OnClientDateSelectionChanged属性:SelectDate(这里对应的是Javascript的function;
4、写Javascript如下:
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/a41954a27d6ad96fa2c2cf816e677448.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/1327ab569c1ae82736693a50b8e33378.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/0196c3df5ea9e936f21e9932cca91014.gif)
这样就可以实现了。
这里补充一点,就是在有母版页的页面。var objBtn = document.getElementById('btnSelect');这句是不能取到对象的,要改成这样:
var objBtn = document.getElementById("<%=btnSelect.ClientID%>);
而且这句只能放在页中的的<script>中,不能放在单独的js文件中。
因为母版页的控件ID会被重新命名。