Extjs Автоматическая форма сетки / привязки - PullRequest
Новая
       18

Extjs Автоматическая форма сетки / привязки

1 голос
/ 21 августа 2011

это ausom редактор строк инструмент в ext js.
enter image description here
Я ищу более сложный инструмент для сетки и фактической формы.
Что-то с хорошим API, так что я могу дать пользователю возможность видеть в полноэкранном режиме, а не только подряд.
Что-то, что поможет мне создавать все больше и больше CRUD без повторного создания форм.
что-то вроде «рендера форм» из настроек.

Где я могу получить этот вид API.
Спасибо

1 Ответ

4 голосов
/ 22 августа 2011

Я не знаю ни одного встроенного «средства визуализации форм», но вы можете создать аналог, используя loadRecord формы.
Прежде всего вы создаете форму с тем же набором входных данных, что и форма columns (очевидно, вы можете сделать это динамически). Например, если ваш columns конфиг выглядит так: 

columns: [
    {header: 'Name',  dataIndex: 'name'},
    {header: 'Email', dataIndex: 'email', flex:1},
    {header: 'Phone', dataIndex: 'phone'}
],

Конфигурация вашей формы должна выглядеть следующим образом: 

Ext.define('ux.FormEditor', {
    extend: 'Ext.window.Window',
    alias : 'widget.formeditor',
    title : 'Edit User',
    layout: 'fit',
    autoShow: true,
    initComponent: function() {
        this.items = [{
            xtype: 'form',
            items: [{
                    xtype: 'textfield',
                    name : 'name',
                    fieldLabel: 'Name'
                },{
                    xtype: 'textfield',
                    name : 'email',
                    fieldLabel: 'Email'
                },{
                    xtype: 'textfield',
                    name : 'phone',
                    fieldLabel: 'Phone'
                }]
        }];

        this.buttons = [{
                text: 'Save',
                action: 'save'
            },{
                text: 'Cancel',
                scope: this,
                handler: this.close
            }];

        this.callParent(arguments);
    }
});

Теперь вы назначаете обработчик для события itemdblclick сетки: 

yourGrid.on('itemdblclick', function(grid, record) {
    var view = Ext.widget('useredit'),
        form = view.down('form');

    form.loadRecord(record);
    view.down('button[action=save]').on('click', function(btn) {
        var rec = form.getRecord(),
            values = form.getValues();

        rec.set(values);
        view.close();
    });
});
...