Как настроить Ext.grid.plugin.Editable кнопки? - PullRequest
Новая
       49

Как настроить Ext.grid.plugin.Editable кнопки?

0 голосов
/ 18 декабря 2018

Мне требуется Ext.grid.plugin.Editable в моей сетке.Теперь я хочу изменить классы внутри панели по умолчанию, чтобы слайды могли редактироваться.Но я не понимаю, как мне управлять функцией отправки и удаления кнопки (например, я хочу определить POST для кнопки отправки). toolbarConfig - не работает 

Ext.define('Foresto.model.EditListRenters', {
  extend: 'Ext.grid.Grid',
  xtype: 'rentlist',
  requires: [ //some plugins and models
  ],
  frame: true,
  store: {
    model: 'Foresto.model.RentsListModel',
    autoLoad: true,
    pageSize: 0,
    proxy: {
      type: 'ajax',
      url: '/api/renter/',
      reader: {
        type: 'json',
        rootProperty: 'results'
      }

    }
  },
  plugins: [{
      type: //someplugins}
    ],
    /* toolbarConfig: {
    xtype:'titlebar',
    docked:'top',
    items:[{
    xtype:'button', // it is don't work
    ui:'decline',
    text:'decline',
    align: 'right',
    action:'cancel'
    }]
    }, */

    columns: [{
      text: 'id',

      dataIndex: 'id'
    }, {
      text: 'document',
      dataIndex: 'document',
      editable: true,
      flex: 1

    }, {
      text: 'document_num',
      dataIndex: 'document_num',
      editable: true
    }, {
      text: 'legal_type',
      dataIndex: 'legal_type',
      editable: true

    }, {
      text: 'fio_represent',
      dataIndex: 'fio_represent',
      editable: true
    }, {
      text: 'position_represent',
      dataIndex: 'position_represent',
      editable: true,
    }, {
      text: 'certificate',
      dataIndex: 'certificate',
      editable: true,
    }]
  });

1 Ответ

0 голосов
/ 19 декабря 2018

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

https://fiddle.sencha.com/#view/editor&fiddle/2ojt

// model
Ext.define('Fiddle.model.Document', {
    extend: 'Ext.data.Model',

    fields: [{
        name: 'id',
        type: 'int'
    }, {
        name: 'document',
        type: 'string'
    }, {
        name: 'type',
        type: 'string'
    }]
});

//view (grid)
Ext.define('Fiddle.view.DocumentGrid', {
    extend: 'Ext.grid.Panel',
    xtype: 'documentlist',

    store: {
        model: 'Fiddle.model.Document',
        data: [{
            id: 1,
            document: 'My First Doc',
            type: 'pdf'
        }, {
            id: 2,
            document: 'My Second Doc',
            type: 'pdf'
        }]
    },

    columns: [{
        text: 'id',
        dataIndex: 'id'
    }, {
        text: 'Document',
        dataIndex: 'document',
        flex: 1
    }, {
        text: 'Type',
        dataIndex: 'type',
    }]
});

var form = Ext.create('Ext.form.Panel', {
    title: 'Form',
    region: 'east',
    layout: {
        type: 'vbox',
        algin: 'stretch'
    },
    collapsible: true,
    bodyPadding: 10,
    hidden: true,
    items: [{
        xtype: 'textfield',
        name: 'document',
        fieldLabel: 'Document'
    }, {
        xtype: 'combo',
        name: 'type',
        fieldLabel: 'type',
        store: ['pdf', 'doc', 'docx', 'odf']
    }],
    buttons: [{
        text: 'Save',
        handler: function () {
            form.updateRecord();
            form.hide();
        }
    }]

});

var grid = Ext.create('Fiddle.view.DocumentGrid', {
    title: 'Document Grid',
    region: 'center',
    listeners: {
        selectionchange: function (selModel, selection) {
            if (Ext.isEmpty(selection)) {
                form.hide();
                return;
            }
            form.loadRecord(selection[0]);
            form.show();
        }
    }

});

Ext.application({
    name: 'Fiddle',

    launch: function () {
        Ext.create('Ext.panel.Panel', {
            renderTo: Ext.getBody(),
            layout: 'fit',

            layout: 'border',
            width: 600,
            height: 600,
            items: [
                grid, form
            ]

        });
    }
});
...