работа с CardLayout и FormPanels

Question

Я пытаюсь реализовать мастер и использую CardLayout.Мастер имеет 3 экрана с некоторыми элементами формы.Итак, в основном мне нужно иметь форму, которая разбита на 3 экрана, и пользователь переходит с одного экрана на следующий, только если введенные данные верны.

Проблема в том, как мне представить форму?Мне нужно будет отправить все данные, когда пользователь наконец завершит работу с мастером.Я попробовал эти два метода:

1. Использовать макет карты на панели формы. В этом случае элементы формы отображаются неправильно.

2. Используйте панель форм для каждого экрана в панели макета карты. В этом случае формы могут отображаться, и функциональность пользовательского интерфейса хорошая.Но как отправить данные, распределенные по трем формам, одним методом?

Итак, что мне делать?Идеи и предложения, пожалуйста ...

Answer 1

Вариант № 1 - лучшее решение, на самом деле я бы даже не рассматривал номер 2, потому что он не очень масштабируем.

Я предполагаю, что из-за того, что «элементы формы не отображаются должным образом», вы пропускаете свой макет формы в каждой карточке.

items: [{
    id: 'card-0',
    layout: 'form',
    items: [{
        //items here
    }]
},{
    //other cards
}]

Answer 2

Рассматривая вариант с Ext.form.FormPanel в каждом элементе CardLayout, вы можете запретить отправку каждой из этих форм и в последнем прикрепить слушатель к кнопке «submit», которая зацикливается на элементах на панели CardLayout. и получает все значения формы, вызывая метод getFieldValues ​​() BasicForm для каждого.

var formValues = {};

CardLayoutPanel.items.each(function(panel){
    if (panel.isXType('form')) {
        Ext.apply(formValues, panel.getForm().getFieldValues());
    }
});

// Now you can dispatch an ajax request with Ext.Ajax that sends the
// formValues variable as parameters to your backend to process
// all values from the three forms.