ExtJS 4及其新MVC：grid：如何处理键？ [英] ExtJS 4 and its new MVC: grid: how to handle keys?

问题描述

我正在寻找一种方法来处理网格中的键。
我已经密切关注了这些例子：
http://www.sencha.com/learn/architecting-your-app-in-ext-js-4-part-1
http://www.sencha.com/learn/architecting- your-app-in-ext-js-4-part-2

http://www.sencha.com/learn/the-mvc-application-architecture/

I'm looking for a way to handle the key in the Grid. I've closely followed the examples here: http://www.sencha.com/learn/architecting-your-app-in-ext-js-4-part-1 http://www.sencha.com/learn/architecting-your-app-in-ext-js-4-part-2
http://www.sencha.com/learn/the-mvc-application-architecture/

所以现在一切工作正常，但我想处理我的网格中的键。

So now everything works fine, but I'd like to handle keys in my Grid.

所以我猜在声明 this.control（{}） 我应该添加关于 userlist 的另一个事件，但是似乎Grid没有keypress事件。

So I guess in the declaration "this.control({})" I should just add another event concerning userlist but it seems Grid don't have the "keypress" event.

任何想法我应该怎么做（另外我应该怎么做新的MVC模式）？

Any idea how I should do (moreover how I should do with the new MVC pattern)?

Ext.define('GS.controller.Users', {

    extend: 'Ext.app.Controller',

    models: [
        'User'
    ],

    stores: [
        'Users'
    ],  

    views: [
        'user.List',
        'user.Edit'
    ],  

    init: function () {
        this.control({
            /* (!) Actions in 'userlist' */
            'userlist': {
                selectionchange: this.userListSelectionChange,
                itemdblclick: this.userEdit
            },  
            'userlist button[action=create]': {
                click: this.userCreate
            },  
            'userlist button[action=delete]': {
                click: this.userDelete
            },  
            /* (!) Actions in 'useredit' */
            'useredit button[action=create]': {
                click: this.userCreateValidate
            },  
            'useredit button[action=save]': {
                click: this.userEditValidate
            }   
        }); 
    },  

    userListSelectionChange: function(grid, selections, options) {
        var panel = grid.view.up('panel'),
            button = panel.down('button[action=delete]');

        button.setDisabled(selections.length === 0); 
    },  

    userCreate: function(button) {
        /* Using Ext.create() to pass variable create:true
         * instead of the shortcut:
         * var view = Ext.widget('useredit');
         */
        var view = Ext.create('GS.view.user.Edit', {
            create:true
        }); 
    },  

    userCreateValidate: function(button) {
        var win    = button.up('window'),
            form   = win.down('form'),
            values = form.getValues();

        this.getUsersStore().add(values);
        this.getUsersStore().sync();
        win.close();
    },  

    userEdit: function(grid, record) {
        var view = Ext.widget('useredit');
        view.down('form').loadRecord(record);
    },  
    userEditValidate: function (button) {
        var win    = button.up('window'),
            form   = win.down('form'),
            record = form.getRecord(),
            values = form.getValues();

        record.set(values);
        win.close();
        this.getUsersStore().sync();
    },

    userDelete: function(button) {
        var panel     = button.up('panel'),
            selection = panel.getSelectionModel().getSelection()[0];

        if (selection) {
            var store = this.getUsersStore();
            store.remove(selection);
            store.sync();
        }
    }
});

推荐答案

定义启动中的.sencha.com / ext-js / 4-0 /＃/ api / Ext.util.KeyMaprel =noreferrer> KeyMap（s）：function（） {...} 。创建视图后。

Define KeyMap(s) in your launch: function() {...} right after you create the view.

这篇关于ExtJS 4及其新MVC：grid：如何处理键？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！