使用 extjs 中的日期选择器在 table 中搜索数据

Question

我创建了一个 table，我需要在其中使用日期对值进行排序，因此我使用了 datepicker 但它无法使用如何使用日期选择器。
确切的输出是 if i select the date "17-09-01" 我需要获取具有这些日期的列。一旦我在文本框上给出了一些日期，我需要根据文本框值从所有列中过滤相关记录。你能告诉我如何实现吗？我需要做什么改变？您可以在 Fiddle

查看我的代码

Answer 1

试试这个，您可以使用日期、姓名和电子邮件 ID 进行搜索

在下面的代码中，您要添加 gridfilters 插件。

 items: [{
        xtype: 'grid',
        title: 'Sample Data',
        itemId: 'myGridItemId',
        flex: 1.2,
        plugins: 'gridfilters',
        margin: '0 10 0 0',
        bind: {
            store: '{mystore}',
            selection: '{users}'
        },

 columns: [{
             text: 'Name',
            dataIndex: 'name',
             flex: 0.5,
                filter: {
           type: 'string', 
            itemDefaults: {

             }
         }
         }, {
            text: 'Email',
             dataIndex: 'email',
             flex: 1,
                filter: {
             type: 'string',
             itemDefaults: {

             }
        }
               },{
                type: 'Date',
            text: 'Date',
                dataIndex: 'date',
                flex: 2,
                filter: {
             type: 'string', 
             itemDefaults: {

             }
         }
              }]

Answer 2

我对您的代码进行了以下更改以使其正常工作。

在模型中，使用 dateFormat 正确指定 date 字段。

                {
                    name: 'date',
                    type: 'date',
                    dateFormat: 'y-m-d'
                }

在网格中，最好使用 datecolumn 和 format 属性。

         {
            //Use xtype datecolumn for dates and specify the format
            xtype: 'datecolumn',
            text: 'Date',
            dataIndex: 'date',
            flex: 2,
            format: 'y-m-d'
        }

避免在商店中使用 storeId，尽管您没有指定它但试图通过它检索商店。

        handler: function (picker, date) {
          //var store = Ext.getStore('storeId');
          var store = picker.up('#myGridItemId').getStore();
          // clear current filters
          store.clearFilter();
         // filter store
         var date = Ext.first('#selectedDate').getValue();
         store.filter("date", date);
        }

这是 modified 代码。阅读我的评论了解更多。

使用 extjs 中的日期选择器在 table 中搜索数据

Search a data in table using datepicker in extjs

extjs

extjs4

extjs4.2