Extjs4级联combobox的问题,大家帮忙看看了
省市地区三级联动combobox，第一次操作没有问题，第二次选择省份信息后，加载市区信息就一直显示“加载中...”的遮罩效果，无法加载。
附代码，求大家帮忙看下
combobox.js
- JScript code
Ext.onReady(function() { //定义ComboBox数据源模型 Ext.define('State', { extend: 'Ext.data.Model', fields: [ {type: 'int', name: 'id'}, {type: 'string', name: 'cname'} ] }); //加载省份数据源 var store1 = Ext.create('Ext.data.Store', { model: 'State', proxy: { type: 'ajax', url: 'provinces_regions.jsp?act=sheng&n='+new Date().getTime()+'' }, autoLoad: true, remoteSort:true }); //加载市区数据源 var store2 = Ext.create('Ext.data.Store', { model: 'State', proxy: { type: 'ajax', url: 'provinces_regions.jsp?act=shi&n='+new Date().getTime()+'' }, autoLoad: false, remoteSort:true }); //加载地区数据源 var store3 = Ext.create('Ext.data.Store', { model: 'State', proxy: { type: 'ajax', url: 'provinces_regions.jsp?act=qu&n='+new Date().getTime()+'' }, autoLoad: false, remoteSort:true }) var combo1 = Ext.create('Ext.form.ComboBox', { fieldLabel : '省份', //store : states, name : "sheng", id : "shengid", store : store1, queryMode : 'local', displayField : 'cname', valueField : 'id', triggerAction : 'all', selectOnFocus : true, forceSelection : true, allowBlank : true, editable : true, emptyText : "请选择省份1", blankText : "请选择省份", listeners : { 'select' : function(combo, record, index) { try{ combo2.clearValue(); combo3.clearValue(); combo2.store.load({params:{param:this.value}}); } catch(ex){ Ext.MessageBox.alert("错误","数据加载失败。"); } } } }); var combo2 = Ext.create('Ext.form.ComboBox', { fieldLabel : '市区', name : "shi", id : "shiid", store : store2, queryMode : 'local', displayField : 'cname', valueField : 'id', triggerAction : 'all', selectOnFocus : true, forceSelection : true, allowBlank : true, editable : true, emptyText : "请选择市区1", blankText : "请选择市区", listeners : { 'select' : function(combo, record, index) { try{ combo3.clearValue(); combo3.store.load({params:{param:this.value}}); } catch(ex){ Ext.MessageBox.alert("错误","数据加载失败。"); } } } }); var combo3 = Ext.create('Ext.form.ComboBox', { fieldLabel : '地区', name : "qu", id : "quid", store : store3, queryMode : 'local', displayField : 'cname', valueField : 'id', triggerAction : 'all', selectOnFocus : true, forceSelection : true, allowBlank : true, editable : true, emptyText : "请选择地区1", blankText : "请选择地区" }); //创建存放combobox的panel容器 Ext.create('Ext.panel.Panel', { title : "省份地区级联下拉框1", width : 400, height : 200, plain : true, margin : '30 10 0 80', bodyStyle : "padding: 45px 15px 15px 15px;", items : [combo1, combo2, combo3], renderTo : Ext.get("div_combobox") }); })
provinces_regions.jsp
- Java code
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%@ page import="com.unoera.service.RegionService"%><%@ page import="net.sf.json.JSONArray"%><%@ page import="net.sf.json.JSONObject"%><% String path = request.getContextPath(); String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/"; String act = request.getParameter("act"); String param = request.getParameter("param"); JSONArray jary = new JSONArray(); RegionService service = new RegionService(); if ("sheng".equals(act)) { jary = service.getProvicesJson(); } else if ("shi".equals(act)) { jary = service.getRegionJson(Integer.parseInt(param)); } else if ("qu".equals(act)) { jary = service.getRegionJson(Integer.parseInt(param)); } out.println(jary);%>[解决办法]
我这里没办法帮你测试，说说我的第一感觉你可能出错的地方：
1. 好多前台卡住一直显示“加载中”是由于后台代码出错，所以检查下你的java代码中是不是成功把市区的json数据传过来了，特别注意这里：
- Java code
} else if ("shi".equals(act)) { jary = service.getRegionJson(Integer.parseInt(param));