如何捕获 ajax 在 asp.net razor 页面中发送的数据？

Question

我正在尝试用我单击的用户的数据填充局部视图。这是代码：

   <tbody class="text-center  ">
                @foreach (var user in Model.UserList)
                {
                    <tr key="@user.Id" id="@user.Id" class="useridinfo clickable text-center row_hover "
                        data-toggle="ajax-admin" data-url="@Url.Page("/AdminPage", "_UserInfo_AdminPartial")"
                        @*onclick="ShowUserInfo(@user.Id)"*@>
                        <th scope="col" style="width:500px">@user.Email</th>
                    </tr>
                } 
            </tbody>

c#

 public  PartialViewResult OnGetUserInfo_AdminPartial(string UserId)
    {
        UserList = _context.Users.ToList();
        return new PartialViewResult
        {
            ViewName = "_UserInfo_AdminPartial",
            ViewData = new ViewDataDictionary<User>(ViewData, new User())
            //ViewData = new ViewDataDictionary<User>(ViewData, _context.Users.FirstOrDefault(p=>p.Id== UserId))
        };
    }

Jquery

$(function () {
    var placeholderElement = $('#user_placeholder');
    var ids = $(".useridinfo").attr("id");
    $('tr[data-toggle="ajax-admin"]').click(function (userId) {
        var url = $(this).data('url');

            $.ajax({
                type: "GET",
                url: url,
               // data: JSON.stringify({ "UserId": ids }),
                data: ids,
               
            success: function () {
                placeholderElement.load("/AdminPage?handler=UserInfo_AdminPartial");
            }
        });
        console.log(ids)
    });});

局部视图，目前非常空

    @model  Data.Account.User

@{
}
<div id="user_partial" class="ceva">
    <form asp-page-handler="UserInfo_AdminPartial"></form>
    <h5>test</h5>
    <h6>@Model.Id</h6>
</div>

使用此方法： ViewData = new ViewDataDictionary<User>(ViewData, new User()) 有效，但它会使用捕获的 ID 创建一个新用户。我想将具有该 ID 的现有用户发送到部分视图，但 string UserId 始终为空。所以 ID 已发送，但我不知道如何捕获它。我该怎么办？

Answer 1

处理程序名称是 UserInfo_AdminPartial ，因此将 data-url="@Url.Page("/AdminPage", "_UserInfo_AdminPartial")" 更改为 data-url="@Url.Page("/AdminPage", "UserInfo_AdminPartial")".

下面的整个工作演示：

@page 
@model AdminPageModel

<table class="table">
    <tbody>
        @foreach (var user in Model.UserList)
        {
            <tr key="@user.Id" id="@user.Id" class="useridinfo clickable text-center row_hover"
                data-toggle="ajax-admin" data-url="@Url.Page("/AdminPage", "UserInfo_AdminPartial")">
                <td>@user.Id</td>
            </tr>
        } 
    </tbody>
</table>
<div id="user_placeholder"></div>
@section Scripts
{
    <script>
        $(function () {
            var placeholderElement = $('#user_placeholder');
            $('tr[data-toggle="ajax-admin"]').click(function () {
                var url = $(this).data('url');
                var ids = $(this).attr("id");
                    $.ajax({
                        type: "GET",
                        url: url + "&UserId=" + ids,                       
                        success: function (res) {
                            placeholderElement.html(res); 
                        }
                });
                console.log(ids)
            }); 
        })
    </script>
}

页面模型：

public class AdminPageModel : PageModel
{
    public List<User> UserList { get; set; }
    public void OnGet()
    {
        UserList = _context.Users.ToList();
    }
    public PartialViewResult OnGetUserInfo_AdminPartial(string UserId)
    {
        UserList = _context.Users.ToList();

        var user = UserList.Where(a => a.Id == UserId).FirstOrDefault();

        return new PartialViewResult
        {
            ViewName = "_UserInfo_AdminPartial",
            ViewData = new ViewDataDictionary<User>(ViewData, user)
            //ViewData = new ViewDataDictionary<User>(ViewData, _context.Users.FirstOrDefault(p=>p.Id== UserId))
        };
    }

如何捕获 ajax 在 asp.net razor 页面中发送的数据？

How do I capture the data sent by ajax in asp.net razor page?

jquery

ajax

asp.net-core

razor-pages

partial-views