title: Passing list of objects from Angular to Web API
body: <p>How to pass list of object from Angular to a Web API ?</p>
  
  <p>I tried it using content-type as application/json but it shows CORS preflight error.</p>
  
  <p>Following is the Web API Post Method : </p>
  
  <pre><code> [HttpPost]
    public bool getDetails(List&lt;Subnets&gt; data)
    {
        //Logic here
    }
  </code></pre>
  
  <p>Following is the angular code :</p>
  
  <pre><code> $scope.save = function (jsondata) {
  
      $http({
          method: "POST",
          url: "http://localhost:60262/api/IPUpload/getDetails",
          data: jsondata,
          headers: {
              'Content-Type': 'application/json'
          }
      }).then(function (data) {
          alert('success');
          if (data.status) {
              $scope.msg = "Data has been inserted ! ";
          }
          else {
              $scope.msg = "Error : Something Wrong";
          }
      }, function (error) {
          alert('fail');
          $scope.msg = "Error : Something Wrong";
      })
  
  }
  </code></pre>
  
  <p>Following is the Subnet class :</p>
  
  <pre><code> public class Subnets
  {
      public string ID { get; set; }
      public string Subnet { get; set; }
      public string IPAddress { get; set; }
      public string ServerName { get; set; }
      public string Mac { get; set; }
      public string Vmware { get; set; }
      public string Usage { get; set; }
      public string Owner { get; set; }
      public DateTime ExpiryDate { get; set; }
      public string Email { get; set; }
      public string SwitchIP { get; set; }
      public string SwitchPort { get; set; }
      public string PortVLAN { get; set; }
      public string Zone { get; set; }
      public string Justification { get; set; }
      public string CustomerID { get; set; }
      public string Remarks { get; set; }
  }
  </code></pre>
  
  <p>I tried using content-type as ' application/x-www-form-urlencoded; charset=UTF-8'. It calls the API action method but the parameter "data" is empty. With content-type as 'application/json', it shows CORS preflight error.  </p>
  
  <blockquote>
    <p>Cross-Origin Request Blocked: The Same Origin Policy disallows reading
    the remote resource at
    <a href="http://localhost:60262/api/StaticIPUpload/getDetails" rel="nofollow noreferrer">http://localhost:60262/api/StaticIPUpload/getDetails</a>. (Reason: CORS
    header ‘Access-Control-Allow-Origin’ does not match ‘(null)’).</p>
  </blockquote>
  
  <p>Thanks in advance.</p>
  
  <p><strong>Solution :</strong> </p>
  
  <p>I added following piece of code in global.asax and it worked :</p>
  
  <pre><code> protected void Application_BeginRequest()
      {
          if (Request.Headers.AllKeys.Contains("Origin") &amp;&amp; Request.HttpMethod == "OPTIONS")
          {
              Response.Flush();
          }
      }
  </code></pre>