ICollection Property and UIHint

2 posts, 0 answers
  1. Andrew
    Andrew avatar
    2 posts
    Member since:
    Oct 2013

    Posted 08 Oct 2013 Link to this post

    Hello -

    I have created a POCO class (called User) which I decorated some properties with a custom Editor Template. The custom Editor Template (called WorkflowUsers) simply prints the text "HI". I have a grid set up, which displays all of the Users. It has a button which launches the editor pop-up, allowing you to create a new User. The "Domain" property properly uses the custom Editor which I have specified using the UIHInt, however the Roles property does not even show (no display label nor custom editor) on the popup.  I have tried making it  a List, making it non-virtual. I am confused.

    Note: I am using the Trial version, as my full-version won't be purchased until the end of the week due to my company's billing process.

    public string Domain { get; set; }
    public virtual ICollection<Role> Roles { get; set; }
  2. Petur Subev
    Petur Subev avatar
    1882 posts

    Posted 10 Oct 2013 Link to this post

    Hello Andrew,

    Basically the popup editor of the Grid uses the Html.EditorForModel helper which also does not generate editor template for nested collection property no matter if there is UIHint attribute decorating it.

    For example:

    the following model:
    public class Person
        public int PersonID { get; set; }
        public string Name { get; set; }
        public DateTime BirthDate { get; set; }
        public List<string> SomeCollection { get; set; }
    and the following view:

    @model KendoMVCWrappers.Models.Person

    Will generate the following:

    <div class="editor-label">
        <label for="PersonID">
    <div class="editor-field">
        <input class="text-box single-line" data-val="true" data-val-number="The field PersonID must be a number."
            data-val-required="The PersonID field is required." id="PersonID" name="PersonID"
            type="number" value="1" />
        <span class="field-validation-valid" data-valmsg-for="PersonID" data-valmsg-replace="true">
    <div class="editor-label">
        <label for="Name">
    <div class="editor-field">
        <input class="text-box single-line" id="Name" name="Name" type="text" value="John" />
        <span class="field-validation-valid" data-valmsg-for="Name" data-valmsg-replace="true">
    <div class="editor-label">
        <label for="BirthDate">
    <div class="editor-field">
        <input data-val="true" data-val-date="The field BirthDate must be a date." data-val-required="The BirthDate field is required."
            id="BirthDate" name="BirthDate" type="datetime" value="6/26/1968 12:00 AM" /><script>
                                                                                             jQuery(function () { jQuery("#BirthDate").kendoDateTimePicker({ "format": "M/d/yyyy h:mm tt", "min": new Date(1900, 0, 1, 0, 0, 0, 0), "max": new Date(2099, 11, 31, 0, 0, 0, 0), "interval": 30 }); });
        <span class="field-validation-valid" data-valmsg-for="BirthDate" data-valmsg-replace="true">

    As you can see there is no editor generated again.

    You can search the internet for similar question how to resolve the case.

    Petur Subev
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top