?1 <!DOCTYPE html> ?2 <html> ?3 <head> ?4 ????<link href="https://cdnjs.cloudflare.com/ajax/libs/extjs/6.0.0/classic/theme-classic/resources/theme-classic-all.css" rel="stylesheet" /> ?5 ????<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/extjs/6.0.0/ext-all.js"></script> ?6 ????<script type="text/javascript"> ?7 ????????Ext.onReady(function() { ?8 ????????????var buyTypeStore = new Ext.data.Store({ ?9 ????????????????fields: ["text", "value"], 10 ????????????????proxy: { 11 ????????????????????type: "ajax", 12 ????????????????????url: ‘./getinfo.php‘, 13 ????????????????????actionMethods: { 14 ????????????????????????read: "POST", ?//解决传中文参数乱码问题，默认为“GET”提交 15 ????????????????????????update : ‘POST‘, 16 ????????????????????????destroy: ‘POST‘ 17 ????????????????????}, 18 ????????????????????extraParams:{‘pra‘:‘55‘}, 19 ????????????????????reader: { 20 ????????????????????????type: "json", ?//返回数据类型为json格式 21 ????????????????????????root: "root" ?//数据 22 ????????????????????} 23 ????????????????}, 24 ????????????????autoLoad: true ?//自动加载数据 25 ????????????}); 26 ?27 ????????????buyTypeStore.on("beforeload", function() { 28 ????????????????var op = Ext.getCmp(‘radioxiao‘).getGroupValue(); 29 ????????????????var new_params = {op:op,page:1}; 30 ????????????????Ext.apply(buyTypeStore.proxy.extraParams, new_params); 31 ????????????}); 32 ?33 ????????????var genderStore = Ext.create("Ext.data.Store", { 34 ????????????????fields: ["Name", "Value"], 35 ????????????????data: [ 36 ????????????????????{ Name: "man", Value: 10 }, 37 ????????????????????{ Name: "woman", Value: 20} 38 ????????????????] 39 ????????????}); 40 ?41 ?42 ????????????Ext.create(‘Ext.form.Panel‘, { 43 ????????????????id: ‘newForm‘, 44 ????????????????renderTo: ‘formId‘, 45 ????????????????border: true, 46 ????????????????width: 600, 47 ????????????????margin:50, 48 ????????????????items: [ 49 ????????????????????{ 50 ????????????????????????xtype: "combobox", 51 ????????????????????????name: "Gender", 52 ????????????????????????fieldLabel: "gender", 53 ????????????????????????store: genderStore, 54 ????????????????????????editable: false, 55 ????????????????????????displayField: "Name", 56 ????????????????????????valueField: "Value", 57 ????????????????????????emptyText: "--please--", 58 ????????????????????????queryMode: "local", 59 ????????????????????????id:"Gender", 60 ????????????????????????listeners: { 61 ????????????????????????????"select": function () { 62 ????????????????????????????????var myc = Ext.getCmp(‘buyType‘); 63 ????????????????????????????????var op = Ext.getCmp(‘Gender‘).getValue(); 64 ????????????????????????????????myc.setValue(null); 65 ????????????????????????????????var mycvalue = Ext.getCmp(‘buyType‘).getValue(); 66 ????????????????????????????????buyTypeStore.removeAll(); 67 ????????????????????????????????myc.store.load({ 68 ????????????????????????????????????callback: function (records, operation, success) { 69 ????????????????????????????????????}, 70 ????????????????????????????????????params: { 71 ????????????????????????????????????????page: 6,//重新设置页数，不设置会使用之前的页数进行查询，导致查询结果有误 72 ????????????????????????????????????????start: 0,//重新设置起始行 73 ????????????????????????????????????????limit: 21,//重新设置每页显示行 74 ????????????????????????????????????????pra:op 75 ????????????????????????????????????} 76 ????????????????????????????????}); 77 ????????????????????????????} 78 ????????????????????????} 79 ?80 ????????????????????}, 81 ????????????????????{ 82 ????????????????????????xtype: ‘radiogroup‘, 83 ????????????????????????fieldLabel: ‘Radio field‘, 84 ????????????????????????defaultType: ‘radiofield‘, 85 ????????????????????????id: ‘radio1‘, 86 ????????????????????????colums : 3, 87 ????????????????????????defaults: { 88 ????????????????????????????flex: 1 89 ????????????????????????}, 90 ????????????????????????layout: ‘hbox‘, 91 ????????????????????????items: [{ 92 ????????????????????????????boxLabel: ‘A‘, 93 ????????????????????????????inputValue: ‘a‘, 94 ????????????????????????????name:‘radio1‘, 95 ????????????????????????????id:‘radioxiao‘, 96 ????????????????????????????checked:true 97 ????????????????????????},{ 98 ????????????????????????????boxLabel: ‘B‘, 99 ????????????????????????????inputValue: ‘b‘,100 ????????????????????????????name:‘radio1‘101 ????????????????????????},{102 ????????????????????????????boxLabel: ‘C‘,103 ????????????????????????????inputValue: ‘c‘,104 ????????????????????????????name:‘radio1‘105 ????????????????????????}106 ????????????????????????],107 ????????????????????????listeners :{108 ????????????????????????????‘change‘:function(){109 ????????????????????????????????var myc = Ext.getCmp(‘buyType‘);110 ????????????????????????????????var op = Ext.getCmp(‘radioxiao‘).getGroupValue();111 ????????????????????????????????myc.setValue(null);112 ????????????????????????????????var mycvalue = Ext.getCmp(‘buyType‘).getValue();113 ????????????????????????????????buyTypeStore.removeAll();114 ????????????????????????????????myc.store.load({115 ????????????????????????????????????callback: function (records, operation, success) {116 ????????????????????????????????????},117 ????????????????????????????????????params: {118 ????????????????????????????????????????page: 2,//重新设置页数，不设置会使用之前的页数进行查询，导致查询结果有误119 ????????????????????????????????????????start: 0,//重新设置起始行120 ????????????????????????????????????????limit: 21,//重新设置每页显示行121 ????????????????????????????????????????pra:4122 ????????????????????????????????????}123 ????????????????????????????????});124 ????????????????????????????}125 ????????????????????????}126 ????????????????????}127 ???????????????????,{128 ????????????????????xtype: "combo",129 ????????????????????id: "buyType",130 ????????????????????hiddenName: "buyType", ?//hiddenName和id不要相同，在IE6中会显示错位。131 ????????????????????store: buyTypeStore,132 ????????????????????displayField: "text",133 ????????????????????valueField: "value",134 ????????????????????triggerAction: "all",135 ????????????????????// ?mode : "remote",136 ????????????????????queryMode: "local", ?//低版本使用mode属性137 ????????????????????????queryParam : ‘empUserNum‘,138 ????????????????????????editable: false,139 ????????????????????allowBlank: false,140 ????????????????????????emptyText: ‘please select‘,141 ????????????????????fieldLabel: "xuanz",142 ????????????????????typeAhead: true,//设置为true，当开始输入字符时，在指定的延迟之后会自动匹配剩下的内容，如果找到了匹配的 内容则自动选中它 (typeAheadDelay) (默认值为 false)143 ????????????????????listeners: {144 ????????????????????????"select": function () {145 ????????????????????????????alert("fff");146 ????????????????????????????// var name = Ext.getCmp("buyType").getRawValue();147 ????????????????????????????// var pid = Ext.getCmp("buyType").getValue();148 ????????????????????????????// var myc = Ext.getCmp(‘buyType‘);149 ????????????????????????????// // alert(myc);150 ????????????????????????????// myc.store.load({151 ????????????????????????????// ????callback: function (records, operation, success) {152 ????????????????????????????// ????},153 ????????????????????????????// ????params: {154 ????????????????????????????// ????????page: 2,//重新设置页数，不设置会使用之前的页数进行查询，导致查询结果有误155 ????????????????????????????// ????????start: 0,//重新设置起始行156 ????????????????????????????// ????????limit: 21//重新设置每页显示行157 ????????????????????????????// ????}158 ????????????????????????????// });159 ????????????????????????}160 ????????????????????}161 ????????????????}]162 ????????????});163 ????????});164 ????</script>165 </head>166 <body>167 <div id = "formId"></div>168 169 </body>170 </html>extjs--combo动态获取数据
原文地址：https://www.cnblogs.com/bisonkeji/p/9085785.html