title: Pass dynamic data to mvc controller with AJAX
body: <p>How can I pass <code>dynamic</code> data with an <code>AJAX</code> call to an <code>MVC</code> <code>Controller</code>?</p>
  
  <p><code>Controller</code>:</p>
  
  <pre><code>public JsonResult ApplyFilters(dynamic filters){
     return null;
  }
  </code></pre>
  
  <p>The <code>AJAX</code> call:</p>
  
  <pre><code>$(':checkbox').click(function (event) {
      var serviceIds = $('input[type="checkbox"]:checked').map(function () {
          return $(this).val();
      }).toArray();
  
      //alert(serviceIds);
  
      $.ajax({
          type: 'GET',
          url: '/home/ApplyFilters',
          data: JSON.stringify({
              name: serviceIds
          }),
          contentType: 'application/json',
  
          success: function (data) {
              alert("succeeded");
          },
          error: function (err, data) {
              alert("Error " + err.responseText);
          }
      });
  
      //return false;
  });
  </code></pre>
  
  <p>Ideally would be that the <code>filters</code> would contain the <code>serviceIds</code> as a property</p>
  
  <p>For example like this: <code>filters.ServiceIds</code>.
  I got another filter for a date range and that one would be added like so: <code>filters.DateRange</code>.</p>
  
  <p>And server side get the filter as a <code>dynamic</code> object in the <code>ApplyFilters()</code></p>