javascript - 如何在不刷新 ASP.net 页面的情况下更新我的 Html 表单？

Question

我已经尝试了很长一段时间来寻找解决方案，但没有成功，所以我来这里问问。

我有一个 ASP.net Web 应用程序，我从数据库中获取信息并将该信息放入 html 页面上的表单中，效果很好。我还有一个搜索功能，效果很好。

但每次我搜索它都会重新加载整个页面。我知道我应该使用 JQuery...不知何故...但我真的不明白如何将它应用到我的代码中。

<div class="tab-content">
    <div id="log" class="tab active">
        <h1>Log</h1>
        @using (Html.BeginForm())
        {
            <p>
                <b>Message:</b> @Html.TextBox("SearchString")
                <input type="button" value="Search" onclick="submit()"/>
            </p>
        }
        @RenderBody()
        @Html.Raw(ViewBag.Data)
    </div>
</div>

Answer 1

有很多方法可以做到这一点。简单的方法是使用普通的 jquery 函数来更改字段中的数据。请参阅下面的示例供您引用。

https://dotnetfiddle.net/zIMk99

$('.submit').click(function(){
  if($('form').valid()) {
    $.ajax({
      url: '@Url.RouteUrl(new{ action="GetAnswer", controller="Home"})',
      data: {Answer: '', Question: $('#Question').val()},
      type: 'POST',
      dataType: 'json',
      contentType: "application/json; charset=utf-8",
      success: function(resp) {
        openAlert(resp);
      }});
  }
  else {
    closeAlert();
  }
});