ExtJS自定义gridfilter的日期时间
ExtJS custom gridfilter for datetime
我正在制作一个自定义日期时间过滤器,因为Ext的日期时间过滤器不是很好。我有一个日期时间字段:一个日期字段和时间字段在一个字段容器有值…
我扩展了Ext.ux.grid.filter.Filter
并构建了我的过滤器,就像日期过滤器一样。
fieldCfg = Ext.apply(me.fieldOpts, {
xtype: 'datetimefield',
overflowX: 'visible',
format: me.format,
});
fields = {};
for (i = 0, len = me.menuItems.length; i < len; i++) {
item = me.menuItems[i];
if (item !== '-') {
cfg = {
itemId: 'range-' + item,
text: me[item + 'Text'],
menu: Ext.create('Ext.menu.Menu', {
plain: true,
items: [
Ext.apply(fieldCfg, {
itemId: item,
margin: '2 10 2 2',
overflowX: 'visible'
})
],
}),
listeners: {
scope: me,
checkchange: me.onCheckChange,
render: function (t){
var dtf = t.menu.items.items[0];
var df = dtf.getDateField();
var tf = dtf.getTimeField();
df.on("select", me.selectDateEvent, me)
tf.on("select", me.selectDateEvent, me)
},
}
};
item = me.fields[item] = Ext.create('Ext.menu.CheckItem', cfg);
}
me.menu.add(item);
}
me.values = {};
下面是filter的value函数:
selectDateEvent: function (t) {
if(t.ownerCt.getValue() !== undefined){
var date = Ext.Date.format(t.ownerCt.getValue(), format);
this.values[t.ownerCt.itemId] = date;
this.fireEvent('update', this);
this.onMenuSelect(t.ownerCt, date);
}
},
下面是其他处理程序的代码:
onCheckChange: function(item, checked) {
var me = this,
picker = item.menu.items.items[0],
itemId = picker.itemId,
values = me.values;
if (checked) {
values[itemId] = picker.getValue();
} else {
delete values[itemId]
}
me.setActive(me.isActivatable());
me.fireEvent('update', me);
}
onMenuSelect: function(picker, date) {
var fields = this.fields,
field = this.fields[picker.itemId];
field.setChecked(true);
if (field == fields.on) {
fields.before.setChecked(false, true);
fields.after.setChecked(false, true);
} else {
fields.on.setChecked(false, true);
if (field == fields.after && this.getFieldValue('before') < date) {
fields.before.setChecked(false, true);
} else if (field == fields.before && this.getFieldValue('after') > date) {
fields.after.setChecked(false, true);
}
}
this.fireEvent('update', this);
picker.up('menu').hide();
}
但是它不过滤网格的数据。我怎样才能让它工作呢?我做错了什么?
如果您的商店在客户端进行了过滤,则需要实现validateRecord
方法。
相关文章:
- 更改angularjs中的日期-时间格式
- 将日期时间作为 JSON 发送将无法在我的视图中正确显示
- 将日期时间从json转换为可读格式
- 使用时刻.js从日期时间中提取时间
- 两个日期时间选择器
- Javascript:如何在onChange事件期间更改日期时间值
- .Net webApi ISO日期时间和IE8
- Javascript-如何使用bootstrap日期时间选择器自动计算两个时间输入之间的差异
- 转换日期时间格式
- 在JavaScript中转换日期/时间格式
- JavaScript JSON关联对象键和值都作为日期时间戳
- 将日期时间javascript绑定到表列
- 将JS日期解析为C#日期时间
- 使用JavaScript将客户端日期/时间字符串转换为JSON日期/时间串
- 从javascript数组获取php的日期时间
- 格式化momentjs日期时间
- 这个正则表达式的日期/时间有什么问题
- Mongoose查询在两个日期时间之间提取数据
- 当转换为Python日期时间时,Node的时间戳落后3分钟
- 自定义angularjs过滤器日期时间格式额外字符