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. Inside Microsoft SQL Server 2008: T-SQL Querying 读书笔记1

    (5)SELECT   (5-2) DISTINCT    (5-3)TOP(<top_specifications>)   (5-1)<select_list> (1)FRO ...

  2. Dapper full example

    Skip to content Sign up Sign in This repository Explore Features Enterprise Blog Watch Star , Fork S ...

  3. Catalyst揭秘 Day6 Physical plan解析

    Catalyst揭秘 Day6 Physical plan解析 物理计划是Spark和Sparksql相对比而言的,因为SparkSql是在Spark core上的一个抽象,物理化就是变成RDD,是S ...

  4. Chrome浏览器安装插件提示(net::ERR_NAME_NOT_RESOLVED)

    在chrome的webstore中安装currently插件.使用goagentFQ后能正常访问,但出现"net::ERR_NAME_NOT_RESOLVED"错误. 该错误的含义 ...

  5. ValueError: No JSON object could be decoded?此种异常的解决方案之一

    第一次遇到这样的异常,实在不知道如何是好?进行了测试发现报错的json出没有问题,而且每次出现异常的位置不一样 于是我认为这样的问题可能是因为程序执行过快,所以很简单的解决办法是: def deal_ ...

  6. 《WPF程序设计指南》读书笔记——第3章 内容的概念

    1.Content属性及字体相关的属性 using System; using System.Windows; using System.Windows.Media; namespace LY.Dis ...

  7. 在Linux中,如何取出一个字符串的前5位

    问: 在Linux中,如何取出一个字符串的前5位? 常用的一些方法如下: [tough@toughhou ~]$ str=abcdef [tough@toughhou ~]$ echo $str ab ...

  8. C# asp Aspose.Cells 教程,包含增加勾选框,单元格,字体设置

    1,引用Aspose.Cells  dll 2,using Aspose.Cells; 3, Workbook excel = new Workbook(); string strFilePath = ...

  9. 基于SuperSocket实现的WebSocket(后端)

    关于WebSocket其实很早就想发了,奈何之前项目中的WebSocket的后端不是我做的,而我又想前后端都发出来和大家讨论讨论~于是挤出点时间研究了一下WebSocket的后端实现(所以才有了这篇文 ...

  10. jQuery的on方法和bind绑定多个事件

    on方法是官方推荐使用的方法比较新 1. on: 多个事件绑定同一个函数 $(document).ready(function(){ $("p").on("mouseov ...