显示来自 LINQ 查询的信息

Question

所以我有一个从 JS 传递到我的控制器的字符串，如下所示：

JavaScript

function findEmployees(userCounty) {
    $.ajax({
        type: "POST",
        dataType: "json",
        url: '@Url.Action("getCounty", "Contact")',
        data: JSON.stringify(userCounty),
        contentType: "application/json",
    });
}

控制器

    [HttpPost]
    public ActionResult Index([FromBody] string userCounty)
    {
        var county = userCounty.Substring(0, userCounty.IndexOf(" "));
        var query = from m in _context.model where m.county == county select new Model 
        {
          FirstName = m.Firstname
          LastName = m.LastName
        };

        if (query == null)
        {
            return NotFound();
        }
        return View(query.ToList());
    }
    [HttpGet]
    public ActionResult Index()
    {
        return View();
    }

查看

@model Project.Models.ModelName
<table class="table">
<tbody>
    <tr>
        <td>
            @Html.DisplayFor(model => model.FirstName) @Html.DisplayFor(model => model.LastName)
        </td>
    </tr>
</tbody>

我可以将字符串从 JS 传递到我的控制器并查询数据库，但是如何更新页面以在我的视图中显示查询结果？任何事情都有帮助。谢谢！

Answer 1

ajax返回的数据是text或者json。如果你想使用 c# 来更新页面。可以让actiongetCounty返回局部视图，局部视图自动返回html数据。

更改操作getCounty。

    [HttpPost("getCounty")]
    public ActionResult Index([FromBody] string userCounty)
    {
        var county = userCounty.Substring(0, userCounty.IndexOf(" "));
        //...
        return PartialView(query.ToList());
    }

部分视图 Index.cshtml

@model List<ModelName>
<table class="table">
<tbody>
    @for (var i = 0; i < Model.Count; i++)
    {
        <tr>
            <td>
                @Html.DisplayFor(model => model[i].FirstName) @Html.DisplayFor(model => model[i].LastName)
            </td>
        </tr>
    }
</tbody>
</table>

查看

@model ModelName
<div id="datalist">
    
</div>
<!--other code-->
@section Scripts{
    <script>
    function findEmployees(userCounty) {
        $.ajax({
            type: "POST",
            //dataType: "json",
            url: '@Url.Action("getCounty", "Contact")',
            data: JSON.stringify(userCounty),
            contentType: "application/json",
            success: function (data) {
                $('#datalist').html(data)
            },
            error: function (e) {
                console.log(e)
            }
        });
    }
    </script>
}

可以根据userCounty生成不同的数据表

Answer 2

您可以像这样将列表添加到页面。然后您可以在每个循环中按 div 或 ul 列表。

function findEmployees(userCounty) {
        $.ajax({
            type: "POST",
            dataType: "json",
            url: '@Url.Action("getCounty", "Contact")',
            data: JSON.stringify(userCounty),
            contentType: "application/json",
            success: function (result) {
                if (result.data.length !== 0) {
                    $.each(result.data, function (index, value) {
                        var firstName = value.firstName;
                        var lastName = value.lastName;
                    });
                }
            },
        });
    }