title: On html.actionlink click, load a partial view below the link
body: <p>Currently in my <code>view</code> this is what I have</p>
  
  <pre><code>&lt;dt&gt;Credit Saldo&lt;/dt&gt;
  &lt;dd&gt;@Model.CreditSaldo @Html.ActionLink("Add Credit","AddCredit",routeValues:new{Model.LicenseId})&lt;/dd&gt; 
  &lt;br/&gt;
  &lt;dd&gt;
     &lt;div id="partialDiv"&gt;&lt;/div&gt;
  &lt;/dd&gt;
  </code></pre>
  
  <p>Whenever User clicks <code>Add Credit</code>, currently it forwards me to new <strong>partial view</strong> (no surprise).</p>
  
  <p>What I want to do is load that partial view in same view, in the div that has Id as <strong>partialdiv</strong>.</p>
  
  <p>Here is the method in <strong>controller</strong>, thats being called when the link is called </p>
  
  <pre><code>[HttpGet]
  public ActionResult AddCredit(Guid licenseid)
  {
          var newCredit = new AddCredits();
          return PartialView(newCredit);
  }
  </code></pre>
  
  <p>and this is what I've done in partial view</p>
  
  <pre><code>@model AdminPortal.Areas.Customer.Models.ViewModels.AddCredits
  
  &lt;div class="input-small"&gt;@Html.EditorFor(m=&gt;m.CreditToAdd) &lt;button class="btn-small" type="submit"&gt;Add&lt;/button&gt;&lt;/div&gt;
  </code></pre>
  
  <p>How can I load the partial view in same view when the link <strong>"Add Credit"</strong> is clicked?</p>
  
  <p>Edit 1 : <strong>Tried Ajax</strong></p>
  
  <pre><code>&lt;dt&gt;Credit Saldo&lt;/dt&gt;
              &lt;dd&gt;@Model.CreditSaldo &amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; @Ajax.ActionLink("Add Credit","AddCredit",new{Model.LicenseId}, new AjaxOptions {UpdateTargetId = "partialDiv"})
              &lt;br/&gt;
              &lt;dd&gt;
                 &lt;div id="partialDiv"&gt;&lt;/div&gt;
              &lt;/dd&gt;
  </code></pre>
  
  <p><strong>Result</strong>: Partial View still loads as new view (not in same view)</p>