CODEWITHSUNDEEP
c#asp.net
Prady
Prady

Reputation: 45

How to get next month of selected month?

I have one drop down list of months like 'January' 'February'...'December' in asp.net c#

<asp:DropDownList ID="dlsalmonth" runat="server" class="form-control form-control-solid placeholder-no-fix">
    <asp:ListItem>January</asp:ListItem>
    <asp:ListItem>February</asp:ListItem>
    <asp:ListItem>March</asp:ListItem>
    <asp:ListItem>April</asp:ListItem>
    <asp:ListItem>May</asp:ListItem>
    <asp:ListItem>June</asp:ListItem>
    <asp:ListItem>July</asp:ListItem>
    <asp:ListItem>August</asp:ListItem>
    <asp:ListItem>September</asp:ListItem>
    <asp:ListItem>October</asp:ListItem>
    <asp:ListItem>November</asp:ListItem>
    <asp:ListItem>December</asp:ListItem>
</asp:DropDownList>

<div class="col-md-4" style="margin-top: 2%">
    <asp:TextBox ID="txtnextmonth" runat="server" CssClass="form-control" placeholder="Next Month" ReadOnly="true"></asp:TextBox>
</div>

What I want is when I select a Month from this list I want exact next Month in my text box next to it. Let say if I select February from this drop down list then March should be displayed in my text box.

Upvotes: 1

Views: 625

Answers (3)

Adil
Adil

Reputation: 148110

You can use SelectedIndexChanged event and in that event use the selectedIndex property to find the next month. You will have to take care of December as the next item will be the first not at next index. You will need to set AutoPostBack property to true to postback on drop down selection change. You will also need to bind the SelectedIndexChanged event.

protected void dlsalmonth_SelectedIndexChanged(object sender, EventArgs e)
{
     txtnextmonth.Text = dlsalmonth.Items[(dlsalmonth.SelectedIndex+1)%12].Text;
}

Its could be done on server side as show above but it is recommended to do it on client side to save postback. You can do this with javascript like this.

In HTML, bind the onchange javascript event and pass it dropdownlist object using this.

<asp:DropDownList ID="dlsalmonth" runat="server" onchange="dlsalmonthChange(this);" class="form-control form-control-solid placeholder-no-fix">

In Javascript, put the script tag just before the closing body tag. get the textbox object and assign next element of drop down taking care of December and January. 

 <script type="text/javascript" language="javascript">
        function dlsalmonthChange(sel)
        {   
            document.getElementById("<%= txtnextmonth.ClientID%>").value = sel.options[(sel.selectedIndex+1) % 12].text
        }
        dlsalmonthChange(document.getElementById("<%= dlsalmonth.ClientID%>")); // to set the textbox on form load
    </script>
</body>

I explicitly called the dlsalmonthChange on page load to set the textbox for the first time when page loads.

Upvotes: 1

Usman
Usman

Reputation: 4703

you can try something like this 

  protected void dlsalmonth_OnSelectedIndexChanged(object sender, EventArgs e)
        {
             txtnextmonth.Text = dlsalmonth.SelectedItem.Text == "December" ? 
             dlsalmonth.Items[0].Text : 
             dlsalmonth.Items[dlsalmonth.SelectedIndex + 1].Text;
        }

and also dont forget to add AutoPostBack="True" or it will not go to dlsalmonth_OnSelectedIndexChanged event

Upvotes: 2

VDWWD
VDWWD

Reputation: 35514

You could use a client side solution. This will remove the need for an extra PostBack.

<script type="text/javascript">
    $("#<%=dlsalmonth.ClientID %>").change(function () {
        var index = $(this).prop('selectedIndex') + 1;

        var nextValue = $("#<%=dlsalmonth.ClientID %> option").eq(index % 12).val();

        $("#<%=txtnextmonth.ClientID %>").val(nextValue);
    });
</script>

Upvotes: 1

Related Questions