Not able to edit drop down values | Experience Manager | DD4T

Question

I am trying to edit dropdown values using experience manager in DD4T site but it's not editing the values however It shows the green region around the dropdown. Here is my code

  <select name="field1" id="1" class="">
                            <option value="">Select Country</option>

                            @foreach (var countryComp in regionComp.Fields["countries"].LinkedComponentValues)
                            {   @Html.SiteEditComponentPresentation(regionComp, Model.ComponentTemplate.Id, "")
                                if (countryComp.Fields.ContainsKey("countryName"))
                                {
                                     <option value="country-1">@Html.SiteEditField(countryComp, countryComp.Fields["countryName"]) @countryComp.Fields["countryName"].Value</option>
                                }

                            }

If there is some example to edit the dropdown values using XPM in a DD4T site?

Below are the regions rendered on the page

Thank you

Answer 1

I don't see that working. For one, the usability of inline editing values within a drop-down list would be rather poor. Would clicking on the drop-down list mean you want to edit the value -- or choose a value in the drop-down list? Collapse or expand the list? You get the point.

I'd say you should output the values differently. If you wish to still show it as a drop-down list when the user is not editing it, you could have a little bit of JavaScript to change it on demand to something that can be edited inline, such as a bulleted list.

Answer 2

The way your XPM markup is configured (around the <option> tag) you would be inline editing the entire tag and not just the contents...

If you really want to enable inline editing of the dropdown values you will have to write out different HTML for staging and live altogether as a dropdown cannot be inline edited. For example you could use an unordered list and write the dropdown values as list items which can be inline editable.