一直使用的easyui中,一些不为人知的小知识点,与君共勉:

1.combobox设置高度:使用panelHeight属性;

2.combobox本身自带“自动补全”功能,但是在浏览器中是有限制的,在火狐当中,它的自动补全功能却不是立马实现的,而是需要敲回车或者其他什么的,但是在其他浏览器,比如360或者谷歌当中,这种自动补全功能却是“立竿见影”的,而且,它也是提供手动输入值的,只不过,手动输入的值,貌似用类似于:var  cities= jQuery('#cities').combobox('getValue');是得不到它的value值的,这是它自身的缺陷,这点自己在使用的时候记得避免咯~~~

3.监听combobox的值改变的时候,页面其他部分发生相应改变的情况:

解决方法(js代码如下):

jQuery("#vipState").combobox({
onChange: function () {
if(jQuery('#vipState').combobox('getValue') == -2){
jQuery("span[name='waitSumbit']").hide();
}else{
jQuery("span[name='waitSumbit']").show();
}
}
});

即combobox的onChange事件。

总结: 刚开始的时候,总以为酱紫是没有什么办法获取到下拉框的值变化时的数据,一再的否定测试小伙伴们的建议,直到自己静静的坐在凳子上思考了一下,采记起来这个方法,所以嘛:办法总是比困难多的,前提是自己得有点信心!

-------------------------------------------华丽丽的分割线2016-12-15------------------------------------------------------------------------------------------------------------------

4.在做cms后台管理系统中,顶部会有搜索框以及新增弹框,而它们之间肯定存在重复性的数据,比如上图中的下拉框的数据:钢厂的数据是从combobox中拿到的,这个数据则是直接查数据库得到的,

...
<td align="right" style="padding-left: 30px;">钢厂:</td>
<td align="right">
<input id="s_steel" name="stid" data-options="prompt:'请选择钢厂',panelHeight:'200px'" style="width: 200px"></td>
...

加载下拉框数据:

<script>
jQuery(function () {
jQuery('#s_steel').combobox({
url: '/vip/users/steellist',
valueField: 'id',
textField: 'name'
});
});
</script>

上面是使用js注册combobox组件,而在新增弹框中需要再次使用其下拉框中的值的时候,就可以直接使用:

var stidData = jQuery("#s_steel").combobox("getData");//获取钢厂数据
jQuery("#steel").combobox("loadData", stidData);//在新增弹框中获得数据
...
<tr>
<td>钢厂:</td>
<td>
<input id="steel" name="stid" class="easyui-combobox"
data-options="prompt:'请选择钢厂',panelHeight:'200px'"
style="width: 200px">
</td>
</tr>
...
找了很久,都没有发现自己为什么在新增弹框中,load不上去钢厂的数据,直到后来突然发现在使用combobox中缺少了两个属性:valueField:'id',textField:'name',而当自己加上去,新增弹框中同样就出现了搜索框中的数据。
正确的如下:
...
<tr>
<td>钢厂:</td>
<td>
<input id="steel" name="stid" class="easyui-combobox"
data-options="prompt:'请选择钢厂',panelHeight:'200px',valueField:'id',textField:'name'"
style="width: 200px">
</td>
</tr>
...
在使用easyui-combobox中,一定多记得看看data-option属性,有时候就是粗心而漏掉一些属性才会让程序出bug!

easyui中的combobox小知识点~~的更多相关文章

  1. C#、Java中的一些小知识点总结(持续更新......)

    前言:在项目中,有时候一些小的知识,总是容易让人忽略,但是这些功能加在项目中往往十分的有用,因此笔者在这里总结项目中遇到的一些实用的小知识点,以备用,并持续更新...... 1.禁用DataGridV ...

  2. html5中的一些小知识点(CSS)

    1.点击a标签周围区域就可以进入超链接: a标签 的css样式中的 display属性设置为block 就可以了 2.文字左右居中: text-align 属性值为 center 3.文字上下居中:  ...

  3. 【javascript】数据类型中的一些小知识点

    1. undefined 和 null undefined是一个变量而不是一个关键字,所以可以被重新赋值.为了避免歧义,一般推荐用void 0 来获取undefined: null是一个关键字,所以可 ...

  4. MVC3中几个小知识点

    1.ViewBag.Name~ViewBag.name等价,即不区分大小写.在此小心,下次见到不要奇怪,不过最好还是写成一样的比较好. 2.JS字符串不允许有换行符,\'等字符,需提前处理.

  5. EasyUI中combobox的使用方法和一个代码实例

    一.easyUI中select下拉框动态添加option选项 问题:想在combobox的下拉项里动态添加一些内容,但是添加不成功.因为jquery easyui的下拉列表combobox是用DIV模 ...

  6. Java学习过程中的总结的小知识点(长期更新)

    Java学习过程中的总结的小知识点 (主要是自己不会的知识和容易搞错的东西) 计算某个程序运行的时间 long stime=System.currentTimeMillis(); copy3(file ...

  7. js中关于value的一个小知识点(value既是属性也是变量)

    今天在学习input的value值时,发现这么一个小知识点,以前理解不太透彻. [1]以下这种情况是常见情况,会弹出“测试内容” <input type="button" v ...

  8. python中的小知识点

    这里是一些小知识点的汇集,为的是以后查找的方便. 行与缩进: 物理行:实际看到的代码行数. 逻辑行:在意义上的函数(即解释器执行的行数) 如果一个物理行中包含了多个逻辑行,则每个逻辑行之间需要用分号 ...

  9. EasyUI 中 Combobox里的onChange和onSelect事件的区别

    EasyUI 中 Combobox 选项发生改变时会触发 onChange,onSelect,onClick 3 个事件. 最近要做一个级联的 Combo 菜单,类似于选择地址时让用户填写省,市,区的 ...

随机推荐

  1. HDU 2098 分拆素数和

    HDU 2098 分拆素数和 Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768K (Java/Others) [题目描述 ...

  2. 一张png图片 上面有多个图标,如何用CSS准确的知道其中某个图片的坐标

    一张png图片 上面有多个图标,如何用CSS准确的知道其中某个图片的坐标 ,如下图 可以使用  background background:url(images/xx.png) 40px 10px n ...

  3. iOS - UIStoryboard

    前言 NS_CLASS_AVAILABLE_IOS(5_0) @interface UIStoryboard : NSObject @available(iOS 5.0, *) public clas ...

  4. iOS - UIDevice

    前言 NS_CLASS_AVAILABLE_IOS(2_0) @interface UIDevice : NSObject @available(iOS 2.0, *) public class UI ...

  5. MongoDB学习 (六):查询

    本文地址:http://www.cnblogs.com/egger/archive/2013/06/14/3135847.html  欢迎转载 ,请保留此链接๑•́ ₃•̀๑! 本文将介绍操作符的使用 ...

  6. JavaScript的严格模式

    js除了在普通的常规模式,ECMAscript 5添加了第二种运行模式:"严格模式"(strict mode).严格模式支持IE9+ Chrome FireFox 等主流浏览器. ...

  7. jquery 获取鼠标位置

    //获取鼠标位置 $(function(){ $('body').mousemove(function(e) { e = e || window.event; __xx = e.pageX || e. ...

  8. Java中去除StringBuffer最后一个字符

    原文:http://www.cnblogs.com/shaozhiheng/p/3661714.html 由于编写了这么一段代码: Iterator it3 = set.iterator(); whi ...

  9. 转:如何学习SQL(第二部分:从关系角度理解SQL)

    转自:http://blog.163.com/mig3719@126/blog/static/285720652010950825538/ 6. 从关系角度理解SQL 6.1. 关系和表 众所周知,我 ...

  10. HEVC编解码优化信息

    hevc解码GPU优化: 1.This GPU acceleration has opened up the possibility of playing a Full-HD (1080p) at 6 ...