ViewModel to JSON and Back

Question

_{Thursday, August 4, 2011 7:38 AM}

Hi Guys

I have a ViewModel [ X ], I want to convert it to a JSON object and pass it to an Action [ Y ], once it arrives at the [ Y ] I want to convert it back to the ViewModel [ X ] and do whatever needs doing.

Is the above possible ? If Yes, how would I achieve it ?

I would greatly appreciate any help.

Thank You.

All replies (12)

_{Monday, August 8, 2011 1:03 PM ✅Answered}

this is a pretty trival application and requires no ajax/json. please first try learning MVC. go thru the movies demo. then it shoud be obivous that you just need a render the thread post inside a for loop;

@for (var i = 0; i < Model.Post.Count; ++i)
{
  <fieldset>
    @Html.LabelFor(m=>m.Post[i].Title)
    @Html.EditorFor(m=>m.Post[i].Title)
    @Html.LabelFor(m=>m.Post[i].Title)
    @Html.EditorFor(m=>m.Post[i].Body)
 </fieldset>
} 

the controller action Add post shoudl just add a post to the model collection, and render the view.

hint: if only the last one is editable, try the if statement.

_{Thursday, August 4, 2011 7:44 AM}

I have a ViewModel [ X ], I want to convert it to a JSON object and pass it to an Action [ Y ],

If you talk about ViewModel, it is on the server. Also the Action Y. So you can pass objects from an action to another using TempData .

_{Thursday, August 4, 2011 7:57 AM}

If you talk about ViewModel, it is on the server.

Hi Andrei, thanks for replying.

I'm not really sure what you mean by the quoted line ! Inside my Model's folder, I have a ViewModel [ X ], I want that converted to a JSON object, then when needed, back to ViewModel [ X ]

Thanks

_{Thursday, August 4, 2011 8:21 AM}

I do not see the idea. Please explain who will convert( an Action?) and why in Json and not pass via TempData.

_{Thursday, August 4, 2011 8:36 AM}

Hi Andrei

The idea is to have nested forms, Here are a couple of screenshots to explain:

When a user clicks the [ Add Post ] button, a new PartView for the Post Form is inserted below the dotted line via Ajax. Like so:

I want to choose a Category, and add as many posts as I want to that Category, all in one go.

Do you know of a better way to do this ?

Thanks Andrei.

_{Thursday, August 4, 2011 11:20 AM}

it unclear what json has to do with this. are you using a javascript template engine to produce the html, or is the server producing the html. if its the server, then no json needed. if ts a template, then the controller returns json and no view is required.

_{Thursday, August 4, 2011 7:36 PM}

Make an Action that returns a (Partial)  View of Post. Call it with Ajax/Jquery ( maybe  with a parameter the Category). After calling, render to the View.

( not specifying that you can render the POST view in a hidden div the action first and put , at a button click event on browser, as many copies of the contents of the div)

_{Friday, August 5, 2011 6:20 AM}

I am new to AJAX, so maybe JSON does not have anything to do with it, I just did some google searching and looked at a couple of JSON things and at the moment it made sense !

So that it is clear to you what the issue is, I have gone ahead and created a little video.

Thanks

_{Sunday, August 7, 2011 4:19 AM}

anyone ?

_{Sunday, August 7, 2011 5:28 AM}

I think in act1 action  created new form not include CategoryID info. you include form Title and Post info but not CategoryID.

so second way is, you can in Create action foreach loop assing p.categoryID = model.Category

_{Monday, August 8, 2011 4:01 AM}

Is there no better way ? is there no way I can do this with automatic MVC3 model binding ?

_{Monday, August 8, 2011 1:20 PM}

Yes ofcourse you can do it. In ajax call keep your

type : JSON

and pass data like

Suppose your view model is like

public class Employee

{

public string name {get;set;}

public int id{get;set;}

}

den pass

var employee = {

name:'namex',

id:1

}

data : {'employee':employee }

and write your action method as

public JSONResult actiony(Employee employee)

{

//and here you can have access to ur view model

}