ko.bindingHandlers.datepicker = {
init: function(element, valueAccessor, allBindingsAccessor) {
//initialize datepicker with some optional options
var options = allBindingsAccessor().datepickerOptions || {},
$el = $(element); $el.datepicker(options); //handle the field changing
ko.utils.registerEventHandler(element, "change", function () {
var observable = valueAccessor();
observable($el.datepicker("getDate"));
}); //handle disposal (if KO removes by the template binding)
ko.utils.domNodeDisposal.addDisposeCallback(element, function() {
$el.datepicker("destroy");
}); },
update: function(element, valueAccessor) {
var value = ko.utils.unwrapObservable(valueAccessor()),
$el = $(element); //handle date data coming via json from Microsoft
if (String(value).indexOf('/Date(') == 0) {
value = new Date(parseInt(value.replace(/\/Date\((.*?)\)\//gi, "$1")));
} var current = $el.datepicker("getDate"); if (value - current !== 0) {
$el.datepicker("setDate", value);
}
}
};
<input data-bind="datepicker: myDate, datepickerOptions: { minDate: new Date() }" />

http://stackoverflow.com/questions/6399078/knockoutjs-databind-with-jquery-ui-datepicker

js例子

http://jsfiddle.net/rniemeyer/NAgNV/

datepicker的api

http://api.jqueryui.com/datepicker/

knockout 绑定 jquery ui datepicker (转)的更多相关文章

  1. JQuery UI datepicker 使用方法(转)

    官方地址:http://docs.jquery.com/UI/Datepicker,官方示例: http://jqueryui.com/demos/datepicker/. 一个不错的地址,用来DIY ...

  2. 页面日期选择控件--jquery ui datepicker 插件

    日期选择插件Datepicker是一个配置灵活的插件,我们可以自定义其展示方式,包括日期格式.语言.限制选择日期范围.添加相关按钮以及其它导航等.官方地址:http://docs.jquery.com ...

  3. jQuery UI Datepicker使用介绍

    本博客使用Markdown编辑器编写 在企业级web开发过程中,日历控件和图表控件是使用最多的2中第三方组件.jQuery UI带的Datepicker,日历控件能满足大多数场景开发需要.本文就主要讨 ...

  4. jQuery UI Datepicker&Datetimepicker添加 时-分-秒 并且,判断

    jQuery UI Datepicker时间(年-月-日) 相关代码: <input type="text" value="" name="ad ...

  5. 坑爹的jquery ui datepicker

    1.坑爹的jquery ui datepicker 竟然不支持选取时分秒,害的我Format半天 期间尝试了bootstrap的ditepicker,但是不起作用,发现被jquery ui 覆盖了, ...

  6. [转]Using the HTML5 and jQuery UI Datepicker Popup Calendar with ASP.NET MVC - Part 4

    本文转自:http://www.asp.net/mvc/overview/older-versions/using-the-html5-and-jquery-ui-datepicker-popup-c ...

  7. jQuery UI datepicker z-index默认为1 怎么处理

    最近在维护一个后台系统的时候遇到这样的一个坑:后台系统中日期控件使用的是jQuery UI datepicker. 这个控件生成的日期选择框的z-index = 1.问题来了.页面上有不少z-inde ...

  8. Jquery UI - DatePicker 在Dialog中无法自动隐藏的解决思路

    通过Jquery UI Dialog模态展示如下的一个员工编辑页面,但是遇到一个奇怪的问题:点击Start Date的input元素后,其无法失去焦点.从而导致DatePicker控件在选择日期后无法 ...

  9. jQuery UI Datepicker

    http://www.runoob.com/try/try.php?filename=jqueryui-example-datepicker-dropdown-month-year <!doct ...

随机推荐

  1. html5画四边形

    <canvas id='test02'></canvas> <script> var canvas = document.getElementById('test0 ...

  2. PHP 跨域写cookie

    实际工作中,类似这样的要求很多,比如说,我们有两个域名,我们想实现在一个域名登录后,能自动完成另一个域名的登录,也就是PASSPORT的功能. 我只写一个大概,为了测试的方便,先编辑hosts文件,加 ...

  3. 1048. Find Coins (25)

    时间限制 50 ms 内存限制 65536 kB 代码长度限制 16000 B 判题程序 Standard 作者 CHEN, Yue Eva loves to collect coins from a ...

  4. C语言-创建链表及排序

    #include <stdio.h> #define NEWNODE (Node *)malloc(sizeof(Node)) typedef struct mynode{ int num ...

  5. Could not retrieve mirrorlist http://mirrorlist.centos.org || PYCURL ERROR 6

    yum:Could not retrieve mirrorlist http://mirrorlist.centos.org || PYCURL ERROR 6 通过centos安装openldap的 ...

  6. EXTJS 3.0 资料 控件之 GridPanel属性与方法大全

    1.Ext.grid.GridPanel 主要配置项: store:表格的数据集 columns:表格列模式的配置数组,可自动创建ColumnModel列模式 autoExpandColumn:自动充 ...

  7. iOS 基础 第二天(0805)

    0805 面向对象三大特性 封装.继承和多态 oc的方法都是在运行过程中才会检测的.编译时方法没实现只会出现警告,运行时出错.如果方法实现了但没有声明,运行时对象仍然可以调用方法不会出错.这是OC中弱 ...

  8. 【POJ2104】kth num

    You are working for Macrohard company in data structures department. After failing your previous tas ...

  9. Rust入门篇 (1)

    Rust入门篇 声明: 本文是在参考 The Rust Programming Language 和 Rust官方教程 中文版 写的. 个人学习用 再PS. 目录这东东果然是必须的... 找个时间生成 ...

  10. 关于HTML Input

    定义:<input> 标签用于搜集用户信息.Input表示Form表单中的一种输入对象. 根据不同的 type 属性值,输入字段拥有很多种形式.输入字段可以是文本字段.复选框(单/复选框) ...