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 相关文章推荐
jQuery 1.0.4 - New Wave Javascript(js源文件)
Jan 15 Javascript
javascript 继承实现方法
Aug 26 Javascript
Javascript图像处理—亮度对比度应用案例
Jan 03 Javascript
JQuery入门——用bind方法绑定事件处理函数应用介绍
Feb 05 Javascript
Jquery遍历Json数据的方法
Apr 20 Javascript
辨析JavaScript中的Undefined类型与null类型
May 26 Javascript
JavaScript实现翻页功能(附效果图)
Feb 16 Javascript
浅谈react.js 之 批量添加与删除功能
Apr 17 Javascript
JavaScript闭包和回调详解
Aug 09 Javascript
JS实现中文汉字按拼音排序的方法
Oct 09 Javascript
微信小程序 MinUI组件库系列之badge徽章组件示例
Aug 20 Javascript
JavaScript Dom 绑定事件操作实例详解
Oct 02 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 session劫持和防范的方法
2013/11/12 PHP
PHP图片处理之图片旋转和图片翻转实例
2014/11/19 PHP
php文件上传类完整实例
2016/05/14 PHP
php使用json_decode后数字对象转换成了科学计数法的解决方法
2017/02/20 PHP
Jquery中获取iframe的代码
2011/01/11 Javascript
jquery中event对象属性与方法小结
2013/12/18 Javascript
探讨js字符串数组拼接的性能问题
2014/10/11 Javascript
JavaScript将数字转换成大写中文的方法
2015/03/23 Javascript
关于Bootstrap弹出框无法调用问题的解决办法
2016/03/10 Javascript
AngularJS使用ng-options指令实现下拉框
2016/08/23 Javascript
JS中的phototype详解
2017/02/04 Javascript
Vue-cli创建项目从单页面到多页面的方法
2017/09/20 Javascript
详解微信小程序审核不通过的解决方法
2018/01/17 Javascript
vue-router history模式下的微信分享小结
2018/07/05 Javascript
Nodejs调用Dll模块的方法
2018/09/17 NodeJs
一文看懂如何简单实现节流函数和防抖函数
2019/09/05 Javascript
javascript实现贪吃蛇经典游戏
2020/04/10 Javascript
[03:52]显微镜下的DOTA2第三期——英雄在无聊的时候干什么
2014/06/20 DOTA
[42:27]DOTA2上海特级锦标赛主赛事日 - 3 败者组第三轮#2Fnatic VS OG第三局
2016/03/05 DOTA
python更新列表的方法
2015/07/28 Python
Windows 安装 Anaconda3+PyCharm的方法步骤
2019/06/13 Python
pytorch 预训练层的使用方法
2019/08/20 Python
8段用于数据清洗Python代码(小结)
2019/10/31 Python
python将字符串转变成dict格式的实现
2019/11/18 Python
PyTorch的SoftMax交叉熵损失和梯度用法
2020/01/15 Python
python matplotlib 绘图 和 dpi对应关系详解
2020/03/14 Python
PyTorch在Windows环境搭建的方法步骤
2020/05/12 Python
CSS3实现超慢速移动动画效果非常流畅无卡顿
2014/06/15 HTML / CSS
html5写一个BUI折叠菜单插件的实现方法
2019/09/11 HTML / CSS
德国箱包网上商店:koffer24.de
2016/07/27 全球购物
开办加工厂创业计划书
2014/01/03 职场文书
QQ空间主人寄语大全
2014/04/12 职场文书
安全演讲稿大全
2014/05/09 职场文书
服务承诺书怎么写
2014/05/24 职场文书
光荣之路观后感
2015/06/12 职场文书
Pytest allure 命令行参数的使用
2021/04/18 Python