Question

Possible Duplicate:
JQuery Datepicker with text input that doesn't allow user input

I’m developing website using mvc3. I created editor template for DateTime field and used jquery ui for selecting date.
Now i don’t want user to type in text box of date field user should only select it using jquery ui. Will it possible ? if possible how to do this ?

Answer 1

In your editor template add this:

@model System.DateTime?
@Html.TextBox("", (Model.HasValue ? Model.Value.ToString("dd.MM.yyyy"): string.Empty), new { @class = "date-pick" })

<script type="text/javascript">
    $(function () {
        $(".date-pick").attr("readonly", "true");    
        $('.date-pick').datepicker({
            dateFormat: "dd.mm.yy",
            yearRange: "-162:+0",
            showWeek: true,
            changeMonth: true,
            changeYear: true,
            showButtonPanel: true,
            changeButtonPanel: true,
            buttonImageOnly: true,
            showOn: "button",
            buttonImage: '@Url.Content("~/Content/images/calendar_32.png")'
        });               
    });  
</script>

Note that i’m also specifying a custom date format.