在淘汰渲染完成后引发Ajax事件？ （用截图解释）

Question

<div data-bind="style: { display: isShortlisted() === false ? 'inline-block' : 'none'}">
    <form id="shortlistForm" action="@MVC.GetLocalUrl(MVC.HireOrgJobApplication.AjaxShortlist(Model.Application))" method="post" style="display:inline;">
        @Html.AntiForgeryToken()
           <input type="hidden" name="ApplicationKey" value="@Model.Application.ApplicationKey" />
               <button type="submit" class="btn-act jui-tooltip" title="Shortlist">
                   <i class="fa fa-2x fa-star"></i>
               </button>
    </form>
</div>

<div data-bind="style: { display: isShortlisted() === true ? 'inline-block' : 'none'}">
  <form id="unshortlistForm" action="@MVC.GetLocalUrl(MVC.HireOrgJobApplication.AjaxUnshortlist(Model.Application))" method="post" style="display: inline;">
  @Html.AntiForgeryToken()
    <input type="hidden" name="ApplicationKey" value="@Model.Application.ApplicationKey" />
      <button type="submit" class="btn-act-active jui-tooltip" title="Remove from shortlist">
        <i class="fa fa-2x fa-star" style="color:#f3b700;"></i>
      </button>
  </form>
</div>

$('form#shortlistForm').ajaxForm(function () {
    viewModel.isShortlisted = true;
});


$('form#unshortlistForm').ajaxForm(function () {
    viewModel.isShortlisted = false;
});

我有一个按钮的代码，＆＃34;短名单＆＃34;申请人。
简要说明一下，我打算将＆＃34; shortlistForm＆＃34;按钮到 ＆＃34; unshortlistForm（这意味着它已经入围）＆＃34;单击按钮时。

请查看随附的屏幕截图：

所以看起来像这样的开始

点击后应该如下所示。

当我在Google Chrome上检查我的网络状态时，它已成功发布＆＃34;发布＆＃34;到正确的链接。

但问题是，我必须更新它才能看到变星。

现在当我点击按钮时，它会给我

只是一个真实＆＃39;的页面书面。

我希望它立即发生而不会给我那个页面，或让我刷新页面以查看更改。

我假设这种情况正在发生，因为在完成淘汰渲染之前我无法呈现Ajax表单。如何在敲除生成后使ajax形成？

请帮助!!