You must Sign In to post a response.
  • Category: JavaScript

    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
    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
    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


Sign In to post your comments