Angularjs Model passing null to MVC controller - angularjs

Question

The following code is sending null object to MVC controller from Angularjs controller. In the "batarang" $scope is displaying EmployeeInfo object with proper values fill in HTML form. But MVC method is getting all values null. My code is as below
Controller :
Angular.module("myApp", []).controller("EmployeeBasicCtrl", function ($scope, $http) {
$scope.signBox = false;
$scope.SEX = [
{ text: "Non of above", value: "N" },
{ text: "Female", value: "F" },
{ text: "Male", value: "M" },
]
$scope.submitBasicInfo = function () {
$http({
method: 'POST',
url: '/EmployeeInfo/AddEmployee'
}).success(
function (resp) {
$scope.success = resp.success;
$scope.Message = resp.Message;
}
)// success en
} // end of submit form
})// end of controller
HTML:
<form ng-submit="submitBasicInfo()" name="EmployeeBasic" ng-controller="EmployeeBasicCtrl">
<div class="well">
<input type="hidden" name="EmpID" />
<div class="panel panel-heading panel-primary">
<div class="panel-heading"><h3> Personal Information </h3></div>
<label> First Name </label>
<input name="Fname" class="form-control" ng-model="EmployeeInfo.Fname" required />
<small ng-show="EmployeeBasic.Fname.$touched && EmployeeBasicEmployeeBasic.Fname.$invalid">First Name is mandatory</small><br />
..........
MVC Controller:
[HttpPost]
public JsonResult AddEmployee(EmployeeInfo para)
{
return Json(new {success="success" },JsonRequestBehavior.AllowGet);
}
EmployeeInfo class:
public class EmployeeInfo
{
public string EmpID { get; set; }
public string Fname { get; set; }
public string Sname { get; set; }
public DateTime DOB { get; set; }
public string Email { get; set; }
public string Mobile { get; set; }
public string Gender { get; set; }
public string UnitNo { get; set; }
public string StreetNo { get; set; }
public string Suburb { get; set; }
public string StateID { get; set; }
public string PostCode { get; set; }
Help is appreciated

Answer 1

this is because you are not posting the data through service,that's why you got null in backend
your post request should be like
$scope.EmployeeInfo ={'Fname':'',EmpID:''....all your child obj of EmployeeInfo }
$scope.submitBasicInfo = function (EmployeeInfo) {
$http({
method: 'POST',
url: '/EmployeeInfo/AddEmployee',
data: EmployeeInfo, // what data you want to send
headers: {'Content-Type': 'application/json'}
});
}
you can pass EmployeeInfo object from view
<form ng-submit="submitBasicInfo(EmployeeInfo)" name="EmployeeBasic" ng-controller="EmployeeBasicCtrl">