视图模型内容在 ajax 调用后为空

Viewmodel contents null after ajax call?

本文关键字：调用 ajax 模型 视图      更新时间：2023-09-26

我正在创建一个 ASP.NET 的MVC应用程序。我目前正在开发一个搜索页面，其中搜索框和结果表都显示在同一页面上。为此，我将部分视图和 AJAX/JSON 调用与视图模型一起使用。在文本框中输入两个搜索词后，在通过 ajax 传递后，这两个词在控制器中均为 null。

这是代码：

视图模型：

public class ExampleViewModel
{
    public string search { get; set; }
    public string search2 { get; set; }
}

控制器：

[HttpPost]
    public ActionResult Search(ExampleViewModel searchTerm)
    {
        var searchList = db.UserLists.Where(x => x.LastName.Contains(searchTerm.search));
        return PartialView("_SearchResultsPartial", searchList);
    }

索引视图的正文：

<body>
<div>
    @Html.TextBoxFor(model => model.search)
    @Html.TextBoxFor(model => model.search2)
    <input type="submit" value="Search" onclick="return getSearchResults()"/>
</div>
<div id="search-results">
</div>
<script>
    var exViewModel = {
        search: $('#search').val(),
        search2: $('#search2').val()
    }
    function getSearchResults() {        
    $.ajax({
        type: "POST",
        data: JSON.stringify(exViewModel),
        dataType: "json",
        contentType: "application/json",
        url : "/View/Search/",
        success: function (result) {
            $("#search-results").html(result);
        }
    });
    }

</script>

同样，在搜索 [POST] 方法上设置断点后，示例视图模型的项为 null。

乍一看，似乎您必须检索函数范围内的值： 

function getSearchResults() {        
    //Read these values on button click
    var exViewModel = { 
        search: $('#search').val(),
        search2: $('#search2').val()
    }
    $.ajax({
        type: "POST",
        data: JSON.stringify(exViewModel),
        dataType: "json",
        contentType: "application/json",
        url : "/View/Search/",
        success: function (result) {
            $("#search-results").html(result);
        }
    });
}

否则，exViewModel仅在页面加载时确定。

相关文章：