title: Passing complex object from Angularjs controller to MVC controller is not working
body: <p>On Ajax call from Angular controller, i am passing a complex object as data. On MVC controller object has all null values.
  I have MVC view as given below, which will be the boiler plate for Register customer View.</p>
  
  <pre><code>&lt;div data-ng-app="customer" id="customer" data-ng-controller="rootViewModel"&gt;
  &lt;h2&gt;{{ pageHeading }}&lt;/h2&gt;
  &lt;hr /&gt;
  &lt;form id="formElement"&gt;
      &lt;div ng-view&gt;&lt;/div&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p></p>
  
  <p>Using AngularJS, I will be loading the register customer view, mark of register customer view given below. I have register customer function tied to button using <code>ng-click</code> directive.</p>
  
  <pre><code>&lt;fieldset class="form-horizontal"&gt;
  &lt;div class="form-group"&gt;
      &lt;label class="control-label col-sm-3"&gt;Company Name&lt;/label&gt;
      &lt;div class="col-sm-4"&gt;
          &lt;input class="form-control inputfieldValidation" ng-model="customer.Name" type="text" placeholder="Full company name" required autofocus /&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="form-group"&gt;
      &lt;label class="control-label col-sm-3"&gt;PAN&lt;/label&gt;
      &lt;div class="col-sm-4"&gt;
          &lt;input class="form-control" ng-model="customer.Pan" type="text"&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="form-group"&gt;
      &lt;label class="control-label col-sm-3"&gt;TIN&lt;/label&gt;
      &lt;div class="col-sm-4"&gt;
          &lt;input class="form-control inputfieldValidation" ng-model="customer.Tin" type="text" required /&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;button class="btn btn-primary proceedNext" id="registerCompany" ng-click="registerCompany(customer)"&gt;Register Customer&lt;/button&gt;
  &lt;/fieldset&gt;
  </code></pre>
  
  <p>I have angular controller, which has function called <code>registerCustomer()</code> that will be called on click of register customer. I have an ajax call inside that function as given below.</p>
  
  <pre><code>customerModule.controller("CustomerRegistration", function ($scope) {
      var initialize = function () {
      }
      $scope.registerCompany = function (customer) {
          $.ajax({
              url: 'Home/RegisterCompany',//make sure url exist
              data: JSON.stringify({company: customer}),//pass data to action
              type:'POST',
              success: function (data) {
                  alert(JSON.stringify(data));
                  //window.location.href = '@Url.Action("Order")'; //redirect
              }
          });
      }
      initialize();
  });
  </code></pre>
  
  <p>On MVC, i have a model called Company as given below.</p>
  
  <pre><code>public class Company
  {
      public string Name;
      public string Pan;
      public string Tin;
  }
  </code></pre>
  
  <p>and my MVC controller look as </p>
  
  <pre><code>[HttpPost]
  public JsonResult RegisterCompany(Company company)
  {
      //Do something
      return null;
  }
  </code></pre>
  
  <p>Always I have null object on MVC controller, please help me if am missing anything. Thanks in advance</p>