0

我有一个网格。当我添加新的行脚本时,它会自动以“Ymd”格式放置日期并且工作正常,Ext JS 会自动以“2017-06-24”(“Ymd”)格式发送到服务器日期。但是当我更新这个日期时,Ext JS 以格式发送到服务器日期2017-06-24T00:00:00。怎么了?更新后帮我发送到服务器“2017-06-24”日期(“Ymd”)。

Ext.require(['Ext.data.*', 'Ext.grid.*']);


    // Создаем model
    Ext.define('Users', {
        extend: 'Ext.data.Model',
        //idProperty: 'id',
        fields: [{
                name: 'id',
                type: 'int'
            }
        ]
    });

    Ext.onReady(function() {
        // Создаем store
        var store = Ext.create('Ext.data.Store', {
                autoLoad: true,
                autoSync: true,
                model: 'Users',
                proxy: {
                    type: 'ajax',
                    url: 'server.php',
                    api: {
                        create: 'server.php?action=create',
                        read: 'server.php?action=read',
                        update: 'server.php?action=update',
                        destroy: 'server.php?action=delete'
                    },
                    reader: {
                        type: 'json',
                        rootProperty: 'data'
                    },
                    writer: {
                        type: 'json',
                        encode: true,
                        rootProperty: 'dataUpdate',
                        allowSingle: false,
                        writeAllFields: true,
                        //root:'records'
                    },
                    actionMethods: {
                        create: 'GET',
                        read: 'GET',
                        update: 'GET',
                        destroy: 'GET'

                    }
                },
                listeners: {
                    write: function(store, operation) {
                        var record = operation.getRecords()[0],
                            name = Ext.String.capitalize(operation.action),
                            verb;


                        if (name == 'Destroy') {
                            verb = 'Destroyed';
                        } else {
                            verb = name + 'd';
                        }
                        //Ext.example.msg(name, Ext.String.format("{0} user: {1}", verb, record.getId()));

                    }
                }
            }


        );

        var grid = Ext.create('Ext.grid.Panel', {
            renderTo: document.body,
            //plugins: [rowEditing],
            // Редактирование
            plugins: {
                ptype: 'cellediting',
                clicksToEdit: 1
            },
            listeners: {
                edit: function() {

                }
            },
            width: 1000,
            height: 330,
            frame: true,
            title: 'Users',
            store: store,
            iconCls: 'icon-user',
            columns: [{
                    text: 'id',
                    width: 50,
                    sortable: true,
                    dataIndex: 'id',
                    renderer: function(v, meta, rec) {
                        return rec.phantom ? '' : v;
                    }
                },
                {
                    header: 'Дата',
                    width: 70,
                    // sortable: true,
                    dataIndex: 'date',
                    renderer: Ext.util.Format.dateRenderer('d/m/Y'),
                    editor: {
                        completeOnEnter: false,
                        field: {
                            xtype: 'datefield',
                            dateFormat: 'd/m/Y',
                            allowBlank: false
                        }
                    }
                },
                {
                    header: 'Время начала',
                    width: 120,
                    // sortable: true,
                    dataIndex: 'time_start',
                    //format: 'H:i',
                    // Нужно для верного отображеия времени после редактирования в таблице
                    renderer: Ext.util.Format.dateRenderer('H:i'),
                    editor: {
                        completeOnEnter: false,
                        field: {
                            xtype: 'timefield',
                            format: 'H:i',
                            //name: 'timeStart1',
                            //fieldLabel: 'Time In',
                            minValue: '8:00',
                            maxValue: '20:00',
                            increment: 30,
                            anchor: '100%',
                            allowBlank: false
                        }
                    }
                }

            ],
            dockedItems: [{
                xtype: 'toolbar',
                items: [{
                    text: 'Add',
                    iconCls: 'icon-add',
                    handler: function() {
                        // Создаем новую задачу
                        // Для корректной работы с БД нужно задать ID новой строки, равной +1 от последней ID из таблицы.
                        var rec = new Users();
                        //console.log (x);("rec data= " + rec.id + " -- " + rec.data.id);
                        var idArr = grid.store.data.items;
                        var idValue = [];
                        for (var i = 0; i < idArr.length; i++) {
                            idValue.push(idArr[i].id);
                        }
                        idValue.sort(function(a, b) {
                            return a - b;
                        });
                        var maxId = idValue[idValue.length - 1];
                        console.log(maxId);
                        rec.id = maxId + 1;
                        rec.data.id = maxId + 1;

                        rec.date = Ext.Date.format(new Date(), 'Y-m-d');
                        rec.data.date = Ext.Date.format(new Date(), 'Y-m-d');

                        rec.time_start = Ext.Date.format(new Date(), '2008-01-01\\TH:i:s');
                        rec.data.time_start = Ext.Date.format(new Date(), '2008-01-01\\TH:i:s');
                        store.insert(0, rec);
                        //store.add(rac);
                        //grid.getView().refresh();
                        // rowEditing.startEdit(rec, 0);
                    }
                }, '-', {
                    itemId: 'delete',
                    text: 'Delete',
                    iconCls: 'icon-delete',
                    disabled: false,
                    handler: function() {
                        var selection = grid.getView().getSelectionModel().getSelection()[0];
                        if (confirm('Вы действительно хотите удалить задачу №' + selection.id + " ?")) {
                            // Удлаяем      
                            if (selection) {
                                store.remove(selection);
                            }
                        }
                    }
                }]
            }]
        });
    });
4

3 回答 3

0

dateWriteFormat: "Y-m-d"在我的模型中使用它,它可以完美地将美国经典日期发送到我的 postgres 后端。

于 2017-06-29T10:04:55.297 回答
0

您在这里使用模型。在该模型上,您有一个fields配置,您可以在其中定义哪些字段包含哪些数据类型,如果是日期,应该以哪种格式提交给服务器。

fields:[{
    name: 'id',
    type: 'int'
},{
    name: 'date',
    type:'date',
    dateFormat:'Y-m-d'
}]

此外,我在您的代码中看到了其他一些危险信号:

  • 不要使用record.date =record.data.date =设置记录上的日期。
  • Date.format()除非绝对必要,否则不要格式化日期。在内部,您应该始终使用 javascript 日期,而不是字符串。xtype:'gridcolumn'在您的网格中使用适当的格式(例如)format:'d/m/Y'进行显示。

因此,例如,当以编程方式更新现有记录或创建新的网格行或存储外部的新记录时,请使用record.set('date', new Date());orstore.add({date:new Date()})Ext.create('Users',{date: new Date()})

于 2017-06-28T13:30:01.133 回答
0

datefieldxtype 有一个配置,您可以在submitFormat其中指定要提交给服务器的日期格式字符串。

https://docs.sencha.com/extjs/6.2.0/classic/Ext.form.field.Date.html#cfg-submitFormat

更新:正如 Selmaril 在评论中提到的,这进入了您定义日期字段的部分。

                {
                    header: 'Дата',
                    width: 70,
                    // sortable: true,
                    dataIndex: 'date',
                    renderer: Ext.util.Format.dateRenderer('d/m/Y'),
                    editor: {
                        completeOnEnter: false,
                        field: {
                            xtype: 'datefield',
                            dateFormat: 'd/m/Y',
                            submitFormat: 'd/m/Y'
                            allowBlank: false                                
                        }
                    }
                }
于 2017-06-24T23:36:05.177 回答