出生日期的验证日期，加入日期和离开日期 [英] Date Validation for Birth Date, Joining Date and Leaving Date

问题描述

我有三个文本框为 BirthDate ， JoiningDate & LeavingDate 。

I have three textboxes for BirthDate, JoiningDate & LeavingDate.

现在我想要的是： -

Now what I want is:-

加入日期和离开日期不应大于code> Birthdate

1. Joining date and Leaving date should not be greater than Birthdate

离开日期不应大于加入日期和 BirthDate

我使用了DatePicker。

I have used the DatePicker.

这是JS代码： -

Here is the JS code:-

$(function () {
        $("[id$=mainContent_txtdateofbirth], [id$=mainContent_txtdoj], [id$=mainContent_txtdol]").datepicker({
            textboxImageOnly: true,
            textboxImage: 'images/calendar.png',
            changeMonth: true,
            changeYear: true,
            dateFormat: "yy / mm / dd",
            yearRange: "-40:+0",
            maxDate: new Date(),
        });
    });

三个文本框是： -

The three textboxes are:-

<asp:TextBox ID="txtdateofbirth" CssClass="form-control" runat="server" ValidationGroup="AddNew"></asp:TextBox>
    <asp:TextBox ID="txtdoj" CssClass="form-control" runat="server" ValidationGroup="AddNew"></asp:TextBox>
    <asp:TextBox ID="txtdol" CssClass="form-control" runat="server" ValidationGroup="AddNew"></asp:TextBox>

更新的ASPX代码： -

UPDATED ASPX CODE:-

<tr>
        <td style="vertical-align: top;">
            <label class="control-label" for="dob">Date of Birth</label></td>
        <td>
            <div class="control-group">
                <div class="controls">
                    <asp:TextBox ID="txtdateofbirth" CssClass="form-control" autocomplete="off" runat="server" ValidationGroup="AddNew"></asp:TextBox>
                    <asp:RequiredFieldValidator ID="reqdob" runat="server" CssClass="error-class" ControlToValidate="txtdateofbirth" ErrorMessage="Please select the date of birth" ValidationGroup="AddNew"></asp:RequiredFieldValidator>
                </div>
            </div>
        </td>
    </tr>
    <tr>
        <td style="vertical-align: top;">
            <label class="control-label" for="subject">Date of Join</label></td>
        <td>
            <div class="control-group">
                <div class="controls">
                    <asp:TextBox ID="txtdoj" Wrap="true" CssClass="form-control" autocomplete="off" runat="server" ValidationGroup="AddNew"></asp:TextBox>
                    <asp:RequiredFieldValidator ID="reqdoj" CssClass="error-class" runat="server" ControlToValidate="txtdoj" ErrorMessage="Please add the date of joining" ValidationGroup="AddNew"></asp:RequiredFieldValidator>
                </div>
            </div>
        </td>
    </tr>

    <tr>
        <td style="vertical-align: top;">
            <label class="control-label" for="subject">Date of Leaving</label></td>
        <td>
            <div class="control-group">
                <div class="controls">
                    <asp:TextBox ID="txtdol" CssClass="form-control" autocomplete="off" runat="server" ValidationGroup="AddNew"></asp:TextBox>
                </div>
            </div>
        </td>
    </tr>

推荐答案

演示

验证功能

var validateData = function () {
    var bday = $('#birthdate').val();
    var jday = $('#joiningdate').val();
    var lday = $('#leavingdate').val();

    if (bday && jday && bday > jday) {return}
    if (bday && lday && bday > lday) {return}
    if (jday && lday && jday > lday) {return}

    return true;
};

被调用onClose datepicker事件后，可以显示什么错误消息。随意更改错误显示方法。

is called onClose event of datepicker, after what error message can be displayed. Feel free to change error displaying method.

    onClose: function () {
        validateData() ? $('#errormsg').hide() : $('#errormsg').show();
    }

更新

要添加一些css到错误消息添加类，如

To add some css to error message add class to it like

<div id="errormsg" class="error-msg">Invalid date</div>

然后你可以移动 display：none; 到你的css

And then you can move display: none; to your css

更新

演示必填字段

这篇关于出生日期的验证日期，加入日期和离开日期的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！