Hi Jon,

        @* 
            By default this will render a textbox but if you want to change the editor template for this property you can 
            easily change it. For example, if you wanted to render a custom editor for this field called "MyEditor" you would
            create a file at ~/Views/Shared/EditorTemplates/MyEditor.cshtml", then you will change the next line of code to 
            render your specific editor template like:
            @Html.EditorFor(m => profileModel.MemberProperties[i].Value, "MyEditor")
        *@

It's comment from that macro.

hi,

thanks for the reply. im not using custom dayatypes, im using umbraco datatypes such as the checkbox and datetime types and in my loop i need to detect these types so i can render the controls correctly. is this possible?

jon

Jon, yes this is possible.

But the property editors are only used for back office editing. The MemberProperties collection is just a list of strings (I think) so using the EditorFor() method will always show text inputs as you mentioned. If you wanted to use a MVC approach to editing member properties, you would be best off creating a View Model for the member. You'll be able to specify each property data type and have the helper method render the correct editor.

So it would be better if you will create your own model and view for client side o f application.

Thanks

Are there any examples on how to do this? I am quite new to MVC and not sure how you could create a partial view, inherit the Template etc.

Thanks

Any examples going?

Hi Jon,

Try to create a file at ~/Views/Shared/EditorTemplates/MyEditor.cshtml", then you will change the next line of code to render your specific editor template like: @Html.EditorFor(m => profileModel.MemberProperties[i].Value, "MyEditor")

Hi Jon,

Razor has lots of different Html Helpers for rendering form controls, such as Html.CheckBoxFor() which will display your true/false checkbox.

For the date, there isn't a control that wil render a date-format out of the box, so you have to use something like JQuery-UI datepicker in conjunction with a textbox (Html.TextBoxFor())

I hope I've understood your problem correctly, and hope this helps?

Cheers,

Maff

Jon, did you ever get this working?

I'm experimenting with custom editors, but I haven't actually got it working yet. I have a single custom property of type Textstring, and I'm trying to select it from a dropdown.

I've created a custom editor, which looks like this:

In my profile editor macro, my fieldset looks like this:

<fieldset>
            <legend>Rediger profil</legend>
      
            @Html.ValidationSummary("profileModel", true)

            @Html.LabelFor(m => profileModel.Name)
            @Html.TextBoxFor(m => profileModel.Name)
            @Html.ValidationMessageFor(m => profileModel.Name)
            <br />

            @Html.LabelFor(m => profileModel.Email)
            @Html.TextBoxFor(m => profileModel.Email)
            @Html.ValidationMessageFor(m => profileModel.Email)
            <br />
           
            @* Custom editor *@
            @Html.LabelFor(m => profileModel.MemberProperties[0].Value, profileModel.MemberProperties[0].Name)
            @Html.EditorFor(m => profileModel.MemberProperties[0].Value, "LagEllerForeningEditor")
            <br />
       
            <button>Lagre</button>
</fieldset>

It renders ok:

The only problem is that the property doesn't actually get saved... I tried changing the name, and that works, but my custom editor doesn't.

One thing I've noticed when looking at the generated html code is that the Name and Email fields have attributes for id, name, type, and value. Perhaps this is relevant.

I've sone some experimenting with these attributes, but with seemingly no effect. Perhaps I just haven't typed them correctly.

In any case, I'm out of ideas.

Jon, did you ever get this working? Or does anyone else here see what I might be doing wrong?

Found this with great examples

https://github.com/KrisJanssen/Umbraco7-Standard-Membership

Thanks Kris Janssen!

Regarding the custom editors, here is something that worked for me.

1) Render your form using the generic textboxes in your website, view the source and get the ID for the field that you want to render out with a custom editor. In my case the id was 5.

2) In your for loop, intercept that ID and render out the label, the hidden field and then specify your custom editor. Everything else that does not match your ID will get rendered with the default textbox:

if(i == 5)
                    {
                        @Html.LabelFor(m => registerModel.MemberProperties[i].Value, registerModel.MemberProperties[i].Name)
                        @Html.EditorFor(m => registerModel.MemberProperties[i].Value, "ProvinceDDL")
                        @Html.HiddenFor(m => registerModel.MemberProperties[i].Alias)
                    }
                    else
                    {
                        @Html.LabelFor(m => registerModel.MemberProperties[i].Value, registerModel.MemberProperties[i].Name)
                        @Html.EditorFor(m => registerModel.MemberProperties[i].Value)
                        @Html.HiddenFor(m => registerModel.MemberProperties[i].Alias)
                    }

3) In your custom editor, make sure you include the name and id attributes on the select with your correstponding id. I am sure there is a way to do this with Html helpers, but this will work:

<select id="registerModel_MemberProperties_5__Value" name="registerModel.MemberProperties[5].Value">
               <option value="">Please Select</option>
               <option value="Ontario">Ontario</option>
               <option value="Quebec">Quebec</option>
               <option value="British Columbia">British Columbia</option>
               <option value="Alberta">Alberta</option>
               <option value="Manitoba">Manitoba</option>
               <option value="Saskatchewan">Saskatchewan</option>
               <option value="Nova Scotia">Nova Scotia</option>
               <option value="New Brunswick">New Brunswick</option>
               <option value="Newfoundland and Labrador">Newfoundland and Labrador</option>
               <option value="Prince Edward Island">Prince Edward Island</option>
               <option value="Northwest Territories">Northwest Territories</option>
               <option value="Yukon">Yukon</option>
               <option value="Nunavut">Nunavut</option>
</select>

The other option (preferred in my opinion) is just to render out the DDL in the if statement using an HTML helper. This way you can prepopulate the selected item as well like this:

if(i == 5)
                {
                    @Html.LabelFor(m => profileModel.MemberProperties[i].Value, profileModel.MemberProperties[i].Name)
                    @Html.DropDownListFor(m => profileModel.MemberProperties[i].Value, new SelectList(
                      new List<Object>{ 
                           new { value = "" , text = "Please Select"  },
                           new { value = "Ontario" , text = "Ontario" },
                           new { value = "Quebec" , text = "Quebec"},
                           new { value = "British Columbia" , text = "British Columbia"},
                           new { value = "Alberta" , text = "Alberta"},
                           new { value = "Manitoba" , text = "Manitoba"},
                           new { value = "Saskatchewan" , text = "Saskatchewan"},
                           new { value = "Nova Scotia" , text = "Nova Scotia"},
                           new { value = "New Brunswick" , text = "New Brunswick"},
                           new { value = "Newfoundland and Labrador" , text = "Newfoundland and Labrador"},
                           new { value = "Prince Edward Island" , text = "Prince Edward Island"},
                           new { value = "Northwest Territories" , text = "Northwest Territories"},
                           new { value = "Yukon" , text = "Yukon"},
                           new { value = "Nunavut" , text = "Nunavut"}
                        },"value","text",profileModel.MemberProperties[i].Value))

                    @Html.HiddenFor(m => profileModel.MemberProperties[i].Alias)
                }
                else
                {
                @Html.LabelFor(m => profileModel.MemberProperties[i].Value, profileModel.MemberProperties[i].Name)
                    @Html.EditorFor(m => profileModel.MemberProperties[i].Value)
                    @Html.HiddenFor(m => profileModel.MemberProperties[i].Alias)
                }

is working on a reply...