extjs下拉框,多选,单选,动态传值

后台java代码

@RequestMapping(params = "command=adduser")
public void getUser(HttpServletResponse response) throws Exception{
JSONObject result1 = new JSONObject();
JSONArray rows1 = new JSONArray();
String search ="1=1";
List<Inducedcause> list = inducedcauseService.getInducedcauseList(search);
JSONObject ux = null;
for(Inducedcause uc:list){
ux= new JSONObject();
ux.put("id", uc.getId());
ux.put("reason", uc.getReason());
rows1.put(ux);
}
result1.put("results1", rows1);
// result.put("totalCount", list.size());
response.getWriter().write(result1.toString());
}

前台extjs代码

var comstore1 = new Ext.data.Store(
{proxy: new Ext.data.HttpProxy({url: ‘${pageContext.request.contextPath}/treatmentrecord/treatmentrecord.page?command=adduser‘}), 
//读取json
reader: new Ext.data.JsonReader({
root: ‘results1‘,
remoteSort: true,
fields: [‘id‘,‘reason‘]})
});

{
xtype:‘lovcombo‘,
fieldLabel: ‘诱发原因‘,
id: ‘inducedcause-id‘,
name: ‘inducedcause‘,
displayField : ‘reason‘,
valueField : ‘id‘,
hiddenName : ‘id‘,
mode : ‘local‘,
editable:false,
loadingText : ‘加载中...‘,
store : comstore1,
value:‘<%=realname%>‘,
emptyText:‘请选择原因‘,
triggerAction : ‘all‘,
maxLength : 100,
multiSelect:true,
anchor:‘100%‘
},

要实现多选下拉框要引入两个JS类库

<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/ext/examples/ux/css/Ext.ux.form.LovCombo.css" />
<script type="text/javascript" src="${pageContext.request.contextPath}/ext/examples/ux/Ext.ux.form.LovCombo.js"></script>

否则为单选下拉框,数据是动态的

初学extjs,希望可以帮到需要的人

时间: 2024-08-07 00:05:23

extjs下拉框,多选,单选,动态传值的相关文章

jquery实现下拉框多选

一.说明 本文是利用EasyUI实现下拉框多选功能,在ComboxTree其原有的基础上对样式进行了改进,样式表已上传demo,代码如下 二.代码 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w

ops-web运维平台-create.jsp-mootools下拉框-复选框

create.jsp页面的,body部分 <body onload="Page.init('${pageError}','${pageMessage}',${isSubmit},true)"> <div id="title">${pageTitle}</div> <s:form id="MYFORM" action="%{pageAction}" method="post&q

bootstrap-select实现下拉框多选效果

bootstrap-select实现下拉框多选效果 听语音 在学习bootstrap实现下拉多选效果的时候,觉得该效果很好,所以拿来分享下,这里就不详细的描述了,直接附上代码给各位看看 方法/步骤 1 最终实现的效果: 2 HTML代码: <div class= "row" style ="margin-top :10px;"> <div class= "form-group col-xs-12"> <label f

ExtJS 下拉框监听事件、日期选择器监听事件、实现动态给items添加删除数据

1.下拉框 下拉框选择时,触发事件的方法: 在 Ext.form.ComboBox 组件中新增 listeners 监听事件 基本写法为:  listeners{'事件',function(){处理方法}} listeners:{ select:{ fn:function(combo,record,index) { } } }   2.日期选择器 选择日期时,值发生变化,并且在失去焦点之前触发此事件,也就是说如果此日期组件的值发生变化,而焦点并没有失去,这个事件也就不会触发.解决方法: menu

Extjs 下拉框

刚刚熟练了easyui控件的使用,又開始了如今的这个项目. 这个项目是个半成品.前端使用的是Extjs控件,jsp中没有代码.就引用了非常多的js...于是乎有种不知所措了呀. . . 说实话特别的不想去看那些代码,第一是不熟悉,第二是太乱没条理,另一个原因界面连html不想看又不行,公司要做这个项目,你又不能跟公司领导说我不会,.所以还是硬着头皮看了一天. 大概了解后,就開始copy,past,将原模块中js原封不动的考到了jsp页面,于是乎就这样执行起来了,仅仅只是调用的不是我自己的方法.后

Extjs 下拉框没有数据

Extjs框架的下拉框动态加载数据时不显示数据. 1,返回结果的键值和下拉框定义的不一致 如下定义的下拉框值为value,显示为text 返回结果也必须是这种格式,不一致就会出错. 2,定义下拉框时多了个逗号 这种情况下在ie9浏览器下出错,在ie11,谷歌浏览器不出错. 所以,一定要注意最后一项的逗号使用..

PHP下拉框内容随单选框内容变化

这久在修改一个项目的小东西,要求把下拉框改为单选框,由于代码封闭,修改不了获取函数,所以想了个办法让下拉框的内容随单选框的内容变化,下面把代码分享给大家: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://w

angularJs实现下拉框多选

话不多说,直接上干货. 肯定需要下拉选插件.必须引入的是   注意 先后顺序 select2.css select2-bootstrap.css select2.min.js angular.min.js angular-select2.js ok,然后只需要写上一段代码就ok,如下 <input select2 select2-model="entity.brandIds" config="brandList" multiple placeholder=&q

帆软下拉框不选为空可选择显示全部值

方法一:sql查询不传参数  模板→模板参数→添加参数默认值 参数设置 https://www.cnblogs.com/zhuyu139/p/12066574.html 单元格过滤公式→if(len($大区)==0,nofilter,$大区) 预览即可 方法二:sql查询语句 ${if(len(area) == 0,"","and 货主地区 = '" + area + "'")} sql做了筛选操作,下拉重新设置为数据查询 原文地址:https: