Easyui的组合框的取值与赋值


Posted in Javascript onOctober 28, 2016

近期由于工作需要,用户点击下拉框可以试下多选的效果,效果大致如下图:

Easyui的组合框的取值与赋值

实现的代码如下:

<select id="iweekDay" class="col-sm-4 form-control easyui-combobox " name="state" data-options="multiple:true,multiline:true" style="width:350px;height:35px" >
<option value="1">1</option>
<option value="2">2</option> 
<option value="3">3</option> 
<option value="4">4</option> 
<option value="5">5</option> 
<option value="6">6</option> 
<option value="7">7</option> 
</select>

最主要的是:multiple:true表示下拉框可以多选,如果单选:multiple:false单选

下面总结下combobox的取值与赋值

2、赋值

(1)单选赋值setValue

$('#Id').combobox('setValue','key')

(2)多选赋值setValues

多选key值是一个数组,$('#Id').combobox('setValues','key1,key2,key3'.split(','))

注意:'key1,key2,key3'.split(',')将字符串切分为数组,因为combobox的第二个参数是数组

3.取值

(1)单选取值getValue

$('#Id').combobox('getValue')

(2)多选取值getValues

多选key值是一个数组,$('#Id').combobox('getValues')

注意:取得的值是一个数组,如果想转换为以逗号分隔的字符串的话例如("1,2,3"),使用join方法,代码如下:

var str=$('#Id').combobox('getValues').join(",");

PS:下面看下easyui selectbox 赋值 取值的完整代码

赋值 取值

// Redefine the banner
var storeName_value = '@ViewBag.StoreName';
var department_value = '@ViewBag.Department';
var changeDate_value = '@ViewBag.ChangeDate';
$('#StoreName option:selected').text(storeName_value); 
$('#Department option:selected').text(department_value);
//$('#StoreName').combobox('setValue', storeName_value);
//$('#Department').combobox('setValue', department_value);
// bind searchBtn
$('#this_submit').bind('click', function () {
// var st = $('#StoreName option:selected').text().trim();
// var dep = $('#Department option:selected').text().trim();
var st = $('#StoreName').combobox('getValue');
var dep = $('#Department').combobox('getValue');
var changeDate = $('#datepicker').val();
var href = '../';
href += '&storeName=' + st + '&department=' + dep + '&changeDate=' + changeDate;
href += '&page=1&size=8';
window.location.href = href;
});

以上所述是小编给大家介绍的Easyui的组合框的取值与赋值,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
如何使用Javascript正则表达式来格式化XML内容
Jul 04 Javascript
基于JQuery的列表拖动排序实现代码
Oct 01 Javascript
JavaScript+html5 canvas绘制缤纷多彩的三角形效果完整实例
Jan 26 Javascript
详解JavaScript的AngularJS框架中的表达式与指令
Mar 05 Javascript
基于RequireJS和JQuery的模块化编程——常见问题全面解析
Apr 14 Javascript
seajs学习教程之基础篇
Oct 20 Javascript
JavaScript实现的反序列化json字符串操作示例
Jul 18 Javascript
关于vue2强制刷新,解决页面不会重新渲染的问题
Oct 29 Javascript
vue props 单项数据流实例分享
Feb 16 Javascript
jquery实现垂直手风琴导航栏
Feb 18 jQuery
使用Vue+Django+Ant Design做一个留言评论模块的示例代码
Jun 01 Javascript
原生小程序封装跑马灯效果
Oct 21 Javascript
JS制作适用于手机和电脑的通知信息效果
Oct 28 #Javascript
Jquery UI实现一次拖拽多个选中的元素操作
Dec 01 #Javascript
浅谈js继承的实现及公有、私有、静态方法的书写
Oct 28 #Javascript
jQuery.datatables.js插件用法及api实例详解
Oct 28 #Javascript
扩展jquery easyui tree的搜索树节点方法(推荐)
Oct 28 #Javascript
浅谈jQuery中的eq()与DOM中element.[]的区别
Oct 28 #Javascript
js基础之DOM中document对象的常用属性方法详解
Oct 28 #Javascript
You might like
PHP反射机制用法实例
2014/08/28 PHP
php实现的替换敏感字符串类实例
2014/09/22 PHP
php中session_id()函数详细介绍,会话id生成过程及session id长度
2015/09/23 PHP
PHP实现的浏览器检查类
2016/04/11 PHP
PHP中常用的数组操作方法笔记整理
2016/05/16 PHP
PHP如何通过表单直接提交大文件详解
2019/01/08 PHP
Chrome Form多次提交表单问题的解决方法
2011/05/09 Javascript
JQuery中$(document)是什么意思有什么作用
2014/07/21 Javascript
jQuery+HTML5+CSS3制作支持响应式布局时间轴插件
2016/08/10 Javascript
javascript验证手机号和实现星号(*)代替实例
2016/08/16 Javascript
JavaScript调试的多个必备小Tips
2017/01/15 Javascript
vue中如何引入jQuery和Bootstrap
2017/04/10 jQuery
nodejs个人博客开发第二步 入口文件
2017/04/12 NodeJs
vue通过watch对input做字数限定的方法
2017/07/13 Javascript
Angular之toDoList的实现代码示例
2017/12/02 Javascript
JS实现“全选”和&quot;全不选&quot;功能代码实例
2020/02/06 Javascript
Python 用户登录验证的小例子
2013/03/06 Python
利用python实现数据分析
2017/01/11 Python
使用python遍历指定城市的一周气温
2017/03/31 Python
Python 异常处理的实例详解
2017/09/11 Python
用Python登录好友QQ空间点赞的示例代码
2017/11/04 Python
CentOS7安装Python3的教程详解
2019/04/10 Python
Python shutil模块用法实例分析
2019/10/02 Python
python3处理word文档实例分析
2020/12/01 Python
深入浅出CSS3 background-clip,background-origin和border-image教程
2011/01/27 HTML / CSS
行政管理专业推荐信
2013/11/02 职场文书
外语系毕业生自荐信范文
2013/12/16 职场文书
客服部工作职责范本
2014/02/14 职场文书
聚美优品广告词改编
2014/03/14 职场文书
2014年防汛工作总结
2014/12/08 职场文书
大学生见习总结报告
2015/06/24 职场文书
城南旧事读书笔记
2015/06/29 职场文书
股权投资协议书
2016/03/23 职场文书
导游词之上海豫园
2019/10/24 职场文书
MySQL锁机制
2021/04/05 MySQL
粗暴解决CUDA out of memory的问题
2021/05/22 Python