Hi there,

I have a gridview which contains a textbox control. I need to show the calendar for the user to pick the date and certain dates are to be disabled using jquery. I found a post on stackoverflow that talked about how to disable certain dates. I am done with that part, except not sure how to pass the textbox control to this jquery function. Here is the code.

<script type="text/javascript" language="javascript">
function pageLoad(sender, args) {
    var enabledDays = ['09/21/2011', '10/05/2011', '10/19/2011', '11/02/2011', '11/16/2011'];

    /* utility functions */
    function editDays(date) {
        for (var i = 0; i < enabledDays.length; i++) {
            if (new Date(enabledDays[i]).toString() == date.toString()) {
                return [true];
            }
        }
        return [false];
    }
    /* create datepicker */
    $(document).ready(function() {
    $('#<%= txtInHomeDate.ClientID %>').datepicker({
            beforeShow: springDate,
            beforeShowDay: editDays,
            dateFormat: 'mm/dd/yy',
            buttonImage: 'images/cal.gif',
            buttonText: 'Choose date',
            firstDay: 1,
            buttonImageOnly: true,
            showOn: 'both',
            showAnim: 'fadeIn',
            onSelect: function() { $(this).trigger("onchange", null); }
        });
        function springDate() {
            var defaultMin = new Date();
            var defaultMax = new Date();
            var Min = defaultMin;
            var Max = defaultMax;
            // make valid date from hiddenfied value format is MM/dd/yyyy  
            dateMin = $('#<%= hfStDate.ClientID %>').val();
            dateMin = new Date(dateMin);
            dateMax = $('#<%= hfEndDate.ClientID %>').val();
            dateMax = new Date(dateMax);
            if (dateMin && dateMax) {
                Min = new Date(dateMin.getFullYear(), dateMin.getMonth(), dateMin.getDate());
                Max = new Date(dateMax.getFullYear(), dateMax.getMonth(), dateMax.getDate());
            }
            return {
                minDate: Min,
                maxDate: Max
            };
        }
    });
}

<....

<asp:TemplateField HeaderText="In-Home Date">
                                <ItemStyle HorizontalAlign="Center" />
                                <ItemTemplate>
                                    <asp:HiddenField ID="hfStDate" runat="server" Value="09/01/2011" />
                                    <asp:HiddenField ID="hfEndDate" runat="server" Value="11/30/2011" />  
                                    <asp:TextBox ID="txtInHomeDate" runat="server" />
                                </ItemTemplate>
                            </asp:TemplateField>

Currently, it errors out since the jquery function won't find the txtInHomeDate. Could I get some help as I am pretty close to get this done? Thanks!!