title: How to pass a list to the view with ajax?
body: <p>It doesn't show anything. I want to show each object in the list with id and name. </p>
  
  <p>Is it possible to use a viewmodel and pass it to the view through ajax controller.
  So that in the controller i return a view of the viewmodel that contains a list of my objects.
  A want to use ajax. What am i doing wrong?</p>
  
  <p>MyModel</p>
  
  <pre><code>public class Clematis
  {
      public int Id { get;}
      public string Name { get; }
      public int ZoneId { get; }
  }
  </code></pre>
  
  <p>The Controller</p>
  
  <pre><code>    public List&lt;Clematis&gt; GetClematis()
      {
          ClematisSelectionViewModel model = ClematisSelectionViewModel.Load(page);
          List&lt;Clematis&gt; clematisList = model.ClematisList;
          return clematisList;
  
      }
  </code></pre>
  
  <p>The View</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  {
          $.ajax({
          type: "GET",
          url: '/Clematis/GetClematis',
          data: {},
          contentType: "application/json; charset=utf-8",
          dataType: "json",
          beforeSend: function() {
              $("#div_Loader").show();
          },
          success: function (response) {
              $.each(response,
                  function(i, val) {
                      $("#output").append(val.Id);
                  });
          },
          complete: function() {
              $("#div_Loader").hide();
          }
      });
  &lt;/script&gt;
  &lt;div id="div_Loader" style="padding-left: 400px; top: 500px"&gt;
  &lt;img src="~/images/Loading.png" width="100px" height="100px" alt="loader" /&gt;
  &lt;/div&gt;
  &lt;div id="output"&gt;
  &lt;/div&gt; 
  </code></pre>