Category: JavaScript

15 Apr 2017 01:59

Joined:	12/06/2016
Level:	Silver
Points:	101

Points:	5

Display error message for from date and to date using javascript

Below is my code in aspx page for from date, to date now I need to do the client side validation for from date and to date such that I need to display error message if from date given in textbox is greater than to date given in the text box also from date and to date should not be greater than todays date I tried so many JavaScript examples but none of them worked for me.

<span>
ProjectName:<asp:DropDownList ID="ddlProjectNameTA" runat="server" AutoPostBack="True" OnSelectedIndexChanged="ddlProjectNameTA_SelectedIndexChanged"></asp:DropDownList> <%----%>
</span>
<span>
(OR) UserName:<asp:DropDownList ID="ddlUsers" runat="server" AutoPostBack="true" OnSelectedIndexChanged="ddlUsers_SelectedIndexChanged"></asp:DropDownList>
</span>
</div><br />
<div style="padding-left:100px">
<span>
(OR) From Date<asp:TextBox ID="txtTAFromDate" Width="113px" runat="server" ReadOnly="true" ></asp:TextBox> <img src="calendar.png" />
</span>
<span>
To Date<asp:TextBox ID="txtTAToDate" Width="113px" runat="server" ReadOnly="true" ></asp:TextBox> <img src="calendar.png" />
<asp:Button ID="btnGet" runat="server" Text="GET" OnClick="btnGet_Click"/>
</span>
what i tried-

<asp:CompareValidator ID="CompareValidator1" ValidationGroup = "Date" ForeColor = "Red" runat="server" ControlToValidate = "txtStartDate" ControlToCompare = "txtEndDate" Operator = "LessThan" Type = "Date" ErrorMessage="Start date must be less than End date."></asp:CompareValidator> i tried compare validator by placing ValidationGroup = "Date" but i need to do with javascript moreover even this compare validator is not working as per my requirement

#769182

19 Apr 2017 19:32

Joined:	18/12/2008
Level:	Gold
Points:	2921

Points:	4

Hi,

I am not able to go through your complete code. But please check the below code and let us know if that what you are looking for.


<asp:Button ID="btnGet" runat="server" OnClientClick="return compareDate()"  Text="GET" OnClick="btnGet_Click" />

Now in the JavaScript we can call this compareDate(),



function compareDate() {
            var from = document.getElementById('<%= txtTAFromDate.ClientID %>').value;
            var to = document.getElementById('<%= txtTAFromDate.ClientID %>').value;
            // assuming the date is in dd/mm/yyyy format
            from = toDateObject(from);
            to = toDateObject(to);
            if (from > to)
            {
                alert('start date should be lesser than end date');
                return false;
            }
            return true;
 
        }
        function toDateObject(dateStr) {
            var parts = dateStr.split('/');
            var date = new Date(parts[2], (parts[1] - 1), parts[0]);
            return date;
 
        }

Thanks,
Mani

#769189

20 Apr 2017 16:00

Joined:	14/04/2016
Level:	Silver
Points:	118

Points:	4

Hi Kavitha,

You can apply validation on from date and to date using below javascript code snippet.First condition checks whether from date and to date are less than todays date or not and second condition checks that start date is less than end date or not.

function compareDate() {
var from = document.getElementById('<%= txtTAFromDate.ClientID %>').value;
var to = document.getElementById('<%= txtTAFromDate.ClientID %>').value;
from = toDateObject(from);
to = toDateObject(to);
var today = new Date();
if (from > today || to > today) {
alert('Date should be less than today');
return false;
}

if (from > to) {
alert('start date should be lesser than end date');
return false;
}
return true;

}

Hope it helps!

Thanks,
Bharati

Display error message for from date and to date using javascript

About dotnetspider.com

Quick Links

General

Services