Extjs 4 устанавливает значения combox в событии загрузки формы - PullRequest
Новая
       30

Extjs 4 устанавливает значения combox в событии загрузки формы

0 голосов
/ 16 февраля 2012

У меня есть форма, содержащая 2 поля со списком, которые являются связанными полями со списком.

Главы и уроки

Когда пользователь выбирает главу, будет показан список уроков в этой главе.

Как отфильтровать комбо уроков на основе комбо глав в EXTjs 4. Если выбран комбо глав, то только уроки уроков должны показывать уроки, в противном случае они должны быть пустыми.

И как установитьЗначения cmobo выбираются, когда данные формы загружаются с сервера и заполняются в полях формы.

Хранилище глав 

var chapter_store = Ext.create('Ext.data.Store', {
    autoLoad: true,
    fields: ['chapter_id', 'chapter_name'],
    proxy: {
        type: 'ajax',
        url: BASE_URL + 'courses/chapters/getChaptersCombo/' + course_id,
        actionMethods: {
            read: 'POST'
        },
        noCache: false,
        reader: {
            type: 'json',
            root: 'results',
            totalProperty: 'total'
        }
    },
    storeId: 'chapter_id'
});

Хранилище уроков 

var lesson_store = Ext.create('Ext.data.Store', {
    autoLoad: true,
    fields: ['lesson_id',
             //'chapter_name',
             'lesson_name', 'lc_relation_id'
             ],
    proxy: {
        type: 'ajax',
        url: BASE_URL + 'courses/lessons/getLessonsCombo/' + course_id,
        actionMethods: {
            read: 'POST'
        },
        noCache: false,
        reader: {
            type: 'json',
            root: 'results',
            totalProperty: 'total'
        }
    },
    storeId: 'lesson_id'
});

Форма со связанными комбинациями 

 var quiz_form = Ext.create('Ext.form.Panel', {
    items: [{
        xtype: 'combobox',
        //readOnly:true,
        id: 'test_chapter_combo',
        name: 'test_chapter_combo',
        //hiddenName: 'test_linkchapter_val',
        displayField: 'chapter_name',
        valueField: 'chapter_id',
        fieldLabel: 'Select Chapter',
        allowBlank: false,
        blankText: 'Chapter is required',
        triggerAction: 'all',
        queryMode: 'remote',
        store: chapter_store,
        selectOnFocus: true,
        listeners: {
            select: {
                fn: function (combo, value) {
                    var comboLesson = Ext.getCmp('test_lesson_combo');
                    comboLesson.clearValue();
                    lesson_store.load({
                        params: {
                            chapters_id: combo.getValue()
                        }
                    });
                }
            }
        }
    }, {
        xtype: 'combobox',
        //readOnly:true,
        id: 'test_lesson_combo',
        name: 'test_lesson_combo',
        //hiddenName: 'test_linklesson_val',
        displayField: 'lesson_name',
        valueField: 'lc_relation_id',
        mode: 'local',
        fieldLabel: 'Link To Lesson',
        allowBlank: false,
        blankText: 'Lesson is required',
        triggerAction: 'all',
        store: edu_lesson_store,
        queryMode: 'remote'
    }]
});

Загрузка данных формы с сервера 

quiz_form.getForm().load({
    url: BASE_URL + 'courses/getCourseTest/' + quiz_id,
    method: 'POST'
});

1 Ответ

1 голос
/ 16 февраля 2012

Я не знаю, какую серверную технологию вы используете, но я уверен, что вы можете получить некоторое вдохновение / руководство, следуя этим 2 замечательным ссылкам:

HTH!

...