Please disable your adblock and script blockers to view this page
 

Populate time in Asp.net Dropdownlist with interval of minutes or hours dynamically

Introduction: In this article I am going to explain How to fill/bind/populate dropdownlist at runtime with time interval of specified minutes or hours e.g. 5 minutes, 15 minutes, 1 hour, 5 hours etc.
Populate time in Asp.net Dropdownlist with interval of minutes or hours dynamically

Description: While working on asp.net project I got the requirement to populate time range in dropdownlist with 5 minutes interval so that user can select the start time and end time. Solution was very easy and I decided to share the same with all.

Implementation: Let’s create a simple asp.net web page to see the concept in action.

HTML Source Code

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <fieldset style="width:250px">
        <legend>Select Time
        </legend>
        From:  <asp:DropDownList ID="ddlTimeFrom" runat="server"></asp:DropDownList>
        To: <asp:DropDownList ID="ddlTimeTo" runat="server"></asp:DropDownList>

    </fieldset>
    </div>
    </form>
</body>
</html>

Asp.Net C# Code to bind time in DropDownList at runtime with 5 minutes interval

protected void Page_Load(object sender, EventArgs e)
        {
            if (!Page.IsPostBack)
            {
                BindTime();
            }
        }
       private void BindTime()
        {
            // Set the start time (00:00 means 12:00 AM)
            DateTime StartTime = DateTime.ParseExact("00:00","HH:mm",null);
            // Set the end time (23:55 means 11:55 PM)
            DateTime EndTime = DateTime.ParseExact("23:55", "HH:mm", null);
            //Set 5 minutes interval
            TimeSpan Interval = new TimeSpan(0,5,0);
            //To set 1 hour interval
            //TimeSpan Interval = new TimeSpan(1, 0, 0);           
            ddlTimeFrom.Items.Clear();
            ddlTimeTo.Items.Clear();
            while (StartTime <= EndTime)
            {
                ddlTimeFrom.Items.Add(StartTime.ToShortTimeString());
                ddlTimeTo.Items.Add(StartTime.ToShortTimeString());
                StartTime = StartTime.Add(Interval);              
            }
            ddlTimeFrom.Items.Insert(0, new ListItem("--Select--", "0"));
            ddlTimeTo.Items.Insert(0, new ListItem("--Select--", "0"));
        }

Asp.Net VB Code to bind time in DropDownList at runtime with 5 minutes interval

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        If Not Page.IsPostBack Then
            BindTime()
        End If
    End Sub

Private Sub BindTime()
        'Set start time (00:00 means 12:00 AM)
        Dim StartTime As DateTime = DateTime.ParseExact("00:00", "HH:mm", Nothing)
        'Set end time (23:55 means 11:55 PM)
        Dim EndTime As DateTime = DateTime.ParseExact("23:55", "HH:mm", Nothing)
        'Set 5 minutes interval
        Dim Interval As New TimeSpan(0, 5, 0)
        'To set 1 hour interval
        'Dim Interval As New TimeSpan(1, 0, 0)
        ddlTimeFrom.Items.Clear()
        ddlTimeTo.Items.Clear()
        While StartTime <= EndTime
            ddlTimeFrom.Items.Add(StartTime.ToShortTimeString())
            ddlTimeTo.Items.Add(StartTime.ToShortTimeString())
            StartTime = StartTime.Add(Interval)
        End While
        ddlTimeFrom.Items.Insert(0, New ListItem("--Select--", "0"))
        ddlTimeTo.Items.Insert(0, New ListItem("--Select--", "0"))

    End Sub

Now over to you:
" I hope you have got the way to Dynamically populate time with interval in Dropdownlist and If you like my work; you can appreciate by leaving your comments, hitting Facebook like button, following on Google+, Twitter, Linked in and Pinterest, stumbling my posts on stumble upon and subscribing for receiving free updates directly to your inbox . Stay tuned and stay connected for more technical updates." 
Previous
Next Post »

3 comments

Click here for comments
April 13, 2015 ×

thanks for your valuable feedback..stay connected and keep reading for more useful updates..:)

Reply
avatar
July 07, 2015 ×

Nice code. Could you do this also in the asp.net MVC application?

Reply
avatar

If you have any question about any post, Feel free to ask.You can simply drop a comment below post or contact via Contact Us form. Your feedback and suggestions will be highly appreciated. Also try to leave comments from your account not from the anonymous account so that i can respond to you easily.. ConversionConversion EmoticonEmoticon