Блог

У меня есть две сетки с одинаковыми записями, но разными хранилищами.

В принципе, если запись A выбрана в сетке A, я хочу отключить флажок для записи A в сетке B.

Я знаю, что могу прослушать событие «beforeselect» в любой сетке, например, в сетке A, но тогда как бы я «получил» записи из сетки B? Как только у меня будут ссылки, я могу проверить, выбран он или нет, тогда я могу включить / отключить флажок для другой сетки, просто вернув true / false .

Спасибо

Хорошо, я закончил тем, что сделал checkcolumn, поскольку это было проще сделать в строковом коде. Вы можете добавить этот код в fiddle.sencha.com и это сработает.

Панель 1 в примере — это та, которую вы можете проверить, и она вернет значения Panel1 и сравнит их с Panel2 и укажет, является ли значение проверки для обоих. Затем вы можете делать все, что захотите.

Если вы выполнили маршрут модели выбора, вы бы поместили функцию изменения в контроллер, а в функции просто сделайте что-то вроде:

 var gridSelected = Ext.ComponentQuery.query('panel1')[0].getSelectionModel().getSelection();
 Ext.each(gridSelected, function (value) {
 //something
 }
 

Ниже приведен встроенный код:

 Ext.onReady(function() {
var locationStore = Ext.create('Ext.data.Store', {
    fields: ['id', 'location', 'check'],
    proxy: {
        type: 'memory'
    },
    data: [{
        id: 1,
        location: 'location 1',
        check: false
    }, {
        id: 2,
        location: 'location 2',
        check: false
    }, {
        id: 3,
        location: 'location 3',
        check: false
    }, {
        id: 4,
        location: 'location 4',
        check: false
    }, {
        id: 5,
        location: 'location 5',
        check: false
    }]
});

 var locationStore2 = Ext.create('Ext.data.Store', {
    fields: ['id', 'location', 'check'],
    proxy: {
        type: 'memory'
    },
    data: [{
        id: 1,
        location: 'location 1',
        check: false
    }, {
        id: 2,
        location: 'location 2',
        check: false
    }, {
        id: 3,
        location: 'location 3',
        check: false
    }, {
        id: 4,
        location: 'location 4',
        check: false
    }, {
        id: 5,
        location: 'location 5',
        check: false
    }]
});

Ext.create('Ext.grid.Panel', {
    renderTo: Ext.getBody(),
    xtype: 'panel1',
    height: 200,
    width: 350,
    store: locationStore,
    columns: [{
        text: 'ID',
        dataIndex: 'id'
    }, {
        text: 'Location',
        dataIndex: 'location',
        flex: 1,

    },{
            xtype: 'checkcolumn',
            header: 'Check',
            dataIndex: 'check',
            width: 90,
            listeners: {
                checkchange: function (column, recordIndex, checked) {
                var view = panel2.getView(),
                record = view.getRecord(view.getNode(recordIndex));
                var p1ID = record.get('id');
                var p1Check = checked;
                    Ext.each(locationStore2.data.items, function (value)
                             {
                                var p2ID = value.data.id;
                                var p2Check = value.data.check;

                                 if (p1ID == p2ID){
                                 //here we output the results and you could also do something here.
                                 console.log(p1ID, p1Check, p2ID, p2Check);
                                 }
                             })   

            }
        }
    }]
});

   var panel2 =  Ext.create('Ext.grid.Panel', {
    renderTo: Ext.getBody(),
    xtype: 'panel2',
    height: 200,
    width: 350,
    store: locationStore2,
    columns: [{
        text: 'ID',
        dataIndex: 'id'
    }, {
        text: 'Location',
        dataIndex: 'location',
        flex: 1,

    },{
            xtype: 'checkcolumn',
            header: 'Check',
            dataIndex: 'check',
            width: 90,
            listeners: {
                checkchange: function (column, recordIndex, checked) {
                var view = panel2.getView(),
                record = view.getRecord(view.getNode(recordIndex));
                console.log(record.get('id'));

            }
        }
        }]
});



});
 

Спасибо за ваш ответ, Джесси. Я придумал это, на самом деле это было довольно просто. Я прослушал событие «beforeselect» на обеих сетках в контроллере:

 //beforeselect handler
gridAHandler: function (grid, rec) {

  var gridBSelections = this.getGridB().getSelectionModel().getSelection();
  for(var i = 0; i<gridBSelections.length; i  ) {
    if(rec.get("NAME") == gridBSelections[0].data.NAME) {
      return false;
    }
  }
}
 

Итак, если я пойду, чтобы сделать выбор в gridA, цикл for проверит, был ли выбран соответствующий столбец в gridB. Если он выбран, он будет в массиве gridBSelections, поэтому ИМЯ сетки будет равно ИМЕНИ gridB (столбцы ИМЕН в обеих сетках имеют одинаковые значения), поэтому я возвращаю false;

конечно, обработчик для gridB будет точно таким же, но с противоположными значениями.«

разместил это как другое решение для тех, у кого такая же проблема.

спасибо