EasyUI:年份、月份下拉框Demo

jsp中定义:

<td width="10%" height="25px" style="text-align:center;"><font style="font-size: 12px;">年度:</font></td>
<td width="15%" height="25px" style="text-align: left;">
  <input id="yearChoose" name="yearChoose" class="easyui-combobox ui-text" type="text" value="${yearChoose}" style="width:120px" />
</td>
<td width="10%" height="25px" style="text-align:center;"><font style="font-size: 12px;">月份:</font></td>
<td width="15%" height="25px" style="text-align: left;">
  <input id="monthChoose" name="monthChoose" class="easyui-combobox ui-text" type="text" value="${monthChoose}" style="width:120px" />
</td>

js中初始化:

//年度下拉框初始化
$("#yearChoose").combobox({
valueField:'year',
textField:'year',
panelHeight:'auto'
});
var data = [];//创建年度数组
var startYear;//起始年份
var thisYear=new Date().getUTCFullYear();//今年
var endYear=thisYear+1;//结束年份
//数组添加值(2012-2016)//根据情况自己修改
for(startYear=endYear-4;startYear<=thisYear;startYear++){ 
  data.push({"year":startYear});
}
$("#yearChoose").combobox("loadData", data);//下拉框加载数据
$("#yearChoose").combobox("setValue",thisYear);//设置默认值为今年
//月度下拉框初始化
$("#monthChoose").combobox({
valueField:'month',
textField:'month',
panelHeight:'auto',
editable:false
});
var data1 = [];//创建月份数组
var startMonth=1;//起始月份
var thisMonth=new Date().getUTCMonth()+1;//本月
//数组添加值(1-12月)为固定值
for(startMonth;startMonth<13;startMonth++){
  data1.push({"month":startMonth});
}
$("#monthChoose").combobox("loadData", data1);//下拉框加载数据
$("#monthChoose").combobox("setValue",thisMonth);//设置默认值为本月

效果(年份):

效果(月份):

EasyUI:年份、月份下拉框Demo的更多相关文章

  1. easyui的combobox下拉框初始化默认值以及保持该值一直显示的方法

    easyui的combobox下拉框默认初始值是空,下面是实现从远程加载数据之后初始化默认值,以及让该值一直排在下拉框的最顶部的方式. 目前的需求是需要在初始化的时候添加"全部数据库&quo ...

  2. jquery easyui无法绑定下拉框内容

    最近在研究jquery easyui的DataGrid,发现DataGrid中的下拉框无法绑定值,找了很久也没发现是具体问题所在,最后还是同事帮忙搞定的.具体问题竟然是jquery easyui提供的 ...

  3. easyui datagrid combobox下拉框获取数据问题

    最近在使用easyui的datagrid,在可编辑表格中添加一个下拉框,查了下API,可以设置type : 'combobox',来做下拉框,这下拉框是有了,可是这后台数据怎么传过来呢,通过查API可 ...

  4. Easyui多个下拉框联动效果

    好久没写前端了,以前在做多级联动的时候,用的是easyui的tree结构,但是需要一次性全部加载,不是按需加载,性能不好,退而求其之,用多个下拉框做 eayui的combobox  有onSelect ...

  5. ajax 多级联动 下拉框 Demo

    写了ajax实现级联下拉框,考虑常用,并且级联个数随不同业务个数不同,于是就整理了一下,实现了 ajax + N级联动 下拉框的效果 效果图 HTML 代码 <h2> 省级联动</h ...

  6. EasyUI combobox实现下拉框多选遇坑记录

    场景一: 多选正常从第二个选项增加逗号,我选第一个的时候就冒出一个逗号 解决方案一: 这是因为当前的下拉框的值可能为undefined,需要手动清空一下 $("#id").comb ...

  7. EasyUI清空combotree下拉框图标

    代码: //清空combotree下拉框图标 $(".tree-icon,.tree-file").removeClass("tree-icon tree-file&qu ...

  8. js中年份、月份下拉框

    <select id="year" style="width: 100px;"></select> <select id=&quo ...

  9. easyui中自定义下拉框的使用

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

随机推荐

  1. js阻止事件冒泡和标签默认行为

    ////阻止事件冒泡函数和 // 阻止默认浏览器动作(W3C) 要一起使用效果好<a href="/Scripts/newfiber_js_lib/images/1.jpg" ...

  2. Windows窗口的层次关系(转)

    今天看到这篇文章,觉得蛮有用的,我之前也对这个不大了解,特转载此处. 转载地址:http://www.51testing.com/html/200804/n80848.html 在Window 的图形 ...

  3. 如何使用android studio及夜神模拟器开发调试

    android studio 只安装sdk(不安装自带模拟器)1.下载并安装夜神模拟器 2.先启动夜神模拟器 3.然后运行cmd命令,cd到夜神安装目录(bin目录下),执行命令: nox_adb.e ...

  4. Fluent Ribbon 第七步 状态栏

    上一节,介绍了StartScreen的主要功能,本节介绍Ribbon的另外一个小功能StatusBar,状态栏是脱离ribbon之外单独存在,可以单独使用的控件 其基本代码定义如下: <Flue ...

  5. Spoken English Practice(I'm gonna do something I never thought I'd be able to)

    绿色:连读:                  红色:略读:               蓝色:浊化:               橙色:弱读     下划线_为浊化 口语蜕变(2017/7/6) 英 ...

  6. Outlook自动回复功能无法使用

    Outlook2010      http://support.microsoft.com/viewkb/viewkb.aspx?contentid=2596516 Outlook2007       ...

  7. 剑指Offer——旋转数组的最小数字

    题目描述: 把一个数组最开始的若干个元素搬到数组的末尾,我们称之为数组的旋转. 输入一个非递减排序的数组的一个旋转,输出旋转数组的最小元素. 例如数组{3,4,5,1,2}为{1,2,3,4,5}的一 ...

  8. java 链表常见题目

    如何判断单链表是否存在环 方法一.穷举遍历方法一:首先从头节点开始,依次遍历单链表的每一个节点.每遍历到一个新节点,就从头节点重新遍历新节点之前的所有节点,用新节点ID和此节点之前所有节点ID依次作比 ...

  9. 转!!mysql 查询条件不区分大小写问题

    做用户登录模块时,输入用户名(大/小写)和密码 ,mysql都能查出来.-- mysql查询不区分大小写. 转自 http://blog.csdn.net/qishuo_java/article/de ...

  10. 使用Redis的五个注意事项(命名)

    原文:使用Redis的五个注意事项 下面内容来源于Quora上的一个提问,问题是使用Redis需要避免的五个问题.而回答中超出了五个问题的范畴,描述了五个使用Redis的注意事项.如果你在使用或者考虑 ...