ExtJS 4: сетка: как выбрать вновь созданную запись?

Question

У меня такой простой вопрос, он в названии!

Вот мой код:

userCreate: function(button) {
    var grid = button.up('panel'),
        store = grid.getStore();

    /* Create new empty record */
    var inst = store.add({})[0];
    store.sync();
    /* select the newly created record */
    grid.getSelectionModel().select(inst.id);

    Ext.create('GS.view.user.Edit', { create:true }); 
},  

Теперь я просто хочу, чтобы после

    /* select the newly created record */

была строкаработа!

Я пробовал много вещей, но ни одна из них не работает:

    grid.getSelectionModel().select(inst.id);
    grid.getSelectionModel().select(inst);
    grid.getSelectionModel().select(store.last);

Есть идеи?

Большое спасибо

Answer 1

Вот что я нашел: ExtJS, кажется, теряется, когда нет поля «id».Таким образом, после вызова sync(), если вы не указали поле «id», оно как бы реорганизует сетку и не может найти «старую» запись (ту, которую я запомнил непосредственно перед вызовом).Это только то, что, я думаю, я могу ошибаться.

В любом случае, я сделал поворот: чтобы остаться "однородным", я собираюсь сделать xxxCreate() и xxxCreateValidate(), то же самое дляxxxUpdate() и xxxUpdateValidate().Я сделал их для примера: user => userCreate(), userCreateValidate(), userUpdate() и userUpdateValidate():

init: function () {
    this.control({
        /* (!) Actions in 'userlist' */
        'userlist': {
            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
        }   
    }); 
},  

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();
},

Я надеюсь, что мой код поможет кому-то ... теперь яищу способ обработки ключей в сетке.И, как и все с ExtJS: вы не тратите свое время на кодирование, потому что все уже сделано, вы тратите свое время на поиск ... это на самом деле более неприятно =)

В любом случае, самое важное, на что следует обратить внимание, это то, что добавленная запись не выбрана .Это просто обходной путь для продолжения разработки, но это не то, что я хотел (это не совсем то, о чем я спрашиваю в вопросе).

Answer 2

как то, что сказал @Tom ... используйте сетку, чтобы выбрать новую запись, althougt
Вы все еще можете выбрать новую запись с помощью модели выбора ...

из документов .. для выбора метода требуется 3 параметра для передачи ..
так в вашем случае:

userCreate: function(button) {
    var grid = button.up('panel');
    store = grid.getStore();

    /* Create new empty record */
    var inst = store.add({})[0];
    store.sync();

    /* select the newly created record via model*/
    grid.getSelectionModel().select(inst, true, true);

    /* select the newly created record via view*/
    grid.getView().select(inst, true, true);

    Ext.create('GS.view.user.Edit', { create:true }); 
},

Answer 3

Вы можете просто использовать так:

grid.getSelectionModel().select(store.data.length-1)

Answer 4

Я думаю, что проблема здесь в том, что вы пытаетесь выбрать запись сразу после вызова store.sync();, но на самом деле это асинхронный запрос, который обновляет хранилище после получения данных с сервера.

Попробуйте позвонить grid.getSelectionModel().select после обновления вашего магазина с сервера. Проблема с этим подходом заключается в том, что store.sync не поддерживает какой-либо метод обратного вызова, но вы должны иметь возможность использовать событие datachanged в вашем хранилище, которое должно быть запущено после полной синхронизации хранилища.

Попробуйте что-то вроде этого (на основе предоставленного вами примера кода):

userCreate: function(button) {
    var grid = button.up('panel'),
        store = grid.getStore();

    /* Create new empty record */
    var inst = store.add({})[0];

    store.on('datachanged', function() {
        /* select the newly created record, keep existing selection and
           don't suppress events because grid view is updating upon this event
        */
        grid.getSelectionModel().select(inst, true, false);
        Ext.create('GS.view.user.Edit', { create:true }); 
    });

    store.sync();
},

Answer 5

Я не знаю никакой возможности напрямую выбрать эту запись, потому что перед синхронизацией эти записи являются фантомной записью в хранилище, но не после. Кроме того, вы можете назначить ему идентификатор на стороне сервера (?), Который изменит запись, и она не будет такой же после sync () ...

Если какое-то поле в записи должно быть уникальным (например, имя или описание или что-то еще), вы можете использовать это, чтобы найти эту запись после синхронизации и выбрать ее:

var value = store.getAt(0).get('name');           // getting the value of a unique field e.g. "name" from the newly added record

store.sync();

var rec = store.findRecord("name", value);   // find the record with the unique value "name" after sync
grid.getSelectionModel().select(rec);       // select that record

Answer 6

Ваш пример работает нормально при использовании grid.getSelectionModel().select(inst);. Так что единственное, что может вызвать такое поведение - это store.sync(); исключение. Проверьте вывод консоли на наличие ошибок.

Answer 7

Выбор строки сетки обычно обрабатывается в объекте View (в ExtJS 3 это был GridView).Поэтому я думаю, что если вы обновите свой код выше, чтобы он выглядел следующим образом:

grid.getView (). Select (0);

Это выберет строку с индексом 0, которая выглядит как место, где вы добавляете новую запись.Объект View затем уведомит модель выбора и обновит представление браузера.Есть и другие варианты выбора, которые вы можете найти в документации по API на http://docs.sencha.com/ext-js/4-0/#/api/Ext.grid.View-method-select