.NETCore6中的級聯下拉串列

我剛剛開始使用 .NET Core 6 和 VS2022。我創建了一個帶有 Razor 頁面的 C# MVC 網站并遇到了問題。我不知道如何生成級聯串列，我想我需要設定一個事件處理程式并可能訂閱。AJAX 仍然是解決這個問題的合適方法嗎？我已經看到從方法回傳 JsonResult 作為一種可能的解決方案。有人可以建議嗎？

僅供參考，我已經使用服務和物體框架很好地系結了我的串列，除了這個 UI 位之外，所有這些都在作業。謝謝。

HTML 標記：

<label>Course</label>
<select id="ddlCourse" name="ddlCourse">
    @foreach (var row in Model.Courses)
    {
        <option value="@row.Id.ToString()">@row.Course</option>
    }
</select>

<label>Course Distance</label>
<select id="ddlDistance" name="ddlDistance">
    @foreach (var row in Model.MedianTimes)
    {
       <option value="@row.RowId">@row.Distance</option>
    }
</select>

cshtml.cs 中的 C# 代碼：

public List<Courses> Courses { get; set; }
public List<MedianTimes> MedianTimes { get; set; }

public void OnGet()
    {
        if (DataInMemoryCache.GetFromCache(_courseCacheKey) != null)
        {
            Courses = (List<Courses>)DataInMemoryCache.GetFromCache(_courseCacheKey);
        }
        else
        {
            Courses = _courseDbContext.Courses.ToList();
        }
        DataInMemoryCache.AddToCache(_courseCacheKey, Courses);

        if (DataInMemoryCache.GetFromCache(_medianTimesCacheKey) != null)
        {
            MedianTimes = (List<MedianTimes>)DataInMemoryCache.GetFromCache(_medianTimesCacheKey);
        }
        else
        {
            MedianTimes = _medianTimesDbContext.MedianTimes.ToList();
        }
        DataInMemoryCache.AddToCache(_medianTimesCacheKey, MedianTimes);
    }

uj5u.com熱心網友回復：

這是一個使用 js 生成級聯串列的作業演示：

cshtml:

<label>Course</label>
<select id="ddlCourse" name="ddlCourse">
    @foreach (var row in Model.Courses)
    {
        <option value="@row.Id.ToString()">@row.Course</option>
    }
</select>

<label>Course Distance</label>
<select id="ddlDistance" name="ddlDistance">
    @foreach (var row in Model.MedianTimes)
    {
        <option value="@row.RowId">@row.Distance</option>
    }
</select>
@section Scripts{ 
<script>
    $("#ddlCourse").change(function () {
        $.getJSON("?handler=MedianTimes", { Id: $("#ddlCourse").val() }, function (data) {
            var items = '';
            $("#ddlDistance").empty();
            $.each(data, function (index, MedianTimes) {
                items  = "<option value='"   MedianTimes.rowId   "'>"   MedianTimes.distance   "</option>";
            });
            $('#ddlDistance').html(items);
        });
    });
</script>
}

cshtml.cs：

public List<Courses> Courses { get; set; }
public List<MedianTimes> MedianTimes { get; set; }

public void OnGet()
    {
        if (DataInMemoryCache.GetFromCache(_courseCacheKey) != null)
        {
            Courses = (List<Courses>)DataInMemoryCache.GetFromCache(_courseCacheKey);
        }
        else
        {
            Courses = _courseDbContext.Courses.ToList();
        }
        DataInMemoryCache.AddToCache(_courseCacheKey, Courses);

        if (DataInMemoryCache.GetFromCache(_medianTimesCacheKey) != null)
        {
            MedianTimes = (List<MedianTimes>)DataInMemoryCache.GetFromCache(_medianTimesCacheKey);
        }
        else
        {
            MedianTimes = _medianTimesDbContext.MedianTimes.ToList();
        }
        DataInMemoryCache.AddToCache(_medianTimesCacheKey, MedianTimes);
    }
public JsonResult OnGetMedianTimes(int Id) {
            //get MedianTimes with Id
            //MedianTimes =.....
            return new JsonResult(MedianTimes);
        }

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

上一篇：如何在ASP.NETCore6Identity中添加列舉屬性

下一篇：為什么自動模型狀態回傳400狀態碼而不是422？