Question

I have a textbox with jquery ui datetime picker. When i open the page jquery clears my textbox.(Textbox has a default value) Is there any way to prevent this action?

View:

<div class="editor-field">
                <%: Html.TextBoxFor(model => model.Start, String.Format("{0:g}", Model.Start)) %>
                <%: Html.ValidationMessageFor(model => model.Start) %>
</div>

.js

$(document).ready(function () {
$("#Start").datepicker({
        showOn: 'button',
        buttonImage: '../../Content/img/cal.jpg',
        buttonImageOnly: true,
    });
$( "#Start, #End").datepicker( "option", "showAnim", 'slideDown' );
});

Thank you,
Peti

Answer 1

Can you grab the value before the call and then set it again after?

$(document).ready(function () {
    var default_date = $("#Start").val();
    $("#Start").datepicker({
            showOn: 'button',
            buttonImage: '../../Content/img/cal.jpg',
            buttonImageOnly: true,
        });
    $( "#Start, #End").datepicker( "option", "showAnim", 'slideDown' );
    $("#Start").val(default_date);
});

That said, I’m guessing that there’s some other problem. It’s been a while since I’ve used the datepicker plugin, but I can’t imagine it’s setup to blow out a valid date value from the input when you create it.

Can you post your code somewhere like Pastebin?

EDIT:

Oh, you’re right about the format. The default date format it expects is mm/dd/yy. What you’ll want to do is set the date format option to reflect your particular format. You’ll also want to strip off the time component from the date value. The code would look something like this (may not be 100% coreect):

$(document).ready(function () {
    var date_stripped_of_time = $("#Start").val().substring(0, 10);
    $("#Start").val(date_stripped_of_time);
    $("#Start").datepicker({
            showOn: 'button',
            buttonImage: '../../Content/img/cal.jpg',
            buttonImageOnly: true,
            dateFormat: 'yy.mm.dd',
        });
    $( "#Start, #End").datepicker( "option", "showAnim", 'slideDown' );
});

You can read more by looking at the options tab in the DatePicker documentation, and the formatDate documentation to see what you can use for the dateFormat string.