【问题标题】:Razor Page: RedirectToPage with ParametersRazor 页面:带参数的 RedirectToPage
【发布时间】:2021-03-18 19:42:56
【问题描述】:

我有一个显示公司和员工列表的剃须刀页面:

@page "/admin/companies/editor/{id}"
@model EditorModel
@{
}

<h1>admin . companies . editor</h1>


<h4>Id = @Model.Id</h4>
<h4>Name = @Model.OrgStructure.Organisation.Name</h4>
<h4>Staff Count = @Model.OrgStructure.Staff.Count</h4>

<table>
    <tr>
        <th>Id</th>
        <th>Name</th>
    </tr>
    @if (Model.OrgStructure.Staff.Any())
    {
        foreach (Staff s in Model.OrgStructure.Staff)
        {
            <tr>
                <td>@s.Id</td>
                <td>@s.Username</td>
            </tr>
        }
    }
    else
    {
        <tr>
            <td colspan="2">No Staff</td>
        </tr>
    }
</table>
<a class="btn btn-primary" asp-page="/admin/companies/staff/create" asp-route-orgId="@Model.OrgStructure.Organisation.Id">Create Staff</a>


@functions {
    public class EditorModel : PageModel
    {

        public string Id { get; set; }

        public OrganisationStructure OrgStructure { get; set; }

        public void OnGet(string id)
        {
            Id = id;
            using (DirectoryApp app = ServicesFactory.MakeDirectoryService())
            {
                OrgStructure = app.GetOrganisationStructureAsync(new Guid(id)).Result;
            }
        }
    }
}

当我点击时:

    <a class="btn btn-primary" asp-page="/admin/companies/staff/create" asp-route-orgId="@Model.OrgStructure.Organisation.Id">Create Staff</a>

它带我进入我的员工创建页面:

@page "/admin/companies/staff/create/{orgId}"
@model CreateModel
@{
}

<h1>admin . companies . staff . create</h1>

<h3>OrganisationId = @Model.OrganisationId</h3>

<form method="post">
    <input name="OrgId" value="@Model.OrganisationId" />
    <div asp-validation-summary="All" class="text-danger"></div>
    <div class="form-group">
        <label>User Name</label>
        <input name="UserName" class="form-control" value="@Model.UserName" />
    </div>
    <button type="submit" class="btn btn-primary">Submit</button>
    <a class="btn btn-secondary" asp-page="/admin/companies/editor" asp-route-id="@Model.OrganisationId">Back</a>
</form>

@functions {
    public class CreateModel : PageModel
    {
        [BindProperty]
        [Required]
        public string UserName { get; set; }

        public Guid OrganisationId { get; set; }

        public void OnGet(string orgId)
        {
            OrganisationId = new Guid(orgId);
        }

        public async Task<IActionResult> OnPostAsync(string userName, string orgId)
        {
            if (ModelState.IsValid)
            {
                using (DirectoryApp app = ServicesFactory.MakeDirectoryService())
                {
                    await app.AddStaffToOrganisationAsync(
                        new Guid(orgId),
                        new Staff()
                        {
                            Username = userName
                        });
                    return RedirectToPage("/admin/companies/editor/" + orgId.ToString());
                }
            }
            return Page();
        }
    }
}

我有两个问题:

  1. 如果我单击提交并出现模型错误,则会收到错误消息,但使用 @Model.OrganisationId 的字段被空白。我猜想当在 OnGet() 方法中设置 OrganisationId 时,这会在发布后丢失。这是否意味着我需要在 OnPostAsync() 方法中重新填充我的 CreateModel.OrganisationId?

  2. 如果我成功的话:

return RedirectToPage("/admin/companies/editor/" + orgId.ToString());

应该带我回到原来的屏幕和新添加的员工一起查看公司。但是,我收到一个错误:

处理请求时发生未处理的异常。 InvalidOperationException:没有名为“/admin/companies/editor/473be1aa-7d62-4964-b744-b34e0489d7ad”的页面与提供的值匹配。

但是,如果我在“localhost:12345”之后将“/admin/companies/editor/473b...”复制并粘贴到浏览器的地址栏中,则页面打开没有问题。

我做错了什么?

更新

我需要更换:

return RedirectToPage("/admin/companies/editor/" + orgId.ToString());

return RedirectToPage("/admin/companies/editor", new { id = orgId.ToString() });

【问题讨论】:

    标签: razor razor-pages


    【解决方案1】:

    如果我单击提交并出现模型错误,则会收到错误消息 但是使用 @Model.OrganisationId 的字段被空白。 我猜当在 OnGet() 方法中设置 OrganisationId 时,这是 发帖后丢失。这是否意味着我需要重新填充我的 OnPostAsync() 方法中的 CreateModel.OrganisationId?

    答案是:

    1. 我应该使用 CreateModel 本身的属性(通过绑定),而不是在 OnPostAsync 方法中声明参数。
    2. 在 CreateModel 中的 OrganisationId 属性上使用 [BindProperty]。
    3. 在输入控件上,将 OrgId 字段的名称更改为 OrganisationId。

    所以:

    <input name="OrgId" value="@Model.OrganisationId" />
    

    更改为:

    <input name="OrganisationId" value="@Model.OrganisationId" />
    

        public async Task<IActionResult> OnPostAsync(string userName, string orgId)
        {
            if (ModelState.IsValid)
            {
                using (DirectoryApp app = ServicesFactory.MakeDirectoryService())
                {
                    await app.AddStaffToOrganisationAsync(
                        new Guid(orgId),
                        new Staff()
                        {
                            Username = userName
                        });
                    return RedirectToPage("/admin/companies/editor/" + orgId.ToString());
                }
            }
            return Page();
        }
    

    更改为:

        public async Task<IActionResult> OnPostAsync()
        {
            if (ModelState.IsValid)
            {
                using (DirectoryApp app = ServicesFactory.MakeDirectoryService())
                {
                    await app.AddStaffToOrganisationAsync(
                        OrganisationId,
                        new Staff()
                        {
                            Username = this.UserName
                        });
                    return RedirectToPage("/admin/companies/editor", new { id = OrganisationId.ToString() });
                }
            }
            return Page();
        }
    

        [BindProperty]
        [Required]
        public string UserName { get; set; }
    
        public Guid OrganisationId { get; set; }
    

    变化

        [BindProperty]
        [Required]
        public string UserName { get; set; }
    
        [BindProperty]
        public Guid OrganisationId { get; set; }
    

    使用上面的:

    1. 在模型验证失败的帖子上,属性会在之后保留在 UI 上

      返回页面();

    2. 重定向到页面现在可以工作了,因为我已经将参数作为匿名对象移动到第二个参数,而不是连接字符串作为查询参数。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2021-01-17
      • 2019-08-15
      • 2020-07-11
      • 2023-01-30
      • 1970-01-01
      • 2021-01-09
      • 2021-06-15
      • 1970-01-01
      相关资源
      最近更新 更多