前段做报表,要按年月统计结果,之前的报表用的都是这种年月选择框:

,这在弹框里很难看,我在网上查找了很多资料,找到了别人重写的datepicker方法,开始测试没发现什么问题,后来再上线后发现只要到月底,选择偶数月份失去焦点时,输入框里的月份会自动加1,别人数这是extjs的bug,但是总不能因为是bug就不做吧,后来终于在网上查找到了插件代码,才搞定:

1:ext3版本插件

插件代码:

Ext.ux.MonthPickerPlugin = function() {

var picker=null;

var oldDateDefaults=null;

this.init = function(pk) {

picker = pk;

picker.onTriggerClick = picker.onTriggerClick.createSequence(onClick);

picker.getValue = picker.getValue.createInterceptor(setDefaultMonthDay).createSequence(restoreDefaultMonthDay);

picker.beforeBlur = picker.beforeBlur.createInterceptor(setDefaultMonthDay).createSequence(restoreDefaultMonthDay);

};

function setDefaultMonthDay() {

oldDateDefaults = Date.defaults.d;

Date.defaults.d = 1;

return true;

}

function restoreDefaultMonthDay(ret) {

Date.defaults.d = oldDateDefaults;

return ret;

}

function onClick(e, el, opt) {

var p = picker.menu.picker;

p.activeDate = p.activeDate.getFirstDateOfMonth();

if (p.value) {

p.value = p.value.getFirstDateOfMonth();

}

p.showMonthPicker();

if (!p.disabled) {

p.monthPicker.stopFx();

p.monthPicker.show();

// if you want to click,you can the dblclick event change click

p.mun(p.monthPicker, 'click', p.onMonthClick, p);

p.mun(p.monthPicker, 'click', p.onMonthDblClick, p);

p.onMonthClick = p.onMonthClick.createSequence(pickerClick);

p.onMonthDblClick = p.onMonthDblClick.createSequence(pickerDblclick);

p.mon(p.monthPicker, 'click', p.onMonthClick, p);

p.mon(p.monthPicker, 'click', p.onMonthDblClick, p);

}

}

function pickerClick(e, t) {

var el = new Ext.Element(t);

if (el.is('button.x-date-mp-cancel')) {

picker.menu.hide();

} else if(el.is('button.x-date-mp-ok')) {

var p = picker.menu.picker;

p.setValue(p.activeDate);

p.fireEvent('select', p, p.value);

}

}

function pickerDblclick(e, t) {

var el = new Ext.Element(t);

if (el.parent()

&& (el.parent().is('td.x-date-mp-month')

|| el.parent().is('td.x-date-mp-year'))) {

var p = picker.menu.picker;

p.setValue(p.activeDate);

p.fireEvent('select', p, p.value);

}

}

};

Ext.preg('f-monthPickerPlugin', Ext.ux.MonthPickerPlugin);

使用:

new Ext.form.DateField({

renderTo: document.body,

plugins:'monthPickerPlugin',

name:'month',

format: 'Y-m'

});

效果:

/**

*通用JS 同步ajax调用 返回json Object

*

* @param {}

*            urlStr

* @param {}

*            paramsStr 为字符串键值对形式“key=value&key2=value2”

* @return {} 返回json Object

*/

function ajaxSyncCall(urlStr, paramsStr) {

var obj='';

if (window.ActiveXObject) {

obj = new ActiveXObject('Microsoft.XMLHTTP');

} else if (window.XMLHttpRequest) {

obj = new XMLHttpRequest();

}

obj.open('POST', urlStr, false);

obj.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

obj.send(paramsStr);

var result = Ext.util.JSON.decode(obj.responseText);

return result;

}

calendar控件使用 extjs_extjs年月选择日历及通用js同步ajax调用返回json object相关推荐

  1. calendar控件使用 extjs_ExtJs定制日历控件——自动加载更新(日历控件显示)

    将定制的日历控件放到一个Panel里显示,其结构如下: , { border: true, id: 'page', animCollapse : true, width: 1050, height: ...

  2. ASP.NET 在vs中使用Calendar控件 制作一个日历 并标注节假日

    Calendar控件 Calendar控件可以说用户方便.准确地选择日期或查看与日期相关的数据.当创建Calendar控件中的每个日期单元格均会引发DayRender事件,通过DayRender事件的 ...

  3. ExtJS 日历Calendar 控件 使用

    ExtJS6 提供了日历控件,但是官网的demo贼坑,只讲了ajax使用,经过不懈努力地,无头苍蝇式尝试,终于摸到了使用门槛. 首先 在具体项目里,引用calendar的包. 其次 设定好calend ...

  4. 日历控件的android代码,Android日历控件PickTime代码实例

    Android日历控件PickTime代码实例 发布时间:2020-10-03 16:05:51 来源:脚本之家 阅读:86 作者:手撕高达的村长 最近做项目,需要设置用户的生日,所以做这样一个功能. ...

  5. vs2010中Calendar控件的一些使用

    一.返回指定日期前后的某一日期; // Sets a DateTime to April 3, 2002 of the Gregorian calendar.       DateTime myDT ...

  6. vant 2 Calendar控件IOS下空白

    今天写代码发现 vant2 Calendar控件的一个BUG. 具体体现为在IOS的真实手机上,某些机型打开后日历显示一片空白,拖动一下就又恢复了正常显示出来了. 使用了解决办法模拟滚动下.关键是时机 ...

  7. ASP.NET Calendar 控件

    ASP.NET Calendar 控件 http://www.w3school.com.cn/aspnet/control_calendar.asp 转载于:https://www.cnblogs.c ...

  8. WPF- 关于自定义Calendar控件

    由于项目对更改日期 时间的需要,接触了一下Calendar控件.结果发现在这么强大的控件的背后,微软其实并没有为开发人员留有很强的扩展性. (项目要求的Calendar控件能对一些特定的日期进行特殊处 ...

  9. 动态生成表格呈现还是将表格直接绑定gridview等控件呈现的开发方式选择依据...

    动态生成表格呈现还是将表格直接绑定gridview等控件呈现的开发方式选择依据:由存储过程决定,如果编写的存储过程可以生成需要呈现的表格则直接绑定,否则要动态生成表格 转载于:https://www. ...

最新文章

  1. 分享丨李飞飞、吴恩达、Bengio等人的顶级深度学习课程
  2. GraphPad Prism 9 如何一次处理多张图表?
  3. LeetCode 2119. 反转两次的数字
  4. R循环有两个_循环子群
  5. 恒大汽车自救进行时:恒驰5进入试产阶段,离量产只差道路准入许可
  6. C语言 pthread_cancelpthread_detach
  7. CentOS 7 上安装 Redis3.2.3 并开启外网访问
  8. 14-模板方法模式Quarkus实现
  9. xshell 执行脚本API介绍(附带xsh的python包)
  10. RISCV toolchain编译工具链搭建
  11. C语言初阶:define定义的常量和宏,关于指针的详细讲解,初步认识结构体的使用
  12. 影视剪辑,如何一个人自学短视频7天vlog教程
  13. 南京那边可以学计算机绘画,电脑画画软件有哪些?推荐几款可以教画画的app
  14. 阿里云服务器建站教程(5分钟网站上线)
  15. js点击图片变化成另一个图片
  16. Machine Learning:支持向量机通俗导论(理解SVM的三层境界)
  17. 使用Superset创建数据分析图表
  18. aspcms留言增加防刷新验证,单一ip留言条数限制,防止恶意刷新及恶意提交。
  19. 第六章JVM虚拟机字节码执行引擎——类文件和类加载之前必看
  20. FFMpeg 实现视频解码、编码、转码流程详解

热门文章

  1. 面向项目(二)—— visual studio 的使用
  2. Tricks(三十六)—— remove_list_entry(无需 if 逻辑)
  3. STL 中的容器们 (二)
  4. C++基础::拾遗琐碎
  5. typescript 怎么表示当前时间减一个月_吃什么减肚子最快最有效 4种刮油食物吃出小蛮腰...
  6. 编程语言python入门-手把手教你从零开始用Python语言写爬虫程序
  7. python代码写好了怎么运行-教你如何编写、保存与运行 Python 程序
  8. python自学行吗-《》 python自学行吗?
  9. 语音识别系统市场前景及发展趋势
  10. RocketMQ 延时消息的使用和延时级别的配置