amazeui datepicker日历控件 设置默认当日

背景:

最近在做一个系统的时候,前台需要选择日期,传给后台进行处理,每次都需要通过手动点击组件,选择日期,这样子很不好,所以我想通过程序自动实现,设置日期选择框默认值,这样子就不用每次都选了。

分析:

项目是使用Spring Boot+thymeleaf的技术栈实现的,日期控件data-am-datepicker我看了一下应该是基于amazeui(官网地址:http://amazeui.shopxo.net/),查看了一下官方文档,发现.datepicker('setValue', value)方法可以实现。

方法说明

方法名称 描述
.datepicker('open') 显示日历
.datepicker('close') 隐藏日历
.datepicker('place') 更新调用datepicker的相对位置
.datepicker('setValue', value) 设置Datepicker新值

代码:

<div class="am-form-group ">
<label for="record_date" class="am-u-sm-3 am-form-label">consume_date</label>
<div class="am-u-sm-9 am-radio">
<input type="text" class="am-form-field" id="record_date" placeholder="请选择日期"
data-am-datepicker readonly required name="record_date" />
</div>
</div>

加入代码:


$(function() {
var TodayDate = new Date();
$('#record_date').datepicker('setValue', TodayDate);
});

实现的效果

amazeui datepicker日历控件 设置默认当日的更多相关文章

  1. winform中的dateTimePicker控件设置默认值为空

    winform中的dateTimePicker控件设置默认值为空   第一步:设置Format的属性值为“Custom” 第二步:设置CustomFormat的属性值为空,需要按一个空格键

  2. 如何使用jqueryUi的datepicker日历控件?

    参考: http://www.jb51.net/article/85007.htm 这里的日历控件是, 基于jquery的jqureyui中的一个 widget. 需要js 文件: 外部的js文件, ...

  3. JQuery datepicker 日期控件设置

    datepicker控件可通过参数设置进行语言切换,以下可实现,系统所有日期控件默认为中文,在特定页面或者特定条件下可切换成英语!~ HTML: <!DOCTYPE html> <h ...

  4. 【前端控件】JQuery datepicker 日期控件设置

    datepicker控件可通过参数设置进行语言切换,以下可实现,系统所有日期控件默认为中文,在特定页面或者特定条件下可切换成英语!~ HTML: <!DOCTYPE html> <h ...

  5. 关于给gridSelect控件设置默认值

    给这个选择表格框添加默认值: <td class="form_label">                            客户名称:              ...

  6. html combobox select控件设置默认选项

    就想找个设置html combobox或者select默认选项的代码,百度搜了半小时不知所云的内容,其实很简单,代码如下 js的方式: var index = 你的下标 getElementById( ...

  7. jquery datepicker日历控件

    地址:http://jqueryui.com/datepicker/ 使用:$( "#datepicker" ).datepicker(); $.datepicker.setDef ...

  8. layui日历控件设置选择日期不能超过当前日期

    layui.use('laydate', function() { var laydate = layui.laydate; laydate.render({ elem : '#begin', max ...

  9. jQuery里面的datepicker日期控件默认是显示英文的,如何显示中文或其他语言呢?

    jQuery里面的datepicker日期控件默认是显示英文的,如何让他显示中文或其他呢? [官方的写法]: (1)引入JS文件: <script type="text/javascr ...

随机推荐

  1. 【翻译】Flink Table Api & SQL —— 连接到外部系统

    本文翻译自官网:Connect to External Systems  https://ci.apache.org/projects/flink/flink-docs-release-1.9/dev ...

  2. QLineEdit 加省略号

    第一种方法: QFontMetrics elidfont(ui->lineEdit->font()); ui->lineEdit->setText (elidfont.elid ...

  3. 面试之哈希表leetcode

    1 案例1 leetcode-----242 给定两个字符串 s 和 t ,编写一个函数来判断 t 是否是 s 的字母异位词. 示例 1: 输入: s = "anagram", t ...

  4. Oracle通过命令导入数据存储文件

    imp ztdev/ztdev FROMUSER=zt_base TOUSER=ztdev file=/home/oracle/zt_base_1023_sc_kk_new.dmp log=zt_ba ...

  5. ztree实现拖拽移动和复制

    1.官网下载ztree:http://www.treejs.cn/v3/api.php 2.引入jquery.ztree.all.min.js 注意,这是基于jQuery的插件,请引入相关js 3.设 ...

  6. qt creator的使用总结

    每一个不曾起舞的日子,都是对生命的辜负----------尼采 1.  HELP功能: 1)有时点击"HELP"之后,对应的页面里没有左侧的搜索栏.比较理想的状态是将左侧导航栏划分 ...

  7. QT_QML_常见问题

    1. qml文件中,如果要添加信号连接,如果与控件x有丁点关联,则将Connections{}最好放到该控件的{}内部,不这样做曾经遇到接受不到信号的奇葩问题. 2. 使用TabView时,在每个Ta ...

  8. 小程序常用操作,if,for,跳转,弹出提示

    if <block wx:if="{{result.child_items}}"> ... </block> <block wx:else> . ...

  9. LeetCode 537. 复数乘法(Complex Number Multiplication)

    537. 复数乘法 537. Complex Number Multiplication 题目描述 Given two strings representing two complex numbers ...

  10. [转帖]抢先AMD一步,英特尔推出新处理器,支持LPDDR5!

    抢先AMD一步,英特尔推出新处理器,支持LPDDR5! http://www.eetop.cn/cpu_soc/6946240.html 2019.10 intel的最新技术发展. 近日,知名硬件爆料 ...