个人中心
文章发布
退出
作者热门文章
- iOS/Objective-C 元类和类别
- objective-c - -1001 错误，当 NSURLSession 通过 httpproxy 和/etc/hosts
- java - 使用网络类获取 url 地址
- ios - 推送通知中不播放声音
26
4
在我的 GWT 应用程序中，我使用 Javascript 库为用户提供 SQL Where 字符串生成器功能 - 用于支持“高级搜索”。
javascript 资源目前只提供纯 html 日期文本字段。如果我使用纯 JS，我会合并许多第 3 方日期选择器库之一。
但是，我已经在客户端中安装了 GWT 日期编辑器(以支持其他 UI 功能)。
谁能推荐一种将 GWT 弹出式编辑器合并到我的遗留 javascript 中的策略？由于 GWT 编译器混淆，我认为我无法可靠地预测 GWT 日期编辑器组件类的名称。
我想这是从 GWT 推送配置或从 javascript 源中拉取配置之间的平衡。
干杯，伊恩
最佳答案
首先，在您的 html 中创建您希望日期选择器所在的位置，如下所示:
<span id="dateBox"/>
创建一个新的入口点，称为集成
package com.example.integration.client;
import java.util.Date;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.i18n.client.DateTimeFormat;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.datepicker.client.DateBox;
/**
* Entry point classes define <code>onModuleLoad()</code>.
*/
public class Integration implements EntryPoint {
@Override
public void onModuleLoad() {
//create date box
DateBox dateBox = new DateBox();
//set the value for the form submit
dateBox.getTextBox().getElement().setId("dateValueField");
//we need to override the default format
dateBox.setFormat(new DateBox.DefaultFormat() {
private DateTimeFormat dtf = DateTimeFormat.getFormat("MM/dd/yyyy");
@Override
public void reset(DateBox dateBox, boolean abandon) {
super.reset(dateBox, abandon);
}
@Override
public Date parse(DateBox dateBox, String text, boolean reportError) {
return super.parse(dateBox, text, reportError);
}
@Override
public String format(DateBox dateBox, Date date) {
if(date == null) return "";
return this.dtf.format(date);
}
});
//add to the span
RootPanel.get("dateBox").add(dateBox);
}
}
你应该把它放在一个新模块中，比如 com.example.integration.Integration.gwt.xml。
<module rename-to='integration'>
<!-- Inherit the core Web Toolkit stuff. -->
<inherits name='com.google.gwt.user.User'/>
<inherits name='com.google.gwt.user.theme.clean.Clean'/>
<!-- Specify the app entry point class. -->
<entry-point class='com.example.integration.client.Integration'/>
<!-- Specify the paths for translatable code -->
<source path='client'/>
<source path='shared'/>
</module>
现在您已完成此操作，您需要执行标准的 GWT 操作以将编译后的代码添加到您的 HTML 中。您的最终 HTML 应该类似于:
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link type="text/css" rel="stylesheet" href="Integration.css">
<title>Web Application Starter Project</title>
<script type="text/javascript" language="javascript" src="integration/integration.nocache.js"></script>
</head>
<body>
<!-- OPTIONAL: include this if you want history support -->
<iframe src="javascript:''" id="__gwt_historyFrame" tabIndex='-1' style="position:absolute;width:0;height:0;border:0"></iframe>
<!-- RECOMMENDED if your web app will not function without JavaScript enabled -->
<noscript>
<div style="width: 22em; position: absolute; left: 50%; margin-left: -11em; color: red; background-color: white; border: 1px solid red; padding: 4px; font-family: sans-serif">
Your web browser must have JavaScript enabled
in order for this application to display correctly.
</div>
</noscript>
<form id="form">
<!-- old style date including formatting javascript and all the old cruft -->
Old Style Date:<input type="text" id="sometext" value="MM/DD/YYYY"/><br/>
<!-- new style. substitute your own styles and whatnot to make it not strange -->
New Hotness:<span id="dateBox"/>
<!-- you can submit this form as it is and it will just work (tm) -->
</form>
</body>
</html>
现在您的表单中将有一个表单项(文本输入框)，其 ID 为“dateValueField”。这将像常规表单元素一样提交。
因此，这些建议中的一些应该能够帮助您上路。祝你好运。
注意，有一些更小、更简单的 javascript 库(包括一些 jQuery 的东西)可以更容易地做到这一点。
关于javascript - 在 Javascript 算法中重用 GWT DatePicker 的策略，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/6111547/
26
4
0
我正在尝试使用 720Kb 日期选择器。 https://github.com/720kb/angular-datepicker 使用简单示例时: 我收到打击错误: angular.js:1
我开始使用react-datepicker组件。 https://github.com/Hacker0x01/react-datepicker 我运行了该示例，现在我想对其进行调整，使其没有初始值。示
我正在使用 Angular-ui 日期选择器，除了日期选择器的初始状态外，一切实际上都工作正常。我选择日期后，看起来不错。见下文: 初始状态 在选择器中选择日期后 所以，显然我在第一种情况下得到了日期
我需要为回历日期设置日期选择器。我可以使用 jquery datepicker 或 bootstrap datepicker。但是我写了这段代码
在选择范围时，我遇到了 jquery UI datepicker 的一个奇怪问题。在提出问题之前，我正在研究许多其他人编写的代码。他们以优化的顺序包含了 jquery 工具和 UI，因此所有功能都可以
我有两个剑道 DatePickers 来选择工作的开始和结束日期。作业由多个任务组成，其中包含自己的完成日期(任务在网格中列出，每条记录使用 kendo DatePicker 选择完成日期) 当用户设
我想将功能添加到 Material 日期选择器，以便能够选择周.. 因此，当我从一行中选择一个日期时，我希望它输出从一周开始到一周结束的日期范围。 我之前在常规 jquery 日历上这样做过--检查照
在 SwiftUI 中使用新的 (iOS 14) DatePicker，它按预期工作并且在模拟器和设备上看起来很好，但是一旦日历弹出，我会在输出窗口中收到几行警告。这有点烦人! 虽然日志贴在下面，但看
我将如何创建 doctrine_orm_datetime_range使用 jQuery UI 日期选择器的 Sonata Admin Bundle 中的过滤器？ 我尝试了以下方法，但不起作用: pro
有人知道如何设置 gem bootstrap-datepicker-rails 吗？我按照 http://rubydoc.info/gems/bootstrap-datepicker-rails/0.
在 kartik DatePicker Yii2 中有没有办法 - 我可以禁用大于当前日期的日期？ 例如:如果今天是 2016 年 3 月 14 日，则应禁用 2016 年 3 月 15 日的日历日期
在 UIDatePicker 我们可以做这样的事情 datePicker.timeZone = TimeZone(secondsFromGMT: 5*60*60) 为了指定日期选择器的时区。 但是如何
我在 FullCalendar ( http://www.eyecon.ro/datepicker/ ) 页面正下方添加了一个 datePicker ( http://fullcalendar.io
我在一个 Polymer 项目中有两个 Vaadin-datepickers。一个有开始日期，一个有结束日期。我想确保结束日期总是在开始日期之后。我阅读了 API 文档，他们说您可以使用 min ma
我正在Angular 6中搜索Datepicker，它可以显示基于回历日历的阿拉伯日期。 似乎找不到一个。是否有可用的东西，或者我们需要从头开始构建它。 最佳答案 Ng bootstrap或angul
JavaFX8 中是否有一种方法可以从 Java 代码中选择 DatePicker 中的日期(作为文本)？我想以这样一种方式激活带有 DatePicker 的控件，用户可以在不使用鼠标的情况下编辑日期
我在一个 Polymer 项目中有两个 Vaadin-datepickers。一个有开始日期，一个有结束日期。我想确保结束日期总是在开始日期之后。我阅读了 API 文档，他们说您可以使用 min ma
我正在尝试验证datepicker，因为startDate应始终小于EndDate。如果我手动更改日期，则 StartDate 有效，但 EndDate 无效。 我的JavaScript代码: $(d
我是 jquery 和 javascript 的菜鸟。因此，虽然我看过很多解决我的问题的 SO 帖子，但我无法将各种解决方案“组装”成适合我的东西。 我的上下文:查询结果显示在表单中。在每一行中，其中
我正在开发 Windows Phone 8.1 应用程序。我正在尝试使用 DatePickerFlyout 但没有取得适当的成功。我正在选择日期并尝试用选定的日期设置按钮内容，但它没有设置。当我调试以
我是一名优秀的程序员,十分优秀！