JQuery DatePicker not saving correct dates on partial postback.

Question

So I have some textboxes (in an UpdatePanel in a ModalPopup in a User Control) that look like this:

<asp:TextBox ID="exampleTextBox" runat="server" MaxLength="10" 
    CssClass="datepicker" ReadOnly=true 
    Text='<%# Bind("ExampleDateField") %>' Width="77px">
</asp:TextBox>

I also have some jQuery (imported from file on the Master page) that hooks up the jQuery DatePickers like so:

function pageLoad() {
    $(".datepicker").unbind();
    $(".datepicker").datepicker({
        changeMonth: true,
        changeYear: true,
        showOtherMonths: true,
        selectOtherMonths: true,
        beforeShowDay: $.datepicker.noWeekends,
        showOn: 'button',
        buttonImage: '../Resources/Images/Calendar_scheduleHS.gif',
        buttonImageOnly: true,
        buttonText: 'Select a Date'
    });
}

The DatePickers appear correctly, even after a postback.

The problem is that the value of the textboxes is not changed when a postback occurs. This is very odd since the textbox shows the selected date in the browser. However, the value of the textbox is still the date that the textbox originally had, not the date selected from the datepicker.

Any ideas why I cannot get the selected date?

Answer 1

It is due to the ReadOnly=true attribute.

Take that off, or set to false then it will use the posted value