title: render partial view through ajax
body: <p>I have a dashboard view. In this dashboard I want to render number of partial views. I started this exercise just for learning purpose. Actually I am not sure what I am doing wrong. Here is my code:</p>
  
  <p>My DashboardController: </p>
  
  <pre><code>public ActionResult DashboardIndex()
          {
              return View();
          }
  
          public ActionResult DebitAndCreditExpensesPV()
          {
              DashboardModel objGet = new DashboardModel();
              DashboardViewModel objVM = new DashboardViewModel();
              DateTime date = new DateTime();
              objVM.StartDate = new DateTime(date.Year, date.Month, 1);
              objVM.EndDate = objVM.StartDate.AddMonths(1).AddDays(-1);
              objVM.ExpenseType = objGet.GetExpensesByDebitAndCredit(objVM.StartDate, objVM.EndDate);
              return PartialView(objVM);
          }
  </code></pre>
  
  <p>My DashboardIndex.cshtml</p>
  
  <pre><code>@model GPI.ViewModel.DashboardViewModel
  @{
      ViewBag.Title = "DashboardIndex";
  }
  
  
  &lt;div class="container"&gt;
      &lt;div class="row"&gt;
          &lt;div class="col-md-12"&gt;
              &lt;div class="col-md-4"&gt;
                     @{
                         Html.RenderPartial("DebitAndCreditExpensesPV");
                 }
              &lt;/div&gt;
              &lt;div class="col-md-8"&gt;&lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;script&gt;
      $(document).ready(function () {
  
          $.ajax({
  
              type: "get",
              url: "/Dashboard/DebitAndCreditExpensesPV",
              data: {
                  'startDate': $('#StartDate').val(),
                  'endDate': $('#EndDate').val()
              },
              dataType: 'json',
              success: function () {
                  alert('success');
              },
              error: function () {
                  alert('failure');
              }
          });
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>DashboardModel.cs</p>
  
  <pre><code>public class DashboardViewModel
      {
          public double ExpenseAmount { get; set; }
          public DateTime StartDate { get; set; }
          public DateTime EndDate { get; set; }
          public ExpenseList ExpenseType { get; set; } 
      }
  
      public class ExpenseList 
      {
          public double TotalDebits { get; set; }
          public double TotalCredits { get; set; }
      }
  </code></pre>
  
  <p>My Partial View: DebitAndCreditExpensesPV.cshtml</p>
  
  <pre><code>@model GPI.ViewModel.DashboardViewModel
  &lt;div class="row"&gt;
      &lt;div class="col-sm-4 col-md-12"&gt;
          &lt;div class="stat-panel"&gt;
              &lt;div class="stat-row"&gt;
                  &lt;div class="stat-cell bg-pa-purple padding-sm"&gt;
                      &lt;div class="col-xs-6"&gt;
                          &lt;div class="text-xs" style="margin-bottom:5px;"&gt;
                              Debit EXPENSES
                          &lt;/div&gt;
                          &lt;div style="width:100%;display:inline-block;margin-bottom:-2px;position:relative;"&gt;
                              &lt;span class="text-xlg"&gt;
                                  &lt;span class="text-lg text-slim"&gt;&amp;#8377;&lt;/span&gt;
                                  &lt;strong&gt;@Model.ExpenseType.TotalDebits&lt;/strong&gt;
                              &lt;/span&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="col-xs-6"&gt;
                          &lt;div class="text-xs" style="margin-bottom:5px;"&gt;
                              Credit EXPENSES
                          &lt;/div&gt;
                          &lt;div style="width:100%;display:inline-block;margin-bottom:-2px;position:relative;"&gt;
                              &lt;span class="text-xlg"&gt;
                                  &lt;span class="text-lg text-slim"&gt;&amp;#8377;&lt;/span&gt;
                                  &lt;strong&gt;@Model.ExpenseType.TotalCredits&lt;/strong&gt;
                              &lt;/span&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
  
                  &lt;/div&gt;
              &lt;/div&gt;
              &lt;div class="stat-row"&gt;
                  &lt;div class="stat-counters bordered no-border-t text-center"&gt;
                      &lt;div class="stat-cell col-xs-12 padding-sm"&gt;
                          &lt;div class="input-daterange input-group" id="datepicker"&gt;
                              @Html.TextBoxFor(m =&gt; m.StartDate,"{0:d}", new { @class = "input-sm form-control" })
                              &lt;span class="input-group-addon"&gt;to&lt;/span&gt;
                              @Html.TextBoxFor(m =&gt; m.EndDate, "{0:d}", new { @class = "input-sm form-control" })
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I put two break points in my controller: one at 'DashboardIndex' action and other at 'DebitAndCreditExpensesPV'. The first one executes but later one does not. After first breakpoint, I got 'object null reference ' exception in my partial view at this line <code>&lt;strong&gt;@Model.ExpenseType.TotalDebits&lt;/strong&gt;</code>.</p>
  
  <p>I want to know why second breakpoint is not executing. I this break point executes, I can not get this exception. Please tell me where I am going wrong.</p>