title: How do I pass this js array to my MVC 3 controller?
body: <p>I am getting null values in the controller. Not sure what am I am missing.</p>
  
  <p>I have a grid where I have a list of guests (with name &amp; email) where user select guest by checkbox.</p>
  
  <p>Then I read name and emails of the selected contacts and build js array.
  Then this array is passed to <code>MVC 3 controller</code>.</p>
  
  <p><strong>JS code:</strong></p>
  
  <pre><code>var name ='', email='';
      var guest = new Array();
              var guests = new Array();
              $('.CBC').each(function () {  //loop grid by checkbox class
                  if (this.checked) {
                      name = GetSelectedName();
                      email = GetSelectedEmail();
                      guest = { 'Email': email, 'Name': name };
                      guests.push(guest);
                  }
              });
  
          $.ajax({
          type: "POST",
          url: GetURL(),
          data: guests,
          dataType: "json",
          success: function (res) {
             //do something
          }
  });
  </code></pre>
  
  <p>Controller:</p>
  
  <pre><code>[HttpPost]
      public ActionResult AddGuests(List&lt;SelectedGuest&gt; guests)
      {            
          GuestService svc = new GuestService();
          //do something with guests
          //But Name and Email of all items in guests are null!!!
      }
  
  public class SelectedGuest
  {
      //represent the email columns of the contact grid
      public string Email { get; set; }
  
      //represent the Name column of the contact grid
      public string Name { get; set; }
  }
  </code></pre>
  
  <p>Do I need to explicitly convert js array to json object to serialize it?</p>