ValidForm表单验证如何和JqueryUI，DatePicker结合用？？

webchengping 2013-09-10 10:28:03

ValidForm自带的日期组件不好用，选择时间太麻烦了

<input name="TxtProduredDate" type="text" class="TextBox" id="TxtProduredDate" datatype="*" nullmsg="请填写生产日期！" errormsg="时间的格式不正确！" readonly="readonly" />

$.datepicker.parseDate("yy-mm-dd", "2007-01-26");
$('#TxtProduredDate').datepicker({
dateFormat: 'yy-mm-dd',
changeMonth: true,
changeYear: true,
monthNamesShort: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
dayNamesMin: ['日', '一', '二', '三', '四', '五', '六'],
yearRange: '1993:c'
});

会出现一个问题，验证的时机不会，应该是日期框隐藏之后才验证，而默认的是文本框失去焦点验证

...全文

326 5 打赏收藏举报

写回复

用AI写文章

5 条回复

切换为时间正序

请发表友善的回复…

发表回复

conanhhy 2013-09-10

打赏
举报

估计LZ漏看了，JQUERY UI里关于DATEPICKER的API文档里有提到，呵呵

webchengping 2013-09-10

打赏
举报

引用 2 楼 conanhhy 的回复:

$.datepicker有一个onClose的事件，LZ可以在该事件里加入CHECK代码


$("#tbxStartDate").datepicker({
        dateFormat: 'yy-mm-dd',
        changeMonth: true,
        changeYear: true,
        monthNamesShort: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
        dayNamesMin: ['日', '一', '二', '三', '四', '五', '六'],
        yearRange: '1993:c',
        onClose: function (selectedDate) {
            $("#tbxEndDate").datepicker("option", "minDate", selectedDate);
        }
    });

发现日期控件有onClose这个事件就知道解决方法了，官方JqueryUI里面DatePicker竟然没有把这个事件列出来，坑爹 http://api.jqueryui.com/datepicker/ 我的写法是这样的 var valid = $.registerform").Validform(); onClose: function () { if (window.valid) { valid.check(false, "#TxtProduredDate"); } }

conanhhy 2013-09-10

打赏
举报

刚才发的代码里，不小心贴上了多余的代码，重新附上


$("#tbxStartDate").datepicker({
        dateFormat: 'yy-mm-dd',
        changeMonth: true,
        changeYear: true,
        monthNamesShort: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
        dayNamesMin: ['日', '一', '二', '三', '四', '五', '六'],
        yearRange: '1993:c',
        onClose: function (selectedDate) {
            // 日期验证
        }
    });

conanhhy 2013-09-10

打赏
举报

$.datepicker有一个onClose的事件，LZ可以在该事件里加入CHECK代码


$("#tbxStartDate").datepicker({
        dateFormat: 'yy-mm-dd',
        changeMonth: true,
        changeYear: true,
        monthNamesShort: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
        dayNamesMin: ['日', '一', '二', '三', '四', '五', '六'],
        yearRange: '1993:c',
        onClose: function (selectedDate) {
            $("#tbxEndDate").datepicker("option", "minDate", selectedDate);
        }
    });

webchengping 2013-09-10