Extjs 中combobox下拉框初始化赋值
近日在工作中遇到一个需求,要求页面初始化的时候给dataGrid表插入一条数据。
前端使用的是Extjs框架,dataGrid表有四列,其中三列是类型为textbox,普通文本框,另外一列类型是combobox下拉框形式,下拉框一列的数据使用的数据字典,值通过初始化加载时从数据库字典中查找得到的。由于对Extjs框架的不熟悉,以及前端水平很是有限,所以只好先求助度娘,找了好久都没有找到解决办法。只好自己尝试各种方法,好在最后问题得以解决,所以记录一下自己解决的思路和方法。
{
field:'A',
title:'下拉框类型',
width:50,
editor:{
type:'combobox',
options:{
valueField:'id',
textField:'name',
editable:false,
loader:queryTableData, // 查询数据字典
....
}
}
}
得到这个需求的时候感觉很简单,在js中初始化Grid数据,使用如下
$("#target").datagrid("loadData",[{
field:"初始化值" // 文本框所对应的列的这样赋值没有问题
A:"下拉框字典项的id" // 直接这么赋值,js直接报错
..........
}]);
找原因:通过查找字典表的函数,下拉框初始化加载得到的是一个字典对象,该对象有id,name,order...等属性,在此处可以看到 valueField:'id',说明字典对象的id是下拉框要用到的一个属性,既然初始化时直接插入,我们就来根据id属性构造一个类似字典对象的对象出来,将该对象赋值给下拉框对应单元格,如下:
var obj={
id:'',
name:''
}
obj.id = '想要初始赋值的值对应的字典id'
$("#target").datagrid("loadData",[{
field:"初始化值" // 文本框所对应的列的这样赋值没有问题
A:obj
..........
}])
问题解决,主要是构造一个包含id属性的类似字典对象的一个对象(上述的obj对象)。
Extjs 中combobox下拉框初始化赋值的更多相关文章
- easyui的combobox下拉框初始化默认值以及保持该值一直显示的方法
easyui的combobox下拉框默认初始值是空,下面是实现从远程加载数据之后初始化默认值,以及让该值一直排在下拉框的最顶部的方式. 目前的需求是需要在初始化的时候添加"全部数据库&quo ...
- 关于easyui combobox下拉框实现多选框的实现
好长时间没有更博了,一是因为最近真的比较忙,二是因为自己是真的偷懒了,哈哈 好啦,这篇博客主要是总结一些关于easyui combobox下拉框实现多选框的实现,包括前台界面的展示,和后台对数据的获取 ...
- 自绘制HT For Web ComboBox下拉框组件
传统的HTML5的下拉框select只能实现简单的文字下拉列表,而HTforWeb通用组件中ComboBox不仅能够实现传统HTML5下拉框效果,而且可以在文本框和下拉列表中添加自定义的小图标,让整个 ...
- sencha combobox下拉框不用jsonstore,直接使用字符串数组做数据源
combobox下拉框的store除了可以选择一个jsonstore来加载数据,还可以直接使用符串Array做数据源. { xtype: 'combobox', fieldLabel: 'Label' ...
- 选择屏幕中的下拉框和dialog中下拉框设计
REPORT YTEST014. PARAMETERS: auart LIKE vapma-auart AS LISTBOX VISIBLE LENGTH 6. AT SELECTION-SC ...
- 从后台绑定数据到ligerui 的comboBox下拉框组件
这次来记录一下ligerUI的comboBox下拉框组件,ligerUI的API里也有相关描写叙述,上面都是前台写死数据,然后显示在组件中,我这次要说的是将后台的数据绑定到下拉框组件中,废话不多说. ...
- 由于抽签HT For Web ComboBox下拉框组件
传统HTML5的下拉框select仅仅能实现简单的文字下拉列表,而HT for Web通用组件中ComboBox不仅可以实现传统HTML5下拉框效果,并且可以在文本框和下拉列表中加入自己定义的小图标, ...
- 快速设计ComboBox下拉框
传统软件项目开发时,需要每个控件一个一个的来设计,同时需要在页面功能中对每个控件的属性进行判定处理,尤其是页面风格布局样式需要花去一大半的时间,并且后续要想修改是非常麻烦繁琐,这样就导致设计完成一个功 ...
- easyui combobox下拉框复制后再禁用,点击不会出现下拉框
easyui combobox下拉框禁用,点击不会出现下拉框 需要做到,在给easyui combobox赋值后,再禁用easyui combobox 解决办法: $("#time-sele ...
随机推荐
- 常见的HTTP方法有哪些?
GET:请求指定的页面信息,返回实体主体: HEAD:类似于get请求,只不过返回的响应中没有具体的内容,用于捕获报头: POST:向指定资源提交数据进行处理请求(比如表单提交或者上传文件),.数据被 ...
- Arts打卡第8周
Algorithm.主要是为了编程训练和学习. 每周至少做一个 leetcode 的算法题(先从Easy开始,然后再Medium,最后才Hard). 进行编程训练,如果不训练你看再多的算法书,你依然不 ...
- Hive和Hadoop
我最近研究了hive的相关技术,有点心得,这里和大家分享下. 首先我们要知道hive到底是做什么的.下面这几段文字很好的描述了hive的特性: 1.hive是基于Hadoop的一个数据仓库工具,可以将 ...
- springMVC_配置文件搭建基础环境
SpringMVC与Struts的区别. 一.基础jar包 二.①DispatcherServlet,handelMapping,webAction(colltroller),ModelAndView ...
- win10系统vs2008环境wince项目无法创建问题
文章备份,原文来自百度某个作者的博客. 昨晚,当我升级win10之后,发现系统使用还是挺顺畅的,没有当初升级win8的时候那么多错误. 但是今晚回来之后,发现之前win8.1下已经安装好的vs2008 ...
- boost 介绍
简介: Boost库是一个可移植.提供源代码的C++库,作为标准库的后备,是C++标准化进程的开发引擎之一. Boost库由C++标准委员会库工作组成员发起,其中有些内容有望成为下一代C++标准库内容 ...
- Linux中工作目录切换命令
1.pwd命令用于显示当前的工作目录 2.cd命令用于切换工作路径,格式为:cd [目录名称] 参数 作用 - 切换到上一次的 目录,如:cd - ~ 切换到”家目录“,如:cd ~ ~usernam ...
- JMeter中计数器的使用
添加计数器 计数器的引用,用于数据做区分 可以添加一个变量count,每次为了数据的唯一性,只要修改count就可以了,例如
- Ionic4.x 中的 UI 组件(UI Components) Slides 轮播图组件、Searchbar 组件、 Segment 组件
Slides 轮播图组件 Ionic4.x 中的轮播图组件是基于 swiper 插件,所以配置 slides 的属性需要在 swiper 的 api 中 找 Swiper Api:http://ida ...
- VBScript把json字符串解析成json对象的2个方法
这篇文章主要介绍了VBScript把json字符串解析成json对象的2个方法,本文通过MSScriptControl.ScriptControl和jscript实现,需要的朋友可以参考下 asp/v ...