dojo:如何显示ListBox风格的选择框
常见的选择框控件:Selelct、FilteringSelect和ComboBox都是下拉框风格,而不是ListBox风格。
dojo还提供了一个dijit.form.MultiSelect控件可以解决问题并支持多选:http://dojotoolkit.org/reference-guide/1.10/dijit/form/MultiSelect.html
需要注意的是该空间不支持store这些,需要动态在JS代码中条件<OPTION>标签。
示例代码(在官网上的代码做了改动)
<!DOCTYPE html>
<html >
<head> <script>dojoConfig = {parseOnLoad: true}</script> <link rel="stylesheet" href="/lss/dojoroot/dijit/themes/claro/claro.css">
<script src="/lss/dojoroot/dojo/dojo.js" ></script> <script>
require([
"dijit/form/MultiSelect",
"dijit/form/Button",
"dojo/dom",
"dojo/_base/window",
"dojo/domReady!"],
function(MultiSelect, Button, dom, win){
var sel = dom.byId('dynamic');
var n = 0;
for(var i in dijit){
var c = win.doc.createElement('option');
c.innerHTML = i;
c.value = n++;
sel.appendChild(c);
} var myMultiSelect = new MultiSelect({ name: 'myMultiSelect' }, sel);
myMultiSelect.startup(); new Button({
onClick: function(){
alert(myMultiSelect.get('value'));
}
}, "progbutton").startup();
});
</script>
</head>
<body class="claro">
<select id="dynamic"></select>
<p><button id="progbutton" type="button">Get value</button></p>
</body>
</html>
dojo:如何显示ListBox风格的选择框的更多相关文章
- Unity编辑器扩展Texture显示选择框
学习NGUI插件的时候,突然间有一个问题为什么它这些属性可以通过弹出窗口来选中呢? 而我自己写的组件只能使用手动拖放的方式=.=. Unity开发了组件Inspector视图扩展API,如果我们要写插 ...
- 百度编辑器UEditor 点击上传图片选择框会延迟几秒才会显示 反应很慢(转)
转自:http://www.blogxuan.com/php/show/323.html UEditor 编辑器点击上传文件选择框会延迟几秒才会显示,反应很慢,上传图片选择框显示很慢. 1.uedit ...
- 修改页面中显示出需要修改的数据(包括select选择框复显示)
页面中需要用到某个对象时,在底层代码中赋值,然后页面用java代码进行获取调用 如下截图: select复显示:根据后台方法赋值选择框 ,并设置初始值 按钮及选择框的禁用(五种方法): 方法一: $( ...
- 使用showOptionDialog显示多项选择框
-----------------siwuxie095 工程名:TestJOptionPane 包名:com.siwuxie095.showdi ...
- layui下拉选择框select不显示
弹层layer下拉框没有样式_不可点击_没有效果_渲染失效的解决办法 一.必须给表单体系所在的父元素加上 class="layui-form" 在一个容器中设定 class=&qu ...
- java、easyui-combotree树形下拉选择框
最近一直在研究这个树形的下拉选择框,感觉非常的有用,现在整理下来供大家使用: 首先数据库的表架构设计和三级菜单联动的表结构是一样,(父子关系) 1.下面我们用hibernate建一下对应的额实体类: ...
- 自定义 Material Design风格的提示框
关闭 自定义 Material Design风格的提示框 2016-04-24 10:55 152人阅读 评论(0) 收藏 举报 版权声明:本文为博主原创文章,未经博主允许不得转载. 其实在14年谷歌 ...
- FancySelect – 更好用的 jQuery 下拉选择框插件
FancySelect 这款插件是 Web 开发中下拉框功能的一个更好的选择.FancySelect 使用方便,只要绑定页面上的任何 Select 元素,并调用就 .fancySelect() 就可以 ...
- Java——文件选择框:JFileChooser
import java.awt.BorderLayout; import java.awt.Container; import java.awt.event.ActionEvent; import j ...
随机推荐
- shell脚本实例-实现监控tcp的链接状态另一种方式批量创建用户
Array实现TCP的链接状态 #!/usr/bin/bash declare -A status type=`ss -an | grep :80|awk '{print $2}'` for i in ...
- webrtc 音频一点相关知识
采样频率: 44.1kHz ,它的意思是每秒取样44100次 .8kHz 8000次, 16kHz 160000次 比特率: 比特率是大家常听说的一个名词,数码录音一般使用16比特 ...
- 构造方法调用另一个构造方法,用this
using System; class Person { public int age; public string name; public Person(int age, string name) ...
- SpringMvc使用FastJson做为json的转换器(注解方式)
在使用XML方式配置项目,使用fastjson做为Json转换器时通常的在XML内添加如下的配置: <mvc:message-converters register-defaults=" ...
- 【Maven】Project configuration is not up-to-date with pom.xml错误解决方法
导入一个Maven项目之后发现有一个如下的错误: Project configuration is not up-to-date with pom.xml. Run project configura ...
- python --flask框架的搭建--(flask,python2,python3都可以运行)
在linux搭建flask开发环境: (1)virtualenv -p python3 flasky ---创建虚拟环境 (2)source flasky/bin/act ...
- 20155219 2016-2017-2 《Java程序设计》第7周学习总结
20155219 2016-2017-2 <Java程序设计>第7周学习总结 教材学习内容总结 认识时间与日期 时间的度量 1.格林威治时间(GMT):通过观察太阳而得,因为地球公转轨道为 ...
- transition的用法以及animation的用法
http://www.cnblogs.com/xiaohuochai/p/5347930.html transiton: 过渡属性 过渡所需要时间 过渡动画函数 过渡延迟时间: 触发过渡 单纯的代码不 ...
- Hive错误:User root is not allowed to impersonate anonymous
修改hadoop 配置文件 etc/hadoop/core-site.xml,加入如下配置项: <property> <name>hadoop.proxyuser.root.h ...
- Django ---- blog项目学习所得
一.登录功能 1.采用ajax 提交form表单的方式 2.后台生成随机验证码,登录时提交验证码 3.用PLI库生成随机验证码,置于session中,登录时与前台提交的code进行upeer()的验证 ...