Add Values to the choices

[Neocomer]

Normally when creating a form with user entry that uses select , radio buttons and other data entry elements like that, I prefer to have a different value from the displayed value, I was wondering if there is any way of doing that, while still Programmatically creating the form. e.g

  new PropertyVm(typeof(string) , "number")
                    {
                        DisplayName = "Select a number",
                        NotOptional =false,
                        Choices = new List<string>(){"one","two","three"},

                },

renders

<select name="number" class="form-control">
                <option value="one">one</option>
                <option value="two">two</option>
                <option value="three">three</option>
                <option value="four">four</option>
        </select>

but I want it render like

<select name="number" class="form-control">
                <option value="1">one</option>
                <option value="2">two</option>
                <option value="3">three</option>
                <option value="4">four</option>
        </select>

was wondering is there is any functionality that like?

[mcintyre321]

I think you can use List<Tuple<string, string>> instead of List<string>, where Item1 is the DisplayText and Item2 is the value (or maybe the other way round)

[mcintyre321]

Did that work for you? Closing as I assume it did.

[corstian]

This does not seem to work with suggestions. What would need to be done in order to get this to work with suggestions?

[mcintyre321]

You would need to update the code in https://github.com/mcintyre321/FormFactory/blob/master/FormFactory/Views/Shared/FormFactory/Property.System.String.cshtml And send a pull request

You can see how it works for choices, it needs something similar for suggestions

[corstian]

I'm working on it by changing https://github.com/mcintyre321/FormFactory/blob/master/FormFactory/Scripts/bootstrap3-typeahead.unobtrusive.js in order to support this use case. I yet have to think about a method to neatly pass the selected value's id on a submit event instead of the form value's input.

Besides this I'm thinking really hard whether I'm using the correct control for the correct use case...

[mcintyre321]

Are you wanting AJAX suggestions (i.e. loaded from a url) or local suggestions (i.e. embedded in the page)?

[mcintyre321]

If it's loaded from a URL, I think you just need to return data in the format:

 [
    {id: "someId1", name: "Display name 1"},
    {id: "someId2", name: "Display name 2"}
  ]

If you want local suggestions, you'll need to edit line 59 of Property.System.String.cshtml to

 var suggestions = Model.Suggestions as IEnumerable<Tuple<string, string>>;
    if (suggestions == null && Model.Suggestions is IEnumerable<string>)
    {
        suggestions = Model.Suggestions.Cast<string>().Select(c => Tuple.Create(c, c));
    }

and change line 60 to set the data-source attribute to contain JSON similar to that above.

[guidozanon]

The Tuple thing is working, but when you load a model with value on the property, the dropdown is not showing the correct one. It alwasys display the first item selected. Any suggestionts?

[mcintyre321]

@guidozanon are you working with a string property? You also need to set the property value to equal the .Item2 of the tuple. See https://github.com/mcintyre321/FormFactory/blob/master/FormFactory/Views/Shared/FormFactory/Property.System.String.cshtml#L22