How to pass string object data to mvc controller for posting?

Question

This is my code

<form class="form-horizontal formtext col-xs-12 col-sm-10 col-lg-10 row">
<div class="form-group">
        <div class="col-xs-12 col-sm-5 col-lg-3 paddnone">
            <label class="control-label">First Name</label>
        </div>
        <div class="col-sm-5" ng-if="!newRecord">
            <input type="text" class="form-control" ng-model="userDetails.firstname" />
        </div>
        <div class="col-sm-5" ng-if="newRecord">
            <input type="text" class="form-control" ng-model="userDetails.firstName" />
        </div>
    </div>
    <div class="form-group">
        <div class="col-xs-12 col-sm-5 col-lg-3 paddnone">
            <label class="control-label">Last Name</label>
        </div>
        <div class="col-sm-5" ng-if="!newRecord">
            <input type="text" class="form-control" ng-model="userDetails.lastname" />
        </div>
        <div class="col-sm-5" ng-if="newRecord">
            <input type="text" class="form-control" ng-model="userDetails.lastName" />
        </div>

    </div>
    <div class="form-group">
        <div class="col-xs-12 col-sm-5 col-lg-3 paddnone">
            <label class="control-label">Email Id</label>
        </div>
        <div class="col-sm-5" ng-if="!newRecord">
            <input type="text" class="form-control" ng-model="userDetails.emailid" />
        </div>
        <div class="col-sm-5" ng-if="newRecord">
            <input type="text" class="form-control" ng-model="userDetails.emailId" />
        </div>
    </div>
    <div class="col-xs-12 col-sm-9 col-lg-7  btnbg">
            <button class="btn btn-primary " ng-click="create(userDetails)">
            SAVE
            </button>
            <button class="btn btn-primary ">
                Cancel
            </button>
        </div>

       $scope.create = function (userDetails) {
        var userData = angular.toJson(userDetails);
        return dataFactory.post("/Usercontroller/Save", userData)
        .then(function (result) {
           alert("save successfully"); 

        });

     public class UserDataModel 
     {
      public UserDataModel ();
      public Dictionary<string, string> Data { get; set; }
     public string FormName { get; set; }
     }
     public async Task<JsonNetResult> SaveUser(string applicationId, dynamic user)
     {
        Dictionary<string, string> dict = JsonConvert.DeserializeObject<Dictionary<string, string>>(user);
         UserDataModel userDataModel = new UserDataModel ();
        //userDataModel .Data = dict;
        userDataModel.FormName  = "one";
        userDataModel = await Post<UserDataModel>(new UserDataModel{ Data = dict });
        return new JsonNetResult { Data = userDataModel  };
      }

In the above code when i click save button data pass to create function in js,then the entire data convert to string and pass to mvc controller , but the dynamic user got object , now how to deserialze and store to webapi.

Answer 1

Have your HTML code like this, using Razor Syntax

@using (Html.BeginForm("Upload", "ModelClass")
{
    @Html.ValidationSummary(true)

    //HTML elements which are based on your model class members.

}

In your controller class method, it would send this form data to the Upload Method.

[HttpPost]
public ActionResult Upload(ModelClass model) 
{
    //Send model to the model object to Model class for processing

    return RedirectToAction("Upload");
}

EDIT: This method I have used in ASP.NET MVC 5 on Visual Studio community edition 2013.

Answer 2

1. So you have two options here, 1) You should use razor cshtml instead of html, it will ease your life. Following link will help you. http://blog.michaelckennedy.net/2012/01/20/building-asp-net-mvc-forms-with-razor/
2. If you want to use existing html code: a) You have to make the name of all fields same as your class object variable, it will automatically parse it to object when server side c# code got the control after form submission. b) Make the parameter of c# form submission handler function to FormCollection

Following links will help you, ASP.NET MVC 3 Razor: Passing Data from View to Controller

Deserialization:

     var json = JsonConvert.DeserializeObject<dynamic>(sampleJson);
var data = ((JObject)json.data).Children();

Deserialize JSON with dynamic objects