I just started learning about ViewModels in ASP.NET MVC. So, I thought of implementing a sample example as below:
Business Entity
public class AddModel
{
public int a { get; set; }
public int b { get; set; }
public int Add()
{
return (this.a + this.b);
}
}
Add ViewModel
public class AddViewModel
{
public AddModel addModel;
public int Total { get; set; }
}
Controller
public class AddController : Controller
{
[HttpPost]
public JsonResult Add(AddViewModel model)
{
int iSum = model.addModel.a + model.addModel.b;
model.Total = iSum;
return Json(model);
}
public ActionResult Index()
{
return View();
}
}
View Implementation
@model ViewModelApplication.AddViewModel
<script type="text/javascript" src="../../Scripts/MicrosoftAjax.js"></script>
<script src="../../Scripts/MicrosoftMvcAjax.debug.js" type="text/javascript"></script>
<script type="text/javascript">
function Callback(data) {
alert("I am sucess call");
}
function Failed() {
alert("I am a failure call");
}
</script>
@using (Ajax.BeginForm("Add", "Add", new AjaxOptions { OnSuccess = "Callback", OnFailure = "Failed" }))
{
<table align="center">
<tr>
<td class="tdCol1Align">
<label>
Number1</label>
</td>
<td class="tdCol2Align">
@Html.TextBoxFor(Model => Model.addModel.a)
</td>
</tr>
<tr>
<td class="tdCol1Align">
<label>
Number2</label>
</td>
<td class="tdCol2Align">
@Html.TextBoxFor(Model => Model.addModel.b)
</td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="submit" value="Add" class="button" />
</td>
</tr>
</table>
}
The problem here is that I am unable to retrieve the values entered into the text boxes whenever the Add
button is clicked; the corresponding AJAX action is being it.
When I try to access the values of a
and b
, I get nulls instead of the values entered into the text boxes.
I am not sure where I am going wrong. Please help.
You should not use the domain (business) entities in your view model. If you do, a view model is pretty useless since it stills contains business logic which you might not want in the view. The model in your example doesn't really represent a real-world scenario, a view model is not really needed for it anyway.
A more common and trivial example of a view model is a login form: You probably have a domain model called
User
and you want them to log in. TheUser
domain model can be big and just a small part of it is needed for the authentication. It also contains validation logic for the database which doesn't represent validation logic for the login form.The
User
domain model:The above domain model represents the database table thus containing validation logic to ensure integrity.
The view model above contains just the properties we need for the login form and has it's own data annotations. This helps you to cleanly separate view logic and business/data logic.
your view model should look like this
and in the cshtml
in the controller
Edit
View model is there to render your views don't place any logic inside that. if you have more complex model then it will be hard to map
Model
withViewModel
. for this you can use AutoMapper or ValueInjector for mapping between model and view model.link for automapper http://automapper.codeplex.com/
link for value injector http://valueinjecter.codeplex.com/
hope this helps