Wednesday, 30 October 2013

Deveexpress Date Eadit Validating two Dates in Javascript using CustomeValidator

In this post i am going to explain how we can validate two DateEdit control which are Devexpress control using Custom Validator.

First drag and drop two devexpress datedit controls on the form

<dx:ASPxDateEdit ID="ASPxDateEdit1" ClientInstanceName="cliDate1" runat="server"
            DisplayFormatString="dd-MMM-yy" EditFormatString="dd-MMM-yy">
        </dx:ASPxDateEdit>
        <dx:ASPxDateEdit ID="ASPxDateEdit2" runat="server" ClientInstanceName="cliDate2"
            DisplayFormatString="dd-MMM-yy" EditFormatString="dd-MMM-yy">
        </dx:ASPxDateEdit>
        <asp:CustomValidator ID="cvDueDate" runat="server" ValidationGroup="vgCheck" ControlToValidate="ASPxDateEdit2"
            Display="Dynamic" ClientValidationFunction="compare"></asp:CustomValidator>

Script to compare the two dates on client side

<script type="text/javascript">
 function compare1(s, e) {
            var orderDate = cliDate1.GetDate();
            if (orderDate != null) {
                var dueDate = cliDate2.GetDate();
                if (dueDate != null) {
                    var orderYear = orderDate.getFullYear();
                    var orderMonth = orderDate.getMonth();
                    var orderDay = orderDate.getDate();
                    var corderDate = new Date(orderYear, orderMonth, orderDay);

                    var dueYear = dueDate.getFullYear();
                    var dueMonth = dueDate.getMonth();
                    var dueDay = dueDate.getDate();
                    var cDueDate = new Date(dueYear, dueMonth, dueDay);

                    if (cDueDate.toString() === corderDate.toString()) {
                        e.IsValid = true;
                    }
                    else if (cDueDate < corderDate) {
                        e.IsValid = false;
                    }
                    else {
                        e.IsValid = true;
                    }
                }
            }
        }
</script>

No comments:

Post a Comment