如何缩进 MultiSelectBox 中的值？

Question

我在 Razor MultiSelectBox 中创建缩进项时遇到问题。

当我手动编写 HTML 时，它工作得很好：

<select name="testfoo123" multiple="multiple" size="15">
    <option value="PARENT1">Parent</option>
    <option value="CHILD1">&nbsp;I am indented</option>
    <option value="CHILD2">&nbsp;I am indented</option>
    <option value="PARENT1">Parent2</option>
    <option value="CHILD1">&nbsp;I am indented</option>
    <option value="CHILD2">&nbsp;I am indented</option>
</select>

然而，Razor 的 HTML 帮助程序从字面上显示表单中前面的不间断空格。正如预期的那样，用于缩进的文字空间 ' ' 字符将被完全忽略。

我用来生成多选框的代码如下：

@Html.ListBoxFor(model => mySelectedValues, new MultiSelectList(myValues), new { size = "15" })

Answer 1

我找到了解决方案。第一：多选框可能不是树状控件的最佳选择，但我将把这个决定留给程序员。

解决方案：添加一个文字不间断空格字符。这些字符不会被过滤，但 HTML 等效字符（以及普通的空格字符）会被过滤。

const char nonBreakingSpace = '\u00A0';

为每个孩子添加这个字符。使用单独的列表作为示例：

var sendMeToTheHtmlHelper = new List<String>();
foreach(String yourString in yourCollection) {
    // If this element is a child and needs indentation:
    sendMeToTheHtmlHelper.Add(nonBreakingSpace + location);
    // else just add as normal
}