目录

背景

项目使用 Ext.NET 2.2.0.40838 , 对应 Ext JS4.2 版本。 结果 2017/3/31 号的时候偶然间点日历选择控件选择2月,10月等月份突然就跳到3月份,9月份之类。 就是无法选择, 选择谷歌以后发现有同样的问题, 然后各种尝试, 重写了默认属性,如下代码后解决。 收获就是调用平台有时候要知道原因才能找到未知原因并修复. 宝贵的额是Ext框架问题解决思路吧.

现记录。 改动的部分就是 dt.setDate(1); 这一句, 设置为当前月份第一天。

代码

  • 原则上放到公共js里面, 然后就行了, 确保生效。 当然也可以放在页面里面调试, 先看看是不是可行。 本项目验证通过。
//修复日期月份模式下在本地日期为31号时跳到下个月的问题 2017年3月31日

(function () { 

if(!window.Ext){return;}
if(!window.Ext.Date){return;} Ext.Date.createParser = function (format) {
var utilDate = Ext.Date; var xf = function (format) {
var args = Array.prototype.slice.call(arguments, 1); var numberTokenRe = /\{(\d+)\}/g; return format.replace(numberTokenRe, function (m, i) {
return args[i];
});
} var code = [
// date calculations (note: the code below creates a dependency on Ext.Number.from())
"var me = this, dt, y, m, d, h, i, s, ms, o, O, z, zz, u, v, W, year, jan4, week1monday,",
"def = me.defaults,",
"from = Ext.Number.from,",
"results = String(input).match(me.parseRegexes[{0}]);", // either null, or an array of matched strings "if(results){",
"{1}", "if(u != null){", // i.e. unix time is defined
"v = new Date(u * 1000);", // give top priority to UNIX time
"}else{",
// create Date object representing midnight of the current day;
// this will provide us with our date defaults
// (note: clearTime() handles Daylight Saving Time automatically)
"dt = me.clearTime(new Date);dt.setDate(1);", "y = from(y, from(def.y, dt.getFullYear()));",
"m = from(m, from(def.m - 1, dt.getMonth()));",
"d = from(d, from(def.d, dt.getDate()));", "h = from(h, from(def.h, dt.getHours()));",
"i = from(i, from(def.i, dt.getMinutes()));",
"s = from(s, from(def.s, dt.getSeconds()));",
"ms = from(ms, from(def.ms, dt.getMilliseconds()));", "if(z >= 0 && y >= 0){",
// both the year and zero-based day of year are defined and >= 0.
// these 2 values alone provide sufficient info to create a full date object // create Date object representing January 1st for the given year
// handle years < 100 appropriately
"v = me.add(new Date(y < 100 ? 100 : y, 0, 1, h, i, s, ms), me.YEAR, y < 100 ? y - 100 : 0);", // then add day of year, checking for Date "rollover" if necessary
"v = !strict? v : (strict === true && (z <= 364 || (me.isLeapYear(v) && z <= 365))? me.add(v, me.DAY, z) : null);",
"}else if(strict === true && !me.isValid(y, m + 1, d, h, i, s, ms)){", // check for Date "rollover"
"v = null;", // invalid date, so return null
"}else{",
"if (W) {", // support ISO-8601
// http://en.wikipedia.org/wiki/ISO_week_date
//
// Mutually equivalent definitions for week 01 are:
// a. the week starting with the Monday which is nearest in time to 1 January
// b. the week with 4 January in it
// ... there are many others ...
//
// We'll use letter b above to determine the first week of the year.
//
// So, first get a Date object for January 4th of whatever calendar year is desired.
//
// Then, the first Monday of the year can easily be determined by (operating on this Date):
// 1. Getting the day of the week.
// 2. Subtracting that by one.
// 3. Multiplying that by 86400000 (one day in ms).
// 4. Subtracting this number of days (in ms) from the January 4 date (represented in ms).
//
// Example #1 ...
//
// January 2012
// Su Mo Tu We Th Fr Sa
// 1 2 3 4 5 6 7
// 8 9 10 11 12 13 14
// 15 16 17 18 19 20 21
// 22 23 24 25 26 27 28
// 29 30 31
//
// 1. January 4th is a Wednesday.
// 2. Its day number is 3.
// 3. Simply substract 2 days from Wednesday.
// 4. The first week of the year begins on Monday, January 2. Simple!
//
// Example #2 ...
// January 1992
// Su Mo Tu We Th Fr Sa
// 1 2 3 4
// 5 6 7 8 9 10 11
// 12 13 14 15 16 17 18
// 19 20 21 22 23 24 25
// 26 27 28 29 30 31
//
// 1. January 4th is a Saturday.
// 2. Its day number is 6.
// 3. Simply subtract 5 days from Saturday.
// 4. The first week of the year begins on Monday, December 30. Simple!
//
// v = Ext.Date.clearTime(new Date(week1monday.getTime() + ((W - 1) * 604800000)));
// (This is essentially doing the same thing as above but for the week rather than the day)
"year = y || (new Date()).getFullYear(),",
"jan4 = new Date(year, 0, 4, 0, 0, 0),",
"week1monday = new Date(jan4.getTime() - ((jan4.getDay() - 1) * 86400000));",
"v = Ext.Date.clearTime(new Date(week1monday.getTime() + ((W - 1) * 604800000)));",
"} else {",
// plain old Date object
// handle years < 100 properly
"v = me.add(new Date(y < 100 ? 100 : y, m, d, h, i, s, ms), me.YEAR, y < 100 ? y - 100 : 0);",
"}",
"}",
"}",
"}", "if(v){",
// favor UTC offset over GMT offset
"if(zz != null){",
// reset to UTC, then add offset
"v = me.add(v, me.SECOND, -v.getTimezoneOffset() * 60 - zz);",
"}else if(o){",
// reset to GMT, then add offset
"v = me.add(v, me.MINUTE, -v.getTimezoneOffset() + (sn == '+'? -1 : 1) * (hr * 60 + mn));",
"}",
"}", "return v;"
].join('\n'); var regexNum = utilDate.parseRegexes.length,
currentGroup = 1,
calc = [],
regex = [],
special = false,
ch = "",
i = 0,
len = format.length,
atEnd = [],
obj; for (; i < len; ++i) {
ch = format.charAt(i);
if (!special && ch == "\\") {
special = true;
} else if (special) {
special = false;
regex.push(Ext.String.escape(ch));
} else {
obj = utilDate.formatCodeToRegex(ch, currentGroup);
currentGroup += obj.g;
regex.push(obj.s);
if (obj.g && obj.c) {
if (obj.calcAtEnd) {
atEnd.push(obj.c);
} else {
calc.push(obj.c);
}
}
}
} calc = calc.concat(atEnd); utilDate.parseRegexes[regexNum] = new RegExp("^" + regex.join('') + "$", 'i');
utilDate.parseFunctions[format] = Ext.functionFactory("input", "strict", xf(code, regexNum, calc.join(''))); }
})();

记录 Ext 日历月份选择控件bug解决过程结果的更多相关文章

  1. 移动端日历选择控件(支持Zepto和JQuery)

    移动端日历选择控件(支持Zepto和JQuery) <!DOCTYPE html> <html> <head> <meta charset="utf ...

  2. [Ext JS 4] 实战之 带week(星期)的日期选择控件(三)

    前言 在 [Ext JS 4] 实战之 带week(星期)的日期选择控件(二) 的最后,有提到一个解决方案. 不过这方案有一个条件  ==> “2. 每年的周数从(1-52), 如果超过52 周 ...

  3. [Ext JS 4] 实战之 带week(星期)的日期选择控件

    前言 Ext JS 3 和 Ext JS 4中都有提供日期选择的组件(当然早期版本也有). 但是有一些日期选择的需求是要看到星期,就是日期中的哪一天是这一年的第几周. 遗憾的是Ext js 并没有提供 ...

  4. 用c/c++混合编程方式为ios/android实现一个自绘日期选择控件(一)

    本文为原创,如有转载,请注明出处:http://www.cnblogs.com/jackybu 前言 章节: 1.需求描述以及c/c++实现日期和月历的基本操作 2.ios实现自绘日期选择控件 3.a ...

  5. 打造基于jQuery的日期选择控件

    终于把jQuery拼写正确了哈,哈哈javascript也是区分大小写的,所以确实不能写错,今天我来和大家分享的是日期选择控件的实现,功能也许不够强大,但是能够满足需求. 我之前也写过(正确的说是改过 ...

  6. [转载]ExtJs4 笔记(9) Ext.Panel 面板控件、 Ext.window.Window 窗口控件、 Ext.container.Viewport 布局控件

    作者:李盼(Lipan)出处:[Lipan] (http://www.cnblogs.com/lipan/)版权声明:本文的版权归作者与博客园共有.转载时须注明本文的详细链接,否则作者将保留追究其法律 ...

  7. ExtJs4 笔记(9) Ext.Panel 面板控件、 Ext.window.Window 窗口控件、 Ext.container.Viewport 布局控件

    本篇讲解三个容器类控件. 一.面板控件 Ext.Panel 一个面板控件包括几个部分,有标题栏.工具栏.正文.按钮区.标题栏位于最上面,工具栏可以在四个位置放置,围绕中间部分正文,按钮区位于最小方.下 ...

  8. Android自定义View(RollWeekView-炫酷的星期日期选择控件)

    转载请标明出处: http://blog.csdn.net/xmxkf/article/details/53420889 本文出自:[openXu的博客] 目录: 1分析 2定义控件布局 3定义Cus ...

  9. swift-UIPickerView(选择控件)

    import UIKit //UIPickerView 的委托协议是 UIPickerViewDelegate,数据源是 UIPickerViewDataSource.我们需要在视图控制器中声明实现 ...

随机推荐

  1. 注册COMDLG32.OCX方法

    1.将下载的comdlg32.ocx文件拷贝到C:\Windows\SysWOW64(32位电脑为C:\Windows\System32)文件夹中. 2.按win+x打开快捷命令选项菜单: 再按“A” ...

  2. iOS分类底层实现原理小记

    摘要:iOS分类底层是怎么实现的?本文将分如下四个模块进行探究分类的结构体编译时的分类分类的加载总结本文使用的runtime源码版本是objc4-680文中类与分类代码如下//类@interfaceP ...

  3. IDA Pro安装教程

    1.下载 http://tools.pediy.com/windows/disassemblers.htm 我们这里选择6.8版本下载 2.安装 打开下载的安装包,解压出来进入IDAPro68文件夹, ...

  4. IO模型--阻塞IO,非阻塞IO,IO多路复用,异步IO

    IO模型介绍: * blocking IO 阻塞IO * nonblocking IO 非阻塞IO * IO multiplexing IO多路复用 * signal driven IO 信号驱动IO ...

  5. 阶段01Java基础day21IO流02

    21.01_IO流(字符流FileReader) 1.字符流是什么 字符流是可以直接读写字符的IO流 字符流读取字符, 就要先读取到字节数据, 然后转为字符. 如果要写出字符, 需要把字符转为字节再写 ...

  6. centos打开matlab的正确姿势

    进入usr/local/MATLAB/R2015b/bin ./matlab

  7. React项目新手指南

    对于程序员而言:驼峰和下划线之间是一场宗派战争:大括号是否换行会成为一种党派:逗号写在行尾还是行首的人来自不同星球…… 然而,无规矩不成方圆,任何一个团队,要想有高质量的产出,第一步必须要对一些基本的 ...

  8. while +for+字符串

    # while 循环嵌套# user_from_db='egon'# pwd_from_db='123'# while True:# usr_inp=input('username>>&g ...

  9. THML

    结构<!DOCTYE html> <html> <head> <meta   charset="UTF-8> <titie>< ...

  10. python接口自动化测试(一)-request模块

    urllib.request模块是python3针对处理url的. 1. 首先导入: from urllib import request 2. 构造url,构造url的headers信息和传参[re ...