RangeAttribute DataAnnotation causing NumericTextBox to always be invalid

[Ozzy Knox]

I have an Integer property on my Model that is rendered using the standard Integer EditorTemplate provided with the Telerik MV Extensions.  I am also using the RangeAttribute DataAnnotation to specify my validation criteria for the range that I want to allow (in this case it is 0 to 100).  However, no matter what my values are, the validation always throws an error.  Is this a known bug?

My code is quite straight forward.  The Model class is as follows:

public class CourseDTO
{
    public int Id { get; set; }

    [Required(ErrorMessage="Course Title is required.")]
    [DisplayName("Course Title:")]
    public string Title { get; set; }

    [DisplayName("Description:")]
    [DataType(DataType.MultilineText)]
    public string Description { get; set; }

    public string CompletionCategory { get; set; }
    public int ReminderId { get; set; }

    [RangeAttribute(0, 100, ErrorMessage="Expiry Months must be between 0 and 100")]
    [DataType("Integer")]
    [DisplayName("Expiry Months:")]
    public int ExpiryMonths { get; set; }

    [ScaffoldColumn(false)]
    public bool Deleted { get; set; }

    [ScaffoldColumn(false)]
    public IList<ScheduledCourseDTO> ScheduledCourses { get; set; }

    public CourseDTO()
    {
        ScheduledCourses = new List<ScheduledCourseDTO>();
    }
}

Please pay specific attention to the ExpiryMonths property.

My View is pretty much the same as the MVC Grid Ajax Editing example with a few customisations:

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<List<Vigilaris.Booking.Services.CourseDTO>>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
<style type="text/css">
    .field-validation-error
    {
        position: relative;
        display: block;
    }

    * html .field-validation-error { position: relative; }
    *+html .field-validation-error { position: relative; }

    .field-validation-error span
    {
        position: relative;
        left: 200px;
        top: 10px;
        white-space: nowrap;
        color: red;
        padding: 17px 5px 3px;
        background: transparent url('<%= Url.Content("~/Content/Themes/Shared/images/bg_validation-msg.png") %>') no-repeat 0 0;
    }

    .t-widget .t-numerictextbox
    {
        width: 100px !important;
        min-width: 100px !important;
        padding-left: 4px;
    }
</style>
    <!-- Setup the grid -->
    <% Html.Telerik().Grid<Vigilaris.Booking.Services.CourseDTO>()
            .Name("CoursesGrid")
            .ToolBar(commands => commands.Insert().ButtonType(GridButtonType.Image).ImageHtmlAttributes(new { style = "margin-left:0" }))
            .Columns(columns =>
            {
                columns.Bound(c => c.Id).Width(20);
                columns.Bound(c => c.Title).Width(300);
                columns.Bound(c => c.CompletionCategory).Width(100);
                columns.Bound(c => c.ExpiryMonths).Width(35);
                columns.Command(commands =>
                {
                    commands.Edit().ButtonType(GridButtonType.Image);
                    commands.Delete().ButtonType(GridButtonType.Image);
                }).Width(180).Title("Commands");
            })
            .DataKeys(keys => keys.Add(c => c.Id))
            .DataBinding(dataBinding =>
                dataBinding.Ajax()
                    .Select("_IndexAjax", "Course")
                    .Insert("_InsertAjax", "Course")
                    .Update("_UpdateAjax", "Course")
                    .Delete("_DeleteAjax", "Course")
            )
            .Editable(editing => editing.Mode(GridEditMode.InForm))
            .Sortable()
            .Render();
    %>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="PageTitle" runat="server">
    Courses
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="IntroContent" runat="server">
    A list of courses that have been or will be used for instructor led training at various training sites.
</asp:Content>

And finally, my CourseDTO editor template:

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<Vigilaris.Booking.Services.CourseDTO>" %>
<div>
    <fieldset class="editfieldset">
        <legend class="titlelegend">Course Details</legend>
        <ol>
            <li>
                <%: Html.LabelFor(model => model.Title) %>
                <%: Html.TextBoxFor(model => model.Title) %>
                <%: Html.ValidationMessageFor(model => model.Title, "*") %>
            </li>
            <li>
                <%: Html.LabelFor(model => model.Description) %>
                <%: Html.TextAreaFor(model => model.Description) %>
                <%: Html.ValidationMessageFor(model => model.Description) %>
            </li>
            <li>
                <%: Html.LabelFor(model => model.ExpiryMonths) %>
                <%: Html.EditorFor(model => model.ExpiryMonths) %>
                <%: Html.ValidationMessageFor(model => model.ExpiryMonths) %>
            </li>
        </ol>
    </fieldset>
</div>

Sorry. Lots of code for a small problem.  However, it is quite annoying when you feel you have finally found an effective and workable approach and then you are snared by one small issue that leaves a gaping hole in your form.

Any help will be appreciated.

[Rosen]

Hello Ozzy,

Indeed this is a known issue which was already been addressed. Therefore, I have attached the latest internal build for you to try. 

All the best,
Rosen
the Telerik team