ExtJS-3, Ext.grid.GridPanel, флажки muti-row: как отправить все отмеченные элементы одновременно? - PullRequest
Новая
       19

ExtJS-3, Ext.grid.GridPanel, флажки muti-row: как отправить все отмеченные элементы одновременно?

1 голос
/ 21 января 2012

Я использую ExtJS3, и у меня есть Ext.grid.GridPanel, где каждая строка имеет флажок слева. Вверху есть две кнопки: «обновить» и «отправить». Я хочу иметь возможность выбрать несколько строк и отправить все из них одним нажатием кнопки отправки. Как и сейчас, когда я выбираю несколько строк и нажимаю «Отправить», он отправит первую, затем удалит этот элемент из сетки, и мне придется снова нажать «Отправить» (ранее проверенные строки все еще проверяются).

Как изменить следующий код, чтобы кнопка отправки отправляла все строки одновременно? 

var dataStore = new Ext.data.SimpleStore({   fields: [
        {name: 'node'},
        {name: 'ip'},
        {name: 'groups'}
        ]});
var checkBoxSelMod = new Ext.grid.CheckboxSelectionModel();
var dataGrid = new Ext.grid.GridPanel ({
renderTo: document.body,
   clickstoEdit: 2,
   selModel : checkBoxSelMod,
   xtype: 'grid',
   layout: 'fit',
   sm: new Ext.grid.CheckboxSelectionModel(),
   tbar: [
          {
          text: 'Refresh',
              icon:    '$nroot/includes/extjs3/resources/images/slate/button/table_refresh.png',
              cls: 'x-btn-text-icon',
              handler: function() {
              window.location = '$nroot/index.php/imaging/index';},
              scope: this,
              },
          {
          text: 'Submit Machine(s)',
              icon: '$nroot/includes/extjs3/resources/images/slate/button/table_add.png',
              cls: 'x-btn-text-icon',
              handler: function() {
              var sm = dataGrid.getSelectionModel();
              var sel = sm.getSelected();
              if (sm.hasSelection()) {


                Ext.Msg.show({
                  title: 'Image Machine?',
                      buttons: Ext.MessageBox.YESNO,
                      msg: 'Continue with imaging (no undo!) process for server: '+sel.data.node+'?',
                      fn: function(btn){
                      if (btn == 'yes'){
                        var conn = new Ext.data.Connection();
                        conn.request({
                          url: '$nroot/index.php/imaging/image/',
                              params: {
                            action: 'delete',
                                node: sel.data.node,
                                mgmtip: sel.data.ip
                                },                            
                              success: function(resp,opt) {
                              dataGrid.getStore().remove(sel);
                            },
                              failure: function(resp,opt) {
                              Ext.Msg.alert('Error','Unable to image server - check debug logs');
                            }
                          });
                      }
                    }
                  });
              }
            }
          }               
          ],
   store: dataStore,
   columns: [                  
             checkBoxSelMod,
             { id: 'node', header: "Node", width: 150, sortable: true, dataIndex: 'node'},
             { id: 'ip', header: "IP", width: 120, sortable: false, dataIndex: 'ip'},
             { id: 'groups', header: "Groups", width: 100, sortable: true, dataIndex: 'groups'},
             ],
   stripeRows: true,
   autoExpandColumn: 'node',
   listeners: { 
 render: function(){ this.store.loadData(dataList); }
     }      
})});

Когда я меняю код с getSelected на getSelections, он возвращает это при загрузке страницы: 

item type is invalid for AcceptItem action

Я не могу найти примеров, показывающих множественный выбор с submit для GridPanels. Есть ли один, на который я могу сослаться?

РЕДАКТИРОВАТЬ, основываясь на приведенных ниже решениях, я изменил код для работы следующим образом: 

              var sels = sm.getSelections();
              if (sels.length > 0) {
                var ips = [], nodes = [];
                Ext.each(sels, function(sel) {
                           ips.push(sel.get('ip'));
                           nodes.push(sel.get('node'));
                         });

                Ext.Msg.show({
                  title: 'Image Machine?',
                      buttons: Ext.MessageBox.YESNO,
                      msg: 'Continue with imaging (no undo!) process for servers: '+nodes.join(",")+'?',
                      fn: function(btn){
                      if (btn == 'yes'){
                        Ext.each(sels, function(sel) {
                                   var conn = new Ext.data.Connection();
                                   conn.request({
                                     url: '$nroot/index.php/imaging/image/',
                                         params: {
                                       node: sel.get('node'),
                                           mgmtip: sel.get('ip')
                                           },                            
                                         success: function(resp,opt) {
                                         dataGrid.getStore().remove(sel);
                                       },
                                         failure: function(resp,opt) {
                                         Ext.Msg.alert('Error','Unable to image server - check debug logs');
                                       }
                                     });
                                 })
                          }
                    }
                  });
              }
            }

1 Ответ

0 голосов
/ 21 января 2012

Самый простой подход - пройтись по выбранным записям и задать вопрос для каждой записи. 

var sels = sm.getSelections();
Ext.each(sels, function(sel) {
    var node = sel.get('node'),
        ip = sel.get('ip');
    Ext.Msg.show({
        title: 'Image Machine?',
        buttons: Ext.MessageBox.YESNO,
        msg: 'Continue with imaging (no undo!) process for server: '+node+'?',
        fn: function(btn){
            if (btn == 'yes'){
                var conn = new Ext.data.Connection();
                conn.request({
                    url: '$nroot/index.php/imaging/image/',
                    params: {
                        action: 'delete',
                        node: node,
                        mgmtip: ip
                    },                            
                    success: function(resp,opt) {
                        dataGrid.getStore().remove(sel);
                    },
                    failure: function(resp,opt) {
                        Ext.Msg.alert('Error','Unable to image server - check debug logs');
                    }
                });
            }
        }
    });
});

Однако пользователю может быть неудобно получать подсказку для каждой строки, выбранной вDataGrid.Но если ваш сервис ('$ nroot / index.php / imaging / image /') поддерживает публикацию нескольких элементов, вы можете попросить пользователя один раз и опубликовать все из них.Т.е. 

var sels = sm.getSelections();
if (sels.length > 0) {
    var ips = [], nodes = [];
    Ext.each(sels, function(sel) {
        ips.push(sel.get('ip'));
        nodes.push(sel.get('node'));
    });

    Ext.Msg.show({
        title: 'Image Machine?',
        buttons: Ext.MessageBox.YESNO,
        msg: 'Continue with imaging (no undo!) process for servers: '+nodes.join(",")+'?',
        fn: function(btn){
            if (btn == 'yes'){
                var conn = new Ext.data.Connection();
                conn.request({
                    url: '$nroot/index.php/imaging/image/',
                    params: {
                        action: 'delete',
                        nodes: nodes,
                        mgmtips: ips
                    },                            
                    success: function(resp,opt) {
                        Ext.each(sels, function() { dataGrid.getStore().remove(this) });
                    },
                    failure: function(resp,opt) {
                        Ext.Msg.alert('Error','Unable to image server - check debug logs');
                    }
                });
            }
        }
    });
}
...