Bind input field to list

Question

I am trying to create a form which has a TextAreaFor email addresses. There are email addresses stored in a database. I want these stored addresses to be the default value of the field, and then allow the user to add or remove addresses from the list as they see fit.

My viewModel;

public List<string> EmailAddresses { get; set; }

My View:

<%= Html.TextAreaFor(m => m.EmailAddresses) %>

(this is wrong, as it displays System.Collections.Generic.List1[System.String]` in the input field rather than each item in the list.

I know I can iterate through the list and display a separate textbox for each element in the list, but I want each element to be listed in a single textArea. (similar to an actual email client in that you can enter multiple addresses separated by a comma or semi) Is this possible? I've searched, but have not found this scenario, which seems odd, because I think it must not be uncommon. I'm thinking the solution may be to write a custom editorTemplate, but I'm hoping for a simpler solution.

how about <%= Html.TextAreaFor(m => string.Join(",", m.EmailAddresses.ToArray());) %> — Asdfg
– Asdfg, Commented Jul 20, 2012 at 19:13
@Asdfg That did not make for a happy compiler:), even after removing the extra ; ... thanks, though — Forty-Two
– Forty-Two, Commented Jul 20, 2012 at 20:08

anAgent · Accepted Answer · 2012-07-20 19:34:56Z

1

You could extend you view model like so.

View Model public class PeopleViewModel {

    public List<string> EmailAddress { get; set; }

    public string EmaiAddressString {
        get {
            string rValue = string.Empty;
            EmailAddress.ForEach(x => rValue += (x + "\n" ));
            return rValue;
        }
        set {
            var newValue = value.Split(new string[] { Environment.NewLine }, StringSplitOptions.None).ToList<string>();
            EmailAddress = newValue;
        }

    }
}

View

@model SigKoExample.Models.PeopleViewModel
@{
    ViewBag.Title = "Index";
}
<h2>Index</h2>
@if (IsPost) {
    <h2>New Values</h2>
    @Html.TextArea("EmailAddresses", Model.EmaiAddressString.ToString())
} else {
    using (Html.BeginForm()) { 
        @Html.TextAreaFor(m => m.EmaiAddressString)
        @Html.HiddenFor(m => m.EmailAddress)
        <input type="submit" value="Save" />                               
    }
}

Controller

public ActionResult Index() {
    PeopleViewModel model = new PeopleViewModel {
        EmailAddress = new List<string> {
            "ValueOne",
            "ValueTwo"
        }
    };
    return View(model);
}

[HttpPost]
public ActionResult Index(PeopleViewModel model) {
    return View(model);
}

answered Jul 20, 2012 at 19:34

anAgent

2,78027 silver badges37 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Forty-Two Over a year ago

perfect answer. I didn't accept it at first because I got some goofy error, then I realized it was my fault, not yours:) Thanks @anAgent!

cshemby · Accepted Answer · 2012-07-20 19:17:41Z

1

I would use a listboxfor in MVC instead of the text area. This way you can select individual entries in the list and either edit, delete, or add to that list by clicking a button and redirecting to another page or having the textbox you'd like to add on the same page. Check out this example. http://www.aspnetmvcninja.com/views/asp-net-mvc-select-list-example

Also if you'd like to input a large amount into a single test area and then add to the list then try using a TryParse on the "," to separate the email addresses. Then add them to the list.

answered Jul 20, 2012 at 19:17

cshemby

1984 bronze badges

1 Comment

Forty-Two Over a year ago

Thanks @Clay. Not exactly what I pictured, but it works and fills the requirement. 'preciate it!

Collectives™ on Stack Overflow

Bind input field to list

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related