Model binding dynamic collections. IV


The second supported operation is deleting a bunch of existing entries.

Deleting Existing Entries

The experience is as follows:

  1. a list of things is displayed in the table
  2. each thing has a trash button that allows deleting the thing from the list
  3. When the list looks as it should, the user can:
    • Accept the changes and persist the trimmed list of things
    • Discard the changes and replace the elements as of the beginning of the operation

The model

As things are to be deleted, there is a DeletableThing model with the client deletion concern (IClientDeletable). the model is part of the DeleteViewModel that will be sent to the view for display.

The views

The view displays a list of deletable things as a table using a template inside a form:

In order to turn the elements of the table deletable, we use an event handler for each of the trash cans that will eventually hide the whole row and “mark” it as deleted.

Remember that I mentioned that the default model binder was not very happy with “holes” in our collection? Well, that is the reason that we have to mark as deleted in the client and not remove the row at all, otherwise we would be getting back in the server the elements in the collection until the first hole in the naming convention is found.

The controller

The method that gets the list of things posted by the client once they have been deleted is pretty similar to the one we saw for SortController:

Following the same pattern as when sorting, the interesting stuff happens when mapping the information from the post to the entities:

Where the .Delete() extension method is used to filter out those entities deleted in the client.

Can we delete?

Torch them!


All code for deletions can be accessed here.