Built-in Error Message on EditorTemplate Combo-Box Column

4 posts, 0 answers
  1. Andrei
    Andrei avatar
    11 posts
    Member since:
    Jul 2019

    Posted 07 Jan 2020 Link to this post

    I have a grid with several foreign key columns which display combo-box editor templates. The user enters and selects an item, which sets the id on that column for that record in the grid.

    If the user unfocuses the cell without selecting an option, the built-in validation message (shown in the attached screenshot) 'X must be a number' appears. This occurs when the input does not load any data (i.e. they type a name that doesn't exist in the database and so auto-complete doesn't find anything). It seems the validation skips the 'required' message and goes to this invalid-type message. We would like to change or bypass this so that the user doesn't see this user-unfriendly message.

    Is there a way to (1) somehow force the combo-box to select an option when losing focus in this case where there was no valid auto-complete option (since normally it does auto-select said option), or (2) to somehow override this error message?

  2. Alex Hajigeorgieva
    Admin
    Alex Hajigeorgieva avatar
    1082 posts

    Posted 09 Jan 2020 Link to this post

    Hi, Andrei,

    Thank you for the great description and the screenshot to illustrate your case.

    To get the desired result, follow the same validation principles in MVC as you do without the Kendo UI Validator. The built-in validation attributes are taken from the model. To supply a custom required message and a human friendly property name, add it in the model attributes:

    [Required]
    [Display(Name = "Pool Name")]
    public int ForeignColumnId { get; set; }

     

    Or if you prefer, provide your own custom required message:

    [Required(ErrorMessage = "My custom error message!")]
    public int ForeignColumnId { get; set; }

     

    For the built-in "The field must be a number." message, things are more complicated as explained in this SO thread:

    https://stackoverflow.com/questions/4828297/how-to-change-data-val-number-message-validation-in-mvc-while-it-is-generated

    However, it seems that you can easily override the message via HtmlAttributes as this poster suggests:

    @model object
               
    @(Html.Kendo().ComboBoxFor(m => m)
            .BindTo((SelectList)ViewData[ViewData.TemplateInfo.GetFullHtmlFieldName("") + "_Data"])
            .HtmlAttributes(new { data_val_number="Supply a valid code!" })
    )

    Kind Regards,
    Alex Hajigeorgieva
    Progress Telerik

    Get quickly onboarded and successful with your Telerik UI for ASP.NET MVC with the dedicated Virtual Classroom technical training, available to all active customers.
  3. Andrei
    Andrei avatar
    11 posts
    Member since:
    Jul 2019

    Posted 09 Jan 2020 in reply to Alex Hajigeorgieva Link to this post

    Hi Alex,

    I don't think the first approach applies, because this column is required conditionally based on the value of another column (this has been implemented as a custom validation rule).

    However, after a quick test, the second approach to override the 'must be a number' method worked.

    Thank you for the assistance!

  4. Alex Hajigeorgieva
    Admin
    Alex Hajigeorgieva avatar
    1082 posts

    Posted 13 Jan 2020 Link to this post

    Hello, Andrei,

    For custom validation rules, you would need to extend the client-side validator and the messages will be added dynamically everytime the cell/row is about to close like this online demo:

    https://demos.telerik.com/aspnet-mvc/grid/editing-custom-validation

    Also relevant to custom attributes is this article:

    https://docs.telerik.com/aspnet-mvc/getting-started/helper-basics/validation#implementing-custom-attributes

    Kind Regards,
    Alex Hajigeorgieva
    Progress Telerik

    Get quickly onboarded and successful with your Telerik UI for ASP.NET MVC with the dedicated Virtual Classroom technical training, available to all active customers.
Back to Top