功能需求:页面主要有两个日历框,一个是当前日期,一个是去年同期,要求当用户改变当前日期时,同步修改去年同期为当前日期-1年。

当时刚接触到需求的第一时间想到的就是为< sx:datetimepicker >添加onchange事件,然后用document.getElementById().value获取控件的值,结果很悲催的发现当前日期控件的日期改变后另一个控件并没有同步修改。我在js函数中加入了一行alert();结果发现无论怎么改变日历框页面一直没有弹框,也就是说onchange事件一直没有被触发。随后我又用jquery进行了尝试,结果还是什么都没有发生。。。
在网上百度了好久,都没有找到合适的答案,最后在struts的官网(http://struts.apache.org/docs/datetimepicker.html)上看到了这个
 
< sx:datetimepicker >貌似是dojo的一个插件,需要使用dojo的时间处理机制和对象获取方式(具体原理不清楚。。。)
修改后的代码:
 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib uri="/struts-dojo-tags" prefix="sx"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>"> <title>九地市无线话务量查询</title> <meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<sx:head />
<script type="text/javascript" language="javascript">
//日期选择框同步
function synchronizeDate() {
var date = new Date(dojo.widget.byId("nowDay").getValue());
var year = date.getFullYear();
date.setYear(year - 1);
dojo.widget.byId("pastDay").setValue(date);
}
dojo.event.topic.subscribe("/value", synchronizeDate);
</script>
/head>
<body>
<sx:datetimepicker id="nowDay" name="now" label="当前日期" value="#request.now" displayFormat="yyyy-MM-dd" valueNotifyTopics="/value" />
<sx:datetimepicker id="pastDay" name="yesteryear" label="去年同期" value="#request.yesteryear" displayFormat="yyyy-MM-dd" />
</body>
至此,功能完成!
关键时刻还是官方文档可靠啊~~

使用JS控制struts的日期控件datetimepicker的更多相关文章

  1. js ui框架 My97日期控件 富文本编辑器

    My97日期控件 http://www.my97.net/dp/index.asp 富文本编辑器 http://www.kindsoft.net/demo.php 百度的magic也不错 http:/ ...

  2. C#日期控件datetimepicker保存空值方法

    方法一(推荐): 设置datetimepicker的属性ShowCheckBox为true 在窗口初始化时候,添加代码this.datetimepicker1.Checked = false; 保存日 ...

  3. 用mobiscroll.js如何简单使用日期控件

    首先,可以到官网学习,地址:https://docs.mobiscroll.com 第一步:引用js.css样式 1)mobiscroll.css 2)mobiscroll_date.css 3)jq ...

  4. zui框架配置日期控件只显示年月

    zui框架配置日期控件datetimepicker只显示年月 <!DOCTYPE html> <head> <script src="~/Scripts/jqu ...

  5. [js开源组件开发]js多选日期控件

    js多选日期控件 详情请见:http://www.lovewebgames.com/jsmodule/calendar.html 它的github地址:https://github.com/tianx ...

  6. phpcmsV9中表单向导在js调用里日期控件在IE下报Calendar未定义的解决办法

    最近在phpcmsV9里用表单向导弄个的提交表单,但用了日期和时间类型时,用   <script language='javascript' src='{APP_PATH}index.php?m ...

  7. JSP JS 日期控件的下载、使用及注意事项

    网上流行的时间日期控件比较多,个人觉得My97DatePicker的日期控件不错,值得推荐. 具体的使用过程如下: 1.下载My97DatePicker.rar或 My97DatePickerBeta ...

  8. js日期控件demo

    最近在钻研前端,写了个日期控件,内涵代码注释,希望能帮助到大家~ 1.html代码 <!DOCTYPE html> <html xmlns="http://www.w3.o ...

  9. js 日期控件 可以显示为和历

    日期控件的js <!-- /** * Calendar * @param beginYear 1990 * @param endYear 2010 * @param language 0(zh_ ...

随机推荐

  1. python 调用shell或windows命令

    目前使用到的有两种方式:os.system()和os.popen() import os os.system('cd e:cjx') #调用后返回执行结果状态 如果想获得返回结果,则使用以下方式: i ...

  2. Ubuntu安装与初始配置

    转载请注明作者:梦里风林 更多文章查看我的个人站: ahangchen.site 适用于Ubuntu版本 14.04/16.04LTS 64位 先上图 双系统安装 划分空闲磁盘,U盘安装ubuntu ...

  3. Oracle EBS-SQL (QA-2):检查接收未检验.SQL

    SELECT rsh.receipt_num                                                       收据号,         pov.vendor ...

  4. 一种全新的MEMS开关——高性能、快速、低能耗以及双稳态

    这种开关最早由申军教授和研究生阮梅春发明,研究生埃里克·朗格卢瓦在简化结构和缩小尺寸上作了探索,黄志林用相同原理做出了MEMS光学镜子开关,曹志良改变设计.材料和工艺后制作出了能同步开关的矩阵.这种M ...

  5. QT父子与QT对象delete

    原地址:http://www.qteverywhere.com/archives/437 很多C/C++初学者常犯的一个错误就是,使用malloc.new分配了一块内存却忘记释放,导致内存泄漏.Qt的 ...

  6. python图片小爬虫

    import re import urllib import os def rename(name): name = name + '.jpg' return name def getHtml(url ...

  7. poj1458 dp入门

    Common Subsequence Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 37551   Accepted: 15 ...

  8. Makefile与shell脚本区别

    http://blog.chinaunix.net/uid-20672257-id-3345593.html 在Makefile可以调用shell脚本,但是Makefile和shell脚本是不同的.本 ...

  9. CentOS 6.8yum源的配置

    Centos配置163的yum源 1.首先备份当前系统的yum源 # mv /etc/yum.repo.d/Centos-Base.repo /etc/yum.repo.d/Centos-Base.r ...

  10. 基本文件的I/O

    System.IO命名空间包含允许在数据流和文件上进行同步,异步及写入的类型.文件是一些永久存储及具有特定顺序的字节组成的一个有序的,具有名称的集合.与文件有关的概念是目录路径和磁盘存储等.流提供了一 ...