Easyui之Datagrid编辑器Editor扩展（timespinner）

自定义时间选择器

最新推荐文章于 2020-12-22 04:58:22 发布

原创最新推荐文章于 2020-12-22 04:58:22 发布 · 4k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#Easy-UI #datagrid

学习专栏收录该内容

7 篇文章

订阅专栏

本文介绍了一种基于jQuery的方法来创建一个自定义的时间选择器组件。通过对现有的DatetimeBox进行修改，实现了Timespinner功能，该功能允许用户在网页上轻松地选择特定的时间。

项目需要用到时间调节器，网上找了下，有DatetimeBox的，没有Timespinner的，就改了下。

    $.extend($.fn.datagrid.defaults.editors, {
        timespinner: {
            init: function (container, options) {
                var input = $('<input />').appendTo(container);
                input.timespinner(options);
                return input;
            },
            getValue: function (target) {
                return $(target).timespinner('getValue');
            },
            setValue: function (target, value) {
                $(target).timespinner('setValue', value);
            },
            resize: function (target, width) {
                var input = $(target);
                if ($.boxModel == true) {
                    input.resize('resize', width - (input.outerWidth() - input.width()));
                } else {
                    input.resize('resize', width);
                }
            }
        }
    });