EasyUi combobox下拉列表相当于html的select,对应关系valueField-->value;extField-->text。
1、一个简单的为combobox赋值的例子如下:
将平台数据提交的页面
//跳转到角色封禁页面 @RequestMapping(value = "/tolist") public ModelAndView userMessageYeMian(){ List<Platform> platforms=platformService.selectPlatform(null); return new ModelAndView("gm/mh/userManager/forbidAction").addObject("platforms", platforms); }
<form action="exportUser.do" id="userMessageForm" method="post"> <table cellpadding="3" cellspacing="5"> <tr style="font-size: 13px;"> <td width="50" align="right"> 平台:</td> <td align="left"> <select class="easyui-combobox" style="width:130px;" name="platformID" id="platformID"> <c:forEach items="${platforms}" var="platform"> <option value="${platform.platformId}" >${platform.platformName}</option> </c:forEach> </select> </td> <td width="50" align="right"> 服:</td> <td align="left"> <select class="easyui-combobox" style="width:130px;" name="areaID" id="areaID" editable=false panelHeight="auto"> </select> </td> </tr> </table> </form>
$(document).ready(function(){ //在页面加载的时候根据平台号去后台查找平台下的服务器,然后默认选择第一向 var id= jQuery("#platformID option:selected").val(); if(id!=null && id !=""){ $('#areaID').combobox({ url:"./getserver.do?platformId="+id, valueField:'serverid', textField:'serverName' , onLoadSuccess:function(){ //加载完成后,设置选中第一项 var val = $(this).combobox("getData"); for (var item in val[0]) { if (item == "serverid") { $(this).combobox("select", val[0][item]); } } } }); } //根据平台获得服务数据(二级联查) //当重新选择平台后重新设置服务器 $('#platformID').combobox({ onSelect:function(newValue, oldValue){ var platformId = $('input[name=platformID]').val(); server.combobox({ disabled: false, url:"./getserver.do?platformId="+platformId, valueField: 'serverid', textField: 'serverName' }).combobox('clear'); } }); var server = $('#areaID').combobox({ valueField:'serverid', textField:'serverName', editable:false }); });
//根据平台查询服 @RequestMapping(value="/getserver",method=RequestMethod.POST) @ResponseBody public List<GameServer> getserver(HttpServletRequest request) throws Exception{ String platformId = request.getParameter("platformId") == "" ? null : request.getParameter("platformId"); //平台名称 Map<String,Object> params = new HashMap<String,Object>(); params.put("platformId", platformId); List<GameServer> servers = gameServerService.getServerByGameId(params); return servers; }
2、提高例子
$(document).ready(function(){ //根据游戏、平台获得服务数据(二级联) $('#platform').combobox({ onSelect:function(newValue, oldValue){ var gameId = $('input[name=gameId]').val(); var platform = $('input[name=platform]').val(); $('#serverId').combobox({ disabled: false, url:"./getserver.do?gameId="+gameId+"&platform="+platform, valueField: 'serverid', textField: 'serverName', //加载成功后,设置默认选择第一项 onLoadSuccess:function(){ var data = $('#serverId').combobox('getData'); if(data.length > 0){ $("#serverId").combobox('setValue',data[0].serverId); } } }).combobox('clear'); } }); $('#serverId').combobox({ valueField:'serverId', textField:'serverName', editable:false }); });
相关推荐
ComboBox下拉框内字体加颜色 在COMBOBOX内重画得到的字体加颜色
本文实例为大家分享了EasyUI Combobox下拉列表的具体代码,供大家参考,具体内容如下 1. html代码 性别: <input class="easyui-combobox" style="width: 100px;" type="text" id="gender" /> 2.显示 3.js...
本文给大家分享jQuery EasyUI编辑DataGrid用combobox实现多级联动效果的实例代码,代码简单易懂,非常不错,具有参考借鉴价值,感兴趣的朋友一起看看吧
本文实例为大家分享了EasyUI Combobox级联下拉列表的具体代码,供大家参考,具体内容如下 1. html代码 信息查询 学校: <input class="easyui-combobox" type="text" id="School" /> 院系: <...
combo:修复当设置了一个较大的'delay'值的时候下拉面板可能不会被隐藏的问题; layout:修复当鼠标光标快速离开的时候展开的面板不会被折叠的问题; tagbox:修复tagbox框和label标签不在一条直线上的问题。 ...
combobox:允许“disabled”属性禁用下拉列表选项; tree:改进数据加载时候的性能; pagination:新增“layout”属性,用于自定义控件的样式布局; accordion:新增“unselect”方法、“onUnselect”事件; ...
在使用 EasyUI 各表单组件时,尤其是使用 ComboBox(下拉列表框)、DateBox(日期输入框)、DateTimeBox(日期时间输入框)这三个组件时,经常有这样的需求,下拉框或日期只允许选择、不允许手动输入,这时只要在...
主要为大家详细介绍了easyUI下拉列表点击事件的使用方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
我们知道,一般Web界面包括的界面控件有:单行文本框、多行文本框、密码文本框、下拉列表Combobox、日期输入控件、数值输入控件、单项选择、复选框、表格控件DataGrid、树形控件、布局控件、弹出式对话框、提示信息...
combobox下拉列表用的一个js文件.
完全结合最新的SSH框架,jquery jeasyui velocity等特性,进行生意下拉列表的实现,避免了复杂性的SELECT OPTIONS等代码编写
我们知道,一般Web界面包括的界面控件有:单行文本框、多行文本框、密码文本框、下拉列表Combobox、日期输入控件、数值输入控件、单项选择、复选框、表格控件DataGrid、树形控件、布局控件、弹出式对话框、提示信息...
combobox:添加“limitToList”属性来限制只能输入在列表项中的内容; combogrid:允许用户快速克隆组件; form:添加“dirty”属性,允许用户只发送变更的字段内容; form:添加“resetDirty”方法; datagrid...
在使用 EasyUI 各表单组件时,尤其是使用 ComboBox(下拉列表框)、DateBox(日期输入框)、DateTimeBox(日期时间输入框)这三个组件时,经常有这样的需求,下拉框或日期只允许选择、不允许手动输入,这时只要在...
jQuery EasyUI 组合树(ComboTree) 和组合框的用法差不多,只是在显示上有点差别:一个显示成树状结构,一个显示成列表结构。 项目中做角色授权时,需要做一个下拉框带树结构的 并且可以多选的组件,就想到了easyui的...