写在前面

和队友完成工程实践项目过程中遇到combobox数据项加载失败的问题,我将记录下解决该问题中不断填坑的过程。

这是可以确定的填写正确的combobox内容

action也没有错误,Struts配置也正常,但接收不到数据。后经排查,找到了问题所在。

即第一个要点,combobox接收参数的json数据格式:

[{"id":value,"name":value...},{},{},{}...]

这是JSONArray的格式,此处直接使用id,name等属性名可直接访问,并按照数组顺序依次自动填充

如果是使用Struts-json自动转换的方式,则需要action中将相应实体类对象放到list中,然后在result中使用json包中相应的方法完成。下面有示例:

获取这样的json格式即可,为方便展示,删减了字段和记录。

小技巧:因为json是Struts-json包自动转的,为了知道具体的值,可以使用方法:JSONArray.fromObject(list)

写到这里,因为图方便,我的list是在方法中直接声明的,于是combobox一直接收不到数据,也没有任何报错,combobox的执行成功和失败函数均无反应。此处发现第二个知识点

即当前台接收不到json数据,控制台又没有任何错误提示时,考虑Struts中转json的数据源是否被识别,如上图Struts配置中的jsonList。

所有经过Struts的数据传递,都必须要设置set、get方法。在配置文件中获取数据也是如此,由于我在方法内部直接声明的list,导致配置文件数据获取失败,无法传递json到前台,同时也不会报错!!!

在填坑过程中,深入理解了combobox的使用,以及easyUI相关组件的使用

最大的感受是:请多查看官方文档!!!请多查看官方文档!!!请多查看官方文档!!!

先贴上直通车链接:http://www.jeasyui.net/plugins/169.html

同时,我发现所有组件都是一样的使用方式。

当组件没有销毁时,用id的方式可以直接获取到    $('#id').combobox({url:value,valueField:value,textField:value,..});      --------其他组件则对应改名即可 如$('#id').form();

括号中可填写对应参数,或对应方法,有多个时用逗号隔开即可。同时,若重复设置参数,则已设置过的参数的属性值覆盖,未设置过的参数属性值更新。

相关属性,事件,方法的使用

属性直接赋值即可,事件就写上  事件名:function(){} 对应参数要和官方要求的一致,方法需要单独引用$('#id').combobox('方法名','参数');

例:

$("#cc").combobox({
url:'category_query.action', //数据请求
valueField:'id', //选项的value
textField:'type', //选项的显示值
panelHeight:'auto', //自适应高度
panelWidth:120,//下拉列表是两个组件组成的
width:120, //要同时设置两个宽度才行
editable:false, //下拉框不允许编辑
//combobox继承combo继承validatebox,所以可以直接在这里设置验证
required:true,
missingMessage:'请选择所属类别',

onLoadSuccess:function(){

// 加载成功时处理,事件的范例在此演示

var data = $('#cc').combobox('getData'); //此事件获取从后台加载的json数据

alert(JSON.stringify(data));  //转字符串并显示

$('#cc').combobox('select','1'); //此事件设置下拉列表默认值为第一项

}, // 此方法没有参数

onBeforeLoad:function(param){

}// param用于指定加载参数
});

combobox数据获取及使用总结的更多相关文章

  1. WPF combobox数据绑定和数据获取

    本文章仅为个人学习,如有错误之处请指正. 搭建WPF界面的时候,想用combobox构建一个下拉菜单,搜索的时候看到大多数都是大段代码,逻辑顺序不是很详细,摸索了大概,记录一下方便来者. 拖入comb ...

  2. easyui combobox 实时刷新

    使用场景: A页面以及B页面,A页面有个下拉框,数据是从B页面存在的数据库中获取得到的:现将B页面的数据删除掉,但是在A页面再次点开下拉框时,依旧看到了刚才删除的那条数据: 期望:当B页面已何种方式改 ...

  3. FTL页面常用到的一些方法combobox、combotree、datagrid

    参考文件:点击下载 1.combobox: (1).js 1)初始化combobox //相似度 $('#same').combobox({ //url:"<@s.url value= ...

  4. Extjs 让combobox写起来更简单

    也已经写了很久时间的extjs ,每次都用到很多的combobox,配置很多东西觉得实在是太麻烦,所以根据常用到的情况写了一个简便的combobox,再次记录下来,以免放在某个地方忘记了找不到了. 定 ...

  5. ASP.NET Aries JSAPI 文档说明:AR.Form、AR.Combobox

    AR.Form 文档 1:对象或属性: 名称 类型 说明 data 属性 编辑页根据主键请求回来的数据 method 属性 用于获取数据的函数指向,默认值Get objName 属性 用于拦截form ...

  6. 带搜索的ComboBox

    带搜索的ComboBox就是给ComboBox一个依赖属性的ItemSource,然后通过数据源中是否包含要查询的值,重新给ComboBox绑定数据源. public class EditComboB ...

  7. 【MVVM DEV】DataColumn中的TextBox与ComboBox的并存

    一.前言       在WPF编程中,有时候我们使用DataGrid会需要在一个DataColumn中既有TextBox,也要有ComboBox或者TextBlock等其他数据显示样式. 这个时候我们 ...

  8. [WinForm] DataGridView 绑定 DT && ComboBox 列绑定 Dict

    一  需求介绍 一般像枚举类型的数据,我们在数据库里存储着诸如(1.2.3.4-)或者("001"."002"."003"-)此类,但是界面 ...

  9. EasyUI combobox

    高度自适应 data-options="required:true,editable:false,panelHeight:'auto',panelMaxHeight:170" 加上 ...

随机推荐

  1. 实战案例--TEMPDB暴涨

    前言   tempdb暴增,造成磁盘空间不足,甚至影响业务运行.     正文   如图,tempdb log文件从7.40开始突然暴涨,因为 tempdb 0 M到 40G     tempdb 所 ...

  2. Android studio 1.x 安装完毕后无法打开问题解决方案

    Android Studio 1.0正式发布,给Android开发者带来了不小的惊喜,再也不用为繁琐的环境配置而烦恼,从某一层面上说这降低了android开发门槛. 不过貌似只能开心一会儿,因为and ...

  3. 移动端车牌识别ocr系统

    移动端车牌识别ocr系统优点: 1.识别速度快:高度优化的车牌定位和识别算法,识别时间≤50毫秒(200万图片). 2.识别率:白天识别率≥99.7%:夜间识别率≥98%. 3.识别速度:单张图片识别 ...

  4. 【DDD】领域驱动设计实践 —— 框架实现

    本文主要了在社区服务系统(ECO)中基于SpringMVC+mybatis框架对DDD的落地实现.本文为系列文章中的其中一篇,其他内容可参考:通过业务系统的重构实践DDD. 框架实现图 该框架实现基本 ...

  5. NSMutable属性声明时为什么不能使用copy

    在iOS开发里面我们经常会进行NSMutable(可变类型的类,常用的如NSMutableString,NSMutableArray,NSMutableDictionary,NSMutableData ...

  6. js中防止全局变量被污染的方法

    (function ($){ var oDiv = $('div1');//获取id为'div1'的页面元素 })(function $(id){ return document.getElement ...

  7. 团队作业8——第二次项目冲刺(Beta阶段)--第三天

    一.Daily Scrum Meeting照片 二.燃尽图 三.项目进展 学号 成员 贡献比 201421123001 廖婷婷 16% 201421123002 翁珊 16% 201421123004 ...

  8. 团队作业8——第二次项目冲刺(Beta阶段)博客汇总

    一.冲刺计划安排 http://www.cnblogs.com/teamworkers/p/6875742.html 二.七天冲刺汇总 http://www.cnblogs.com/teamworke ...

  9. 201521123061 《Java程序设计》第十三周学习总结

    201521123061 <Java程序设计>第十三周学习总结 1. 本周学习总结 2. 书面作业 1. 网络基础 1.1 比较ping www.baidu.com与ping cec.jm ...

  10. 201521123087《Java程序设计》 第八周学习总结

    1. 本周学习总结 2. 书面作业 本次作业题集集合 List中指定元素的删除(题目4-1)1.1 实验总结                                               ...