使用easyui combobox初始化+在input中触发下拉框+获取值
效果图:

1.html
<input id="alarmLeve" class="easyui-combobox" name="alarmLeve" style="width:100px;display:inline-block;margin-right:20px;"/>
2.js
//初始化
$('#alarmLeve').combobox( {
multiple: true,
panelHeight: 'auto',//自适应
valueField: 'id',//绑定字段ID
textField: 'text',//绑定字段Name
onLoadSuccess:function(){
$(".combo").click(function(){
$(this).prev().combobox("showPanel");
});
},
data:[{
"id":1,
"text":"1"
},{
"id":2,
"text":"2"
},{
"id":3,
"text":"3"
},{
"id":4,
"text":"4"
}],
formatter: function (row) {
var opts = $(this).combobox('options');
return '<input type="checkbox" class="combobox-checkbox" style="margin:0 5px;vertical-align: -2px" id="' + row[opts.valueField] + '">' + row[opts.textField]
},
//获取数据URL
//选择树节点触发事件
onSelect: function (row) {
var opts = $(this).combobox('options');
var el = opts.finder.getEl(this, row[opts.valueField]);
el.find('input.combobox-checkbox')._propAttr('checked', true);
},
onUnselect: function (row) {
var opts = $(this).combobox('options');
var el = opts.finder.getEl(this, row[opts.valueField]);
el.find('input.combobox-checkbox')._propAttr('checked', false);
}
})
3.获取值
$('#comboboxlist').combobox('getValue'); //单选时
$('#comboboxlist').combobox('getValues'); //多选时
示例:


4.得到input的字符串
var l = $('#alarmLeve').combobox('getText'); //得到字符串
效果图:


使用easyui combobox初始化+在input中触发下拉框+获取值的更多相关文章
- easyui combobox点击输入框弹出下拉框
由于easyui combobox需要点击下拉箭头才能下拉,不能像select标签那样点击输入框就下拉,所以觉得不太方便,查看了一下,combobox弹出框是一个div,原本想在他的输入框的点击事件中 ...
- angular 中自己常用的下拉框获取值方法
方法一 HTML页中 <select name="" id="if02" data-first-option="true" (chan ...
- 选择屏幕中的下拉框和dialog中下拉框设计
REPORT YTEST014. PARAMETERS: auart LIKE vapma-auart AS LISTBOX VISIBLE LENGTH 6. AT SELECTION-SC ...
- ASP.NET MVC中的cshtml页面中的下拉框的使用
ASP.NET MVC中的cshtml页面中的下拉框的使用 用上@Html.DropDownList 先记下来..以做备忘...
- easyui datagrid combobox下拉框获取数据问题
最近在使用easyui的datagrid,在可编辑表格中添加一个下拉框,查了下API,可以设置type : 'combobox',来做下拉框,这下拉框是有了,可是这后台数据怎么传过来呢,通过查API可 ...
- LayUI中select下拉框选中触发事件
代码: var form = layui.form, layer = layui.layer; // 监听 $(document).ready(function() { // select下拉框选中触 ...
- easyui源码翻译1.32--Combo(自定义下拉框)
前言 扩展自$.fn.validatebox.defaults.使用$.fn.combo.defaults重写默认值对象.下载该插件翻译源码 自定义下拉框显示一个可编辑的文本框和下拉面板在html页面 ...
- easyui form load 数据表单有下拉框
(function () { $('#text1').combobox({ url: 'http://localhost:5463/test/getComboJson' }) $('#text2'). ...
- android中自定义下拉框(转)
android自带的下拉框好用不?我觉得有时候好用,有时候难有,项目规定这样的效果,自带的控件实现不了,那么只有我们自己来老老实实滴写一个新的了,其实最基本的下拉框就像一些资料填写时,点击的时候出现在 ...
随机推荐
- 【JavaScript框架封装】在实现一个自己定义类似于JQuery的append()函数的时候遇到的问题及解决方案
主要问题: 在刚开始创建了这个函数之后,使用的时候,总是会出现一个问题,就是按照正常步骤给一个ID选择器添加子节点的时候正常,但是到了给一个class选择器的元素添加的时候始终只能添加一个. 下面是我 ...
- Project Euler 15 Lattice paths
题意:在20×20方阵中从起点出发只允许向右或向下移动到达终点的路径有多少条. 思路:每次只能向右或者向下,总共 40 步,也就是 40 步中每一步都有两种选择,也就是 C (40 , 20) . 为 ...
- Project Euler 30 Digit fifth powers
题意:判断一个数 N 的每一位的5次方的和是否为其本身 ,求出所有满足条件的数的和 思路:首先设这个数 N 为 n 位,可以简单的判断一下这个问题的上界 10 ^ n <= 9 ^ 5 × n, ...
- 【LibreOJ 6278】 数列分块入门 2 (分块)
题目原址 给出一个长为n的数列,以及n个操作,操作涉及区间加法,询问区间内小于某个值x的元素个数. code: #include<cstdio> #include<iostream& ...
- Qt Quick 之 QML 与 C++ 混合编程具体解释
Qt Quick 技术的引入.使得你能够高速构建 UI ,具有动画.各种绚丽效果的 UI 都不在话下.但它不是万能的.也有非常多局限性,原来 Qt 的一些技术,比方低阶的网络编程如 QTcpSocke ...
- exceptional c++ 读书笔记 一 . vector 的使用
一. at() 与 operator[] void f(vector<int>& v) { v[0]; v.at(0); } 对于 vector 中的元素的随机访问有两种方 ...
- Maya 2012 破解安装全图文教程
在学习U3D的过程中.我们要用到Maya这个工具,(当然你也能够用其它类似的), 我在安装破解 Maya 2012 的过程其中,走了一些弯路.通过搜索发现,网上关于Maya 破解的文章大多语焉不详,为 ...
- 初学JavaScript之推測new操作符的原理
本文是一篇原理推測的文章,假设有不准确的地方请指正, 原文:http://blog.csdn.net/softmanfly/article/details/34833931 JavaScript中构造 ...
- hdoj--5532--Almost Sorted Array(正反LIS)
Almost Sorted Array Time Limit: 4000/2000 MS (Java/Others) Memory Limit: 262144/262144 K (Java/Ot ...
- 给centos重新安装yum的base-repo源
转自:https://blog.csdn.net/lovemysea/article/details/79552952 如果自己的centos的系统yum源出现问题了,如何才能修复? 方式一:使用国内 ...