CODEWITHSUNDEEP
c#asp.net-mvc-3razor
Charles Burns
Charles Burns

Reputation: 10602

How do I indent values in a MultiSelectBox?

I am having trouble creating indented items in a Razor MultiSelectBox.

It works perfectly when I manually write the 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's HTML helpers, however, literally display the preceeding non-breaking space in the form. As expected, literal space ' ' characters for indentation are completely ignored.

The code I am using to generate the multi-select box follows:

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

Upvotes: 5

Views: 697

Answers (2)

Charles Burns
Charles Burns

Reputation: 10602

I found a solution. First: A multi-select box is probably not the best choices for a tree-like control, but I'll leave that decision up to the programmer.

Solution: Add a literal non-breaking space character. These are not filtered, but the HTML equivalent (as well as a normal space character) is.

const char nonBreakingSpace = '\u00A0';

Prepend each child with this character. Using a separate list as an example:

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
}

Upvotes: 4

Eilon
Eilon

Reputation: 25704

The built-in HTML helpers in both Web Pages and MVC automatically HTML encode all the input values. I'm quite sure there isn't any way to get your scenario to work using the built-in helper.

Fortunately, however, all the source code to these helpers is available on the CodePlex site as part of the MVC source code release. You can have a look at that source code and write a custom helper that is better targeted to your scenario of having indentation.

Upvotes: 0

Related Questions