Test

Display error msg for from date and to date using javascript

Apr 16 2017 12:07 AM

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.

<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="Home.aspx.cs" Inherits="Home1" %>
<%@ Register Namespace="AjaxControlToolkit" Assembly="AjaxControlToolkit" tagPrefix="ajax" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">

<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="Scripts/jquery.dynDateTime.min.js" type="text/javascript"></script>
<script src="Scripts/calendar-en.min.js" type="text/javascript"></script>
<link href="Styles/calendar-blue.css" rel="stylesheet" type="text/css" />

<script type="text/javascript">
$(document).ready(function () {
$("#<%= txtTAFromDate.ClientID %>").dynDateTime({
showsTime: true,
ifFormat: "%m/%d/%y %H:%M",
daFormat: "%l;%M %p, %e %m, %Y",
align: "BR",
electric: false,
singleClick: true,
displayArea: ".siblings('.dtcDisplayArea')",
button: ".next()"
});
$("#<%= txtTAToDate.ClientID %>").dynDateTime({
showsTime: true,
ifFormat: "%m/%d/%y %H:%M",
daFormat: "%l;%M %p, %e %m, %Y",
align: "BR",
electric: false,
singleClick: true,
displayArea: ".siblings('.dtcDisplayArea')",
button: ".next()"
});
});
</script>

<ajax:ToolkitScriptManager ID="scriptmanager1" runat="server">
</ajax:ToolkitScriptManager>
<%--<link href="style.css" rel="stylesheet" />--%>
<%--<table style="width:950px; height:410px;">--%>
<div style="margin-left:10%;margin-top:03%;height:450px">
<ajax:TabContainer ID="TabContainer1" runat="server" CssClass="fancy fancy-green">
<ajax:TabPanel ID="tbpnluser" runat="server" >
<HeaderTemplate>Project wise details & Status </HeaderTemplate>

<ContentTemplate>

<asp:Panel ID="pnlPW" runat="server">
<h4><strong><center> Project wise details & Status </center></strong></h4>
<span>
Select ProjectName:<asp:DropDownList ID="ddlProject" runat="server" AutoPostBack="True" Width="183px" OnSelectedIndexChanged="ddlProject_SelectedIndexChanged"></asp:DropDownList>
</span>
(OR)<span>
Status:<asp:DropDownList ID="ddlStatus" runat="server" Visible="true" AutoPostBack="True" OnSelectedIndexChanged="ddlStatus_SelectedIndexChanged" >
<asp:ListItem>Select Status</asp:ListItem>
<asp:ListItem>To Start</asp:ListItem>
<asp:ListItem>Working</asp:ListItem>
<asp:ListItem>Completed</asp:ListItem>
<asp:ListItem>Support</asp:ListItem>
<asp:ListItem>Cancelled</asp:ListItem>
</asp:DropDownList>
</span><span>
(OR) Domain:<asp:DropDownList ID="ddlDomain" runat="server" Visible="true" AutoPostBack="True" OnSelectedIndexChanged="ddlDomain_SelectedIndexChanged" ></asp:DropDownList>
</span>
<span style="float:right">
<asp:Button ID="Button1" runat="server" Text="Export" Visible="false"></asp:Button>
</span>
 <div style="width:99%; height: 200px; overflow: auto">
<asp:GridView ID="grdPdetails" runat="server" Width="100%" BackColor="White" BorderColor="#CCCCCC" BorderStyle="None"
BorderWidth="1px" CellPadding="3" CssClass="Grid" AutoGenerateColumns="false" EmptyDataText="No Records Available">
<FooterStyle BackColor="White" ForeColor="#000066" />
<HeaderStyle BackColor="#006699" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="White" ForeColor="#000066" Horizontal />
<RowStyle ForeColor="#000066" />
<SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
<SortedAscendingCellStyle BackColor="#F1F1F1" />
<SortedAscendingHeaderStyle BackColor="#007DBB" />
<SortedDescendingCellStyle BackColor="#CAC9C9" />
<SortedDescendingHeaderStyle BackColor="#00547E" />
<Columns>
<asp:BoundField DataField="ProjectName" HeaderText="Name" />
<asp:BoundField DataField="Status" HeaderText="Status" />
<asp:BoundField DataField="Domain" HeaderText="Domain" />
<%--<asp:BoundField DataField="Department(Used By) " HeaderText="Department(Used By) " />--%>
<asp:BoundField DataField="StartDate" HeaderText="StartDate" />
<asp:BoundField DataField="EndDate" HeaderText="EndDate" />
<%--<asp:BoundField DataField="Developers" HeaderText="Developers" />--%>
</Columns>
</asp:GridView>
</div>
</asp:Panel>

</ContentTemplate>

</ajax:TabPanel>
<ajax:TabPanel ID="tbpnlusrdetails" runat="server">
<HeaderTemplate>Team Activities</HeaderTemplate>
<ContentTemplate>
<asp:Panel ID="pnlAW" runat="server">
<h4><strong><center> Team Activities </center></strong></h4>
<div style="padding-left:100px">
<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>
</div>
<asp:Label ID="lblErrmsgTA" runat="server" ForeColor="Red" Font-Bold="true"></asp:Label>
 <div style="width:99%; height: 200px; overflow: auto">
<asp:GridView ID="gvTeamActiv" runat="server" Width="100%" BackColor="White" BorderColor="#CCCCCC" BorderStyle="None" AutoGenerateColumns="false"
BorderWidth="1px" CellPadding="3" CssClass="Grid" EmptyDataText="No Records Available" >
<FooterStyle BackColor="White" ForeColor="#000066" />
<HeaderStyle BackColor="#006699" Font-Bold="True" ForeColor="White" Height="10px"/>
<PagerStyle BackColor="White" ForeColor="#000066" Horizontal />
<RowStyle ForeColor="#000066" />
<SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
<SortedAscendingCellStyle BackColor="#F1F1F1" />
<SortedAscendingHeaderStyle BackColor="#007DBB" />
<SortedDescendingCellStyle BackColor="#CAC9C9" />
<SortedDescendingHeaderStyle BackColor="#00547E" />
<Columns>
<asp:BoundField DataField="ProjectName" HeaderText="Project Name" />
<asp:BoundField DataField="Developername" HeaderText="User Name" />
<asp:BoundField DataField="FromDate" HeaderText="From Date/Time" />
<asp:BoundField DataField="ToDate" HeaderText="To Date/Time" />
<asp:BoundField DataField="AssignedWork" HeaderText="Assigned By" />
<asp:BoundField DataField="DescAssignedTask" HeaderText="Task Description" />
<asp:BoundField DataField="Status" HeaderText="Status" />
</Columns>
</asp:GridView>
</div>
<asp:Button ID="Button3" runat="serv

</ajax:TabContainer>
</div>

</asp:Content>

er" Text="Export" Visible="false"></asp:Button>
</asp:Panel>
</ContentTemplate>
</ajax:TabPanel>

</ajax:TabContainer>
</div>

</asp:Content>

this is my complete code i have panel,tab container,ajax and so on and i tried the javascript example of c sharp corner in the below link but its not working

http://www.c-sharpcorner.com/blogs/date-validation-by-javascript1

Answers (2)

url rewriting in mvc

display error msg if from date greater than to date greater