show financial year from date and to date

RAVI 1,056

Hello

I have two requriements

1) Current financial year Is Apr-2023 TO Mar-2024

In asp.net dropdownlist it has to show previous 3 years financial format as below for example on pageload

Apr-2023 TO Mar-2024

Apr-2022 TO Mar-2023

Apr-2021 TO Mar-2022

2) On Selecting From Dropdownlist it has to show mar first date and end date of respective years

For example i have textbox1 and textbox2 if i select APR-2022 TO Mar-2023 In textbox1 i want to show without postback using javascript or jquery like this format

01-APR-2022 and in textbox2 i want 31-MAR-2023

thanking you

Accepted answer

AgaveJoe 28,786

If I understand correctly you want a jQuery example without a postback.

Populate the select.

    public partial class FiscalYear : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            PopulateFiscalYears();
        }
        private void PopulateFiscalYears()
        {
            int FiscalYear = DateTime.Now.Month < 4 ?  DateTime.Now.Year : DateTime.Now.Year + 1;
            FiscalYears.Items.Add(new ListItem ("--Select--", ""));
            for (int i = 0; i < 3; i++)
            {
                FiscalYears.Items.Add(new ListItem
                (
                    "Apr-" + (FiscalYear - i - 1).ToString() + " TO Mar-" + (FiscalYear-i).ToString(),
                    "01-Apr-" + (FiscalYear -i - 1).ToString() + ",31-Mar-" + (FiscalYear - i).ToString()
                ));
            }
        }
    }

JQuery to populate two textboxes when the select changes.

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <div>
        <asp:DropDownList ID="FiscalYears" runat="server"></asp:DropDownList>
    </div>
    <div>
        <asp:TextBox ID="FromDate" runat="server"></asp:TextBox>
        <asp:TextBox ID="ToDate" runat="server"></asp:TextBox>
    </div>
 <script>
     $('#<%=FiscalYears.ClientID%>').change(function () {
         //console.log($(this).val().split(","));
         var dates = $(this).val().split(",");
         $('#<%=FromDate.ClientID%>').val(dates[0]);
         $('#<%=ToDate.ClientID%>').val(dates[1]);
    });
 </script> 
</asp:Content>

Capture

Perhaps in future post you can you at least try to write the code?

1 additional answer

Lan Huang-MSFT 29,916 Microsoft Vendor

Hi @RAVI,

I designed the code based on your needs, using getFullYear(), getMonth(), and getDate() methods to dynamically change the fiscal year based on the change in date.

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="Scripts/jquery-3.4.1.min.js"></script>
    <script>
        $(document).ready(function () {
            const monthNames = ["Jan", "Feb", "Mar", "Apr",
                "May", "Jun", "Jul", "Aug",
                "Sep", "Oct", "Nov", "Dec"];
            var currentYear = new Date().getFullYear();
            var currentMonth = new Date().getMonth();
            const monthName = monthNames[currentMonth];
            for (var i = 0; i < 5; i++) {
                var nextY = currentYear - 1;
                var nextM = monthNames[currentMonth + 1];
              
                var firstDay = ("0" + new Date(currentYear, currentMonth, 1).getDate()).slice(-2);
                var lastDay = new Date(currentYear-1, currentMonth+1, 0).getDate();
                var value = firstDay + "-" + nextM+ "-" + nextY + " TO " + lastDay + "-" + monthName + "-" + currentYear;
                var text = nextM + "-" + nextY + " TO " + monthName + "-" + currentYear;
                $('#financialYear').append(new Option(text, value));
                currentYear--;
            }
            $('#financialYear').change(function () {
                var dates = $(this).val().split("TO");
                $('#<%=FromDate.ClientID%>').val(dates[0]);
                $('#<%=ToDate.ClientID%>').val(dates[1]);
            })
        })
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div>
           
     <select id="financialYear" onchange=""></select>
   
    <div>
        <asp:TextBox ID="FromDate" runat="server"></asp:TextBox>
        <asp:TextBox ID="ToDate" runat="server"></asp:TextBox>
    </div>
        </div>
    </form>
</body>
</html>

User's image

Best regards,
Lan Huang

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

RAVI 1,056 Reputation points

2024-04-01T06:58:00.2933333+00:00

@Lan Huang

Current Month Is APR-2024
But in drodpwonist its showing May-2023 to APR-2024

It has to show like this only finicail year from and to date

Apr-2024 TO Mar-2025

Apr-2023 TO Mar-2024

Apr-2022 TO Mar-2023

Lan Huang-MSFT 29,916 Microsoft Vendor

Hi @RAVI,

The code I provided earlier changes based on the current month, but it seems you only want to display April, March. Change the code to:

<script>
    $(document).ready(function () {
        //const monthNames = ["Jan", "Feb", "Mar", "Apr",
            //"May", "Jun", "Jul", "Aug",
            //"Sep", "Oct", "Nov", "Dec"];
        var currentYear = new Date().getFullYear();
        var currentMonth = new Date().getMonth();
        //const monthName = monthNames[currentMonth];
        for (var i = 0; i < 5; i++) {
            var nextY = currentYear - 1;
            //var nextM = monthNames[currentMonth + 1];
          
            var firstDay = ("0" + new Date(currentYear, currentMonth, 1).getDate()).slice(-2);
            var lastDay = new Date(currentYear-1, currentMonth+1, 0).getDate();
            var value = firstDay + "-" + "Apr" + "-" + nextY + " TO " + lastDay + "-" + "Mar" + "-" + currentYear;
            var text = "Apr" + "-" + nextY + " TO " + "Mar"+ "-" + currentYear;
            $('#financialYear').append(new Option(text, value));
            currentYear--;
        }
        $('#financialYear').change(function () {
            var dates = $(this).val().split("TO");
            $('#<%=FromDate.ClientID%>').val(dates[0]);
            $('#<%=ToDate.ClientID%>').val(dates[1]);
        })
    })
</script>

Share via

show financial year from date and to date

1 additional answer

Your answer