Disable Times in jQuery timepicker based on Database value using jQuery AJAX in ASP.Net

Last Reply one year ago By pandeyism

Posted one year ago

i am using this date picker, it shows all the time in dropdown, in my database table i have fields of timing like

Time not available 1:00 am 2:00 am

so field those are in my database i want that time should not be selectabl and strikeout in the above dropdown on page load

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.js"></script>
<asp:TextBox ID="txttimeofreservation" runat="server"></asp:TextBox>
    $(document).ready(function () {
            defaultTime: '12:00 AM',
            interval: 60,
Posted one year ago

Hi nauna,

Refer below sample.

I have used datatable for data you can fetch data from database to datatable.


<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-timepicker/1.10.0/jquery.timepicker.css" />
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-timepicker/1.10.0/jquery.timepicker.js"></script>
<script type="text/javascript">
    $(function () {
        var pair = [];
            type: "POST",
            url: "CS.aspx/GetCurrentTime",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            async: false,
            success: function (response) {
                for (var i = 0; i < response.d.length; i++) {
                    var hour = response.d[i].split(' ')[0].split(':')[0];
                    var min = parseInt(response.d[i].split(' ')[0].split(':')[1]) + 1;
                    min = min < 10 ? '0' + min : min;
                    var ampm = response.d[i].split(' ')[1];
                    var start = response.d[i];
                    var end = hour + ':' + min + ' ' + ampm;
                    pair.push([start, end]);
            'disableTimeRanges': pair
    <asp:TextBox ID="txttimeofreservation" runat="server"></asp:TextBox>



using System.Data;


Imports System.Data



public static string[] GetCurrentTime()
    DataTable dt = new DataTable();
    dt.Rows.Add("01:00 AM");
    dt.Rows.Add("02:00 AM");
    dt.Rows.Add("03:00 AM");
    dt.Rows.Add("04:00 AM");
    string[] result = new string[dt.Rows.Count];
    for (int i = 0; i < dt.Rows.Count; i++)
        result[i] = dt.Rows[i][0].ToString();
    return result;


Public Shared Function GetCurrentTime() As String()
    Dim dt As DataTable = New DataTable()
    dt.Rows.Add("01:00 AM")
    dt.Rows.Add("02:00 AM")
    dt.Rows.Add("03:00 AM")
    dt.Rows.Add("04:00 AM")
    Dim result As String() = New String(dt.Rows.Count - 1) {}

    For i As Integer = 0 To dt.Rows.Count - 1
        result(i) = dt.Rows(i)(0).ToString()

    Return result
End Function