ExtJS Displaying Panels on Combobox Select -
ok, have defined 4 panels. each panel has own js file. call each of them in main modal window via alias.
in application have combobox. want display panel depending on selected item in combobox.
here's code.
main modal window:
ext.define('app1.views.reports.mainreport', { extend: 'ext.window.window', alias: 'widget.mainreport', title: 'main report', width: 900, autoheight: true, modal: true, items: [{ bodypadding: 5, defaults: { border: 0 }, items: [{ xtype: 'combobox', fieldlabel: 'select report type', id: 'reporttype', labelwidth: 200, width: 320, store: reporttype, querymode: 'local', displayfield: 'name', }, { //render panel here }] }], buttons: [{ text: 'done' }, { text: 'cancel' }] });
here's store combobox:
var reporttype = ext.create('ext.data.store', { fields: [ 'name' ], data: [{ 'name': 'report1' }, { 'name': 'report2' }, { 'name': 'report3' }, { 'name': 'report4' }] });
so once item selected in combobox, specific panel appear. let's selected 'report1', 'report 1' panel should appear.
thank you!
add select listener combobox. can switching of panels inside select listener function.
{ xtype: 'combobox', fieldlabel: 'select report type', id: 'reporttype', labelwidth: 200, width: 320, store: reporttype, querymode: 'local', displayfield: 'name', listeners: { select: function(combo, records, eopts) { // put in logic switch panel here } } }
ps: not sure version using, link documentation extjs 5.0
Comments
Post a Comment