Create a model that contains a list of objects

Question

Given the following situation:

I have a model that contains various properties, one of those properties is a List. The model is the following:

public class DocumentTypeViewModel : BaseViewModel<int>
{
    #region Properties

    public string Name { get; set; }

    public List<DocumentTypeProperty> Properties { get; set; } 

    #endregion Properties
}

The DocumentTypeProperty, has just a single field with a name (and off course an id, but that's not important here).

Now, the ActionResult to show the view on which the create will happen is the following:

public ActionResult Create()
{
    var model = Mapper.Map<DocumentType, DocumentTypeViewModel>(new DocumentType());
    return View(model);
}

So, as you see, I send an empty model to the view, so the collection is null. Now, on in my Razor view i want to have an add button that I can use to add an element to the collection (I know that I can use jQuery to create elements), but I don't want to post it since it's not needed, the post will occur on the save of the model.

So the question is:

How can I pass my dynamiccly created textboxes to my ActionResult?

Kind regards,

you'd need to use jquery to add the html into the form, using the naming conventions required for building the model back up — Jonesopolis
– Jonesopolis, Commented May 16, 2014 at 18:22
I can use JQuery to add the elements to fill in the page but I don't know how to past it to the action. — Complexity
– Complexity, Commented May 16, 2014 at 18:23

RyanB · Accepted Answer · 2014-05-16 18:30:57Z

2

The Model Binding in MVC will bind to a collection

@Html.TextBoxFor(model => model[0].Name)
@Html.TextBoxFor(model => model[1].Name)

Then your controller could be

public ActionResult Create(List<DocumentTypeViewModel> )

Then you could create all rows at once when the form is submitted.

If you want to save each row to the database as it is added to the form, then you'll need to do some AJAX.

Also, there's no need to put the DateCreated and the DateUpdated in the view. If you do, then a savvy user would be able to edit them. Just have the controller add them before the save.

answered May 16, 2014 at 18:30

RyanB

7574 silver badges11 bronze badges

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

16 Comments

Complexity Over a year ago

Sorry but it's not really clear to me. I know how mvc binds to a collection. But my model is initially empty. So how can I add elects to the collection dynamically. Saving all iets at once?

RyanB Over a year ago

You'll need to use JavaScript (ex., JQuery) to dynamically add the textboxes to the page. When the form is submitted the control will get them all in a collection as long as they are named properly (element[0].Name and element[1].Name). The indexes have to start at 0 and be sequential.

Complexity Over a year ago

I'm sorry but I'm affraid, your solution doesn't work. An exception is thrown when using this code in MVC: <div>@Html.LabelFor(model => model.Properties[0].Name)</div> It seems that LabelFor and others cannot be used on a collection. I'm a bit lost :s And in the controllerAction, I don't need to post a list, it's a model and the model itself contains a list property

Complexity Over a year ago

Ok, it was because I was using an IEnumerable<T> instead of a List<T> :)

Complexity Over a year ago

Anyway, I've tested it further and as I tought, I have an error right now because my collection is empty: @Html.TextBoxFor(model => model.Properties[0].Name) I'll adapt the question to make it more clear.

|

Badhon Ashfaq · Accepted Answer · 2014-05-16 18:41:04Z

1

If you want to show a IEnumerable/list on your view, you can just usea forech loop.either you can send the list from your controller via viewbag or modelbinding.Something like that

In Controller

   public ActionResult Create()
   {
    var model = Mapper.Map<DocumentType, DocumentTypeViewModel>(new DocumentType());
    Viewbag.List=Userlist// bind your list here
    return View(model);
   }

In view

Just use a table and a forech loop to represent your list data

     @foreach (var item in @Viewbag.List) 
    {
    //Define your table structure
    }

And i am not clear what u r saying about your second step for adding data.let me clear first. Thanks

answered May 16, 2014 at 18:41

Badhon Ashfaq

9077 silver badges13 bronze badges

Collectives™ on Stack Overflow

Create a model that contains a list of objects

2 Answers 2

16 Comments

In Controller

In view

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

16 Comments

In Controller

In view

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related