ASP.NET MVC 4 Web API & Knockout.js

Question

I´m starting a Proof-of-concept SPA using the new Web API and Knockout, so far I´ve managed to create the API controller, consume it with Knockout and map entities and arrays using Knockout mapping.

I´m now trying to create a simple CRUD, but I can´t get my head around as to how to implement the ViewModels.

So far I´ve come up with 2 options, listed below:

I can define a ViewModel on the server, that contains the entity´s attributes, plus an array of the same entity. When I enter the CRUD functionality, I call the server and retrieve that ViewModel, with the entity list and the attributes for creating a new entry.
I can define 2 ViewModels, one with the grid data, and another with the entity´s attributes. When I call the CRUD functionality, I get the grid data, and when I want to edit/create a new entry, I call the server and retrieve the ViewModel for that.

On both options I use one single view, which contains the grid definition, and the edit/create form format, which I display on a JQuery pop-up.

I can´t figure out which would be the best option, I´m starting to lean towards the 2nd one, but some guidance would be appreciated.

Thanks in advance!

Tom W Hall · Accepted Answer · 2012-10-21 22:45:00Z

1

Do you really need to call the server at the point that you launch the Create / Edit dialog? Could you not have, say, an ObservableArray of EntityVM (a Knockout view model) as the binding source of your grid, and when you either click Add New or click an existing item, the Create / Edit dialog is made visible (that could be done with binding too) with either an empty EntityVM as its data source or a populated EntityVM copied from the grid source's item? Then when you click Save, Ajax the entity as JSON to the server and return a JSON response representing the updated grid data? Or is that not the right understanding of your context?

answered Oct 21, 2012 at 22:45

Tom W Hall

5,2834 gold badges32 silver badges35 bronze badges

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

1 Comment

Fabian Silva Over a year ago

Yes, that´s a much cleaner approach. Thanks!

Collectives™ on Stack Overflow

ASP.NET MVC 4 Web API & Knockout.js

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related