Отправка формы + сетка в ExtJS 4 - PullRequest
Новая
       21

Отправка формы + сетка в ExtJS 4

5 голосов
/ 14 сентября 2011

У меня есть Ext.form.Panel, содержащая сетку и несколько текстовых полей для редактирования каждой строки в сетке.Это очень похоже на это: http://dev.sencha.com/deploy/ext-4.0.2a/examples/writer/writer.html, только то, что AJAX не задействован;мое хранилище данных является локальным.

Как я могу отправить строки сетки с помощью стандартного POST?

Если я просто делаю myForm.submit (), есть две проблемы:

  1. Поля для редактирования строк сетки проверяются.Их следует игнорировать при отправке формы.

  2. Данные из таблицы не передаются.

Единственное решение, которое я вижу, - это каким-то образомпредотвратить проверку полей и создать некоторые скрытые поля, содержащие данные из каждой строки.Есть ли лучший вариант?

Заранее спасибо!

Ответы [ 2 ]

8 голосов
/ 17 сентября 2011

Вот решение, которое я использовал:

  1. Для игнорирования определенных полей формы при отправке я переписал метод getFields () формы.Противно, я знаю.В приведенном ниже коде поля со свойством ignoreInMainForm будут игнорироваться. 

    Ext.getCmp('myForm').getForm().getFields = function() {
    var fields = this._fields;
    if (!fields) {
        var s = [],
        t = this.owner.query('[isFormField]');
        for (var i in t) {
            if (t[i]['ignoreInMainForm'] !== true) {
                s.push(t[i]);
            }
        }
        fields = this._fields = Ext.create('Ext.util.MixedCollection');
        fields.addAll(s);
    }
    return fields;
}

  2. Для отправки данных сетки я кодирую все строки в одном объекте JSON, который ядобавить в форму базыПарамы. 

    var myItems = myStore.getRange();
var myJson = [];
for (var i in myItems) {
    myJson.push({
        'a': myItems[i].get('a'),
        'b': myItems[i].get('b'),
        ...
    });
}
Ext.getCmp('formHiddenId').setValue(Ext.encode(myJson ));
1 голос
/ 21 сентября 2011

Это частично сработало для меня - в ExtJS 4.0.2a я не мог добавить к baseParams, поэтому вместо этого я вызвал обработчик отправки, чтобы вместо него сделать: 

function prepareToSendForm(a, b) {
var myItems = Ext.getCmp('grid-links').store.getRange();
var myJson = [];
for (var i in myItems) {
    myJson.push({
        'title': myItems[i].get('title'),
        'url': myItems[i].get('url'),
        'refreshes': myItems[i].get('refreshes')
    });
}

//Update the hidden field to be the JSON of the Grid
for (var i=0, len=Ext.getCmp('roomCreateForm').getForm()._fields.items.length; i<len; i++) {
    var item = Ext.getCmp('roomCreateForm').getForm()._fields.items[i];
    if (item.name=='roomLinks') {
        Ext.getCmp('roomCreateForm').getForm()._fields.items[i].inputEl.dom.value=Ext.encode(myJson);
        break;
    }
}

Ext.getCmp('roomCreateForm').submit();
}

То, что сработало, - это очарование (но не очень "включай и работай"). Мне пришлось создать скрытое поле (с именем roomLinks выше) в форме, и второй цикл for выше находит это и заменяет значение результатами JSONed.

...