在RazorPages中使用路由引數顯示ID值

我目前正在使用一個輸入文本框和一個按鈕來顯示使用區域視圖從資料庫輸入的值，如下圖所示

索引.cshtml

@page
@model IndexModel
@{ ViewData["Title"] = "Index"; }

<form method="get">
    <table>
        <tr>
            <td>
                @Html.TextBox("TxtDepartment")
            </td>
            <td>
                <button type="button" id="DepartmentSearch">Search</button>
            </td>
        </tr>
    </table>
</form>
<br />

<table>
    <tr>
        <td><div id="DepartmentResult"></div></td>&nbsp;
        <td><div id="EmployeeResult"></div></td>
    </tr>
</table>

<form method="get">
    <label>Department Name:</label>
    <input type="text" id="DeptName" />
    <label>Photo File Name:</label>
    <input type="text" id="NameResult" />
</form>

@section Scripts {
    <script>
        $("#DepartmentSearch").click(function()
        {
            $.ajax(
            {
                url: "/Index?handler=DisplayDepartment",
                type: "GET",
                data: { value: $("#TxtDepartment").val() },
                headers: { RequestVerificationToken: $('input:hidden[name="__RequestVerificationToken"]').val() },
                success: function(data) { $("#DepartmentResult").html(data); }
            });
        });
    </script>
}

索引.cshtml.cs

using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using PracticeApp.Models;
using System.Linq;

namespace PracticeApp.Pages
{
    public class IndexModel : PageModel
    {
        public CompanyContext _context;

        public IndexModel(CompanyContext context) { _context = context; }

        public PartialViewResult OnGetDisplayDepartment(int value)
        {
            return Partial("_DisplayDepartmentPartial", _context.Departments.Where(x => x.DepartmentId == value).ToList());
        }

我想要做的是不使用文本框和按鈕，而是希望 URL 中的屬性 ID 值在頁面加載時根據 URL 中的值加載部分視圖

這是我的部門模型

using System.ComponentModel.DataAnnotations;

namespace PracticeApp.Models
{
    public partial class Department
    {
        [Display(Name = "ID")] public int DepartmentId { get; set; }
        [Display(Name = "Name")] public string DepartmentName { get; set; } = null!;
    }
}

我試過 @page {id?} 但我卡在 AJAX 部分

uj5u.com熱心網友回復：

試試這樣：

索引.cshtml.cs：

創建一個 Id 屬性來接收 url 中的引數：

[BindProperty(SupportsGet = true)]
public int Id { get; set; }

public PartialViewResult OnGetDisplayDepartment(int value)
{
    return Partial("_DisplayDepartmentPartial", _context.Departments.Where(x => x.Id == value).ToList());
}

索引.cshtml：

@page "{id?}"
...
@section Scripts {
    <script>
        $(document).ready(function(){
            $.ajax(
                {
                    url: "/Index?handler=DisplayDepartment",
                    type: "Get",
                    data: { value: @Model.Id },
                    headers: { RequestVerificationToken: $('input:hidden[name="__RequestVerificationToken"]').val() },
                    success: function (data) { $("#DepartmentResult").html(data); }
                });
        })
        $("#DepartmentSearch").click(function () {
            $.ajax(
                {
                    url: "/Index?handler=DisplayDepartment",
                    type: "Get",
                    data: { value: $("#TxtDepartment").val() },
                    headers: { RequestVerificationToken: $('input:hidden[name="__RequestVerificationToken"]').val() },
                    success: function (data) { $("#DepartmentResult").html(data); }
                });
        });
    </script>
}

測驗結果：

標籤：C＃asp.net-核心asp.net-ajax.net-6.0剃刀页面

上一篇：在VS2019中，當我更改cshtml代碼時，我必須再次運行應用程式。asp.netcore有沒有選項？

下一篇：BlazorWasm-如何從繼承的組件更新基礎組件？