<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <base href="${pageContext.request.scheme}://${pageContext.request.serverName}:${pageContext.request.serverPort}${pageContext.request.contextPath}/"/> <link rel="stylesheet" type="text/css" href="resources/css/ext-all.css" /> <link rel="stylesheet" type="text/css" href="shared/example.css" /> <script type="text/javascript" src="js/ext/ext-all.js"></script> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> <script type="text/javascript"> Ext.onReady(function(){ //创建数据模型 Ext.regModel('postInfo',{ fields:[{name:'name'},{name:'areaid'}] }); //定义组合框中显示的数据源 var postStore = Ext.create('Ext.data.Store',{ model:'postInfo', proxy:{ type:'ajax', url:'areaAction!list.action', data:'list' } }); //创建表单 Ext.create('Ext.form.Panel',{ title:'Ext.form.ComboBox远程数据源演示', renderTo:Ext.getBody(), bodyPadding:5, frame:true, height:100, width:270, defaults:{ labelSeparator:': ', labelWidth:70, width:200, labelAlign:'left' }, items:[{ xtype:'combo', listConfig:{ emptyText:'未找到匹配值', maxHeight:180 }, allQuery:'allArea', minChars:1,//下拉框自动选择前用户需要输入的最小字符数量 queryDelay:300,//查询延迟时间(毫秒) name:'area', fieldLabel:'省', triggerAction:'all',//单击按钮显示全部数据 store:postStore, displayField:'name',//定义要显示的字段 valueField:'areaid', queryMode:'remote',//远程模式 forceSelection:true,//要求输入值必须在列表中存在 typeAhead:true,//允许自动选择匹配的剩余部分文本 value:'11'//默认值 }] }); }); </script> </head> <body> <div id="form"></div> </body> </html>
@Entity @Table(name="area") public class Area { @Id private Integer areaid; /** * @return the areaid */ public Integer getAreaid() { return areaid; } /** * @param areaid the areaid to set */ public void setAreaid(Integer areaid) { this.areaid = areaid; } /** * @return the name */ public String getName() { return name; } /** * @param name the name to set */ public void setName(String name) { this.name = name; } /** * @return the parentid */ public Integer getParentid() { return parentid; } /** * @param parentid the parentid to set */ public void setParentid(Integer parentid) { this.parentid = parentid; } /** * @return the vieworder */ public String getVieworder() { return vieworder; } /** * @param vieworder the vieworder to set */ public void setVieworder(String vieworder) { this.vieworder = vieworder; } private String name; private Integer parentid; private String vieworder; }
public String list(){ areas=areaService.findAll("from Area a where a.parentid=0 ",query); return "list"; } query未查询参数,当用户输入一个字符时会进行相应的模糊查询
最后附上一个中国区域表
相关推荐
extjs-theme-bootstrap-master.zip
ExtJs常用布局--layout详解实例代码: ExtJs常见的布局方式有:border、form、absolute、column、accordion、table、fit、card、anchor 另外,不常见的布局有:tab、vbox、hbox 具体使用方法可见该文件的案例代码。 ...
extjs-620-docs官方文档extjs-620-docs官方文档extjs-620-docs官方文档
语言程序设计资料:ExtJs学习笔记-2积分.doc
extjs2----关于extjs 的使用,操作.比较初级,但是也比较使用。适合初步接触extjs的朋友
ExtJS----HelloWorld程序源码
Extjs4---combobox省市区三级联动+struts2
使用ExtJs获取后台json格式的数据必须的七个jar包,commons-beanuti-1s-1.7.0.jar,commons-collections-3.1.jar,commons-lang-2.5.jar,commons-logging-1.0.4.jar,ezmorph-1.0.4.jar,json-lib-2.1.jar,...
ExtJS快速入门--传智播客--蔡世友
EXTJS4 类似于bootstrap的主题
extJs-5.0.1-gpl附带sencha cmd安装程序、ruby编译包(分为32位和64位)和教程,一共四部分
Extjs4---grid的修改、删除功能---结合struts2、hibernate
extjs-7.0.0-gpl
Extjs4--Form登录功能,结合struts2
之前的框架的核心(数据、控制器、模型等等)已被调和为一个单一的公共平台。这样,数据和逻辑就能共享,从而帮助开发人员进一步去优化他们的应用程序。 那些具有独特功能的东西将会被分解为两个绝然不同的两个工具...
一个extjs的OA项目 extjs-OA extjs-oaextjs-OA extjs-oa
EXTJS---完整数据库代码,全网唯一,非常适合EXTJS搭建框架,包含动态树,菜单,集成SPIRNGMVC+exjs+jdbc 等
ExtJS-4.2.2-gpl.rar完整版,包含源码,示例,api,文档