在ASP.NET Core中进行级联选择

时间:2019-07-02 10:31:45

标签: c# jquery entity-framework asp.net-core ef-code-first

我想在国家和城市之间实现级联选择,这两个国家和城市都继承自抽象类GeographicBoundary,从而实现EF核心功能的每层表格(TPH)。为此,我使用的是ASP.NET Core 2.x,以EF Core Code为先。但是我无法实现。

我尝试使用从Controller Action返回到JQuery / Ajax的Json,但没有成功。

//超级类

public abstract class GeographicBoundary  {
    public int GeographicBoundaryId { get; set; }

    public string Name { get; set; }
}

//国家(地区)

public class Country : GeographicBoundary
    {

    }

// CITY

public class City : GeographicBoundary
{

    public Country Country { get; set; }
}

//视图中的代码

            @*COUNTRY*@
            <div class="row" style="margin-bottom: 0px;">
                <div class="input-field col s12 m6 offset-m3">
                    <select asp-for="CountryId" asp-items=@ViewBag.Countries>
                    </select>
                    <label>B1 - País</label>
                    <span asp-validation-for="CountryId" class="text-danger"></span>
                </div>
            </div>

            @*CITIES*@
            <div class="row" style="margin-bottom: 0px;">
                <div class="input-field col s12 m6 offset-m3">
                    <select asp-for="ProvinceId" asp-items="@(new SelectList("", "GeographicBoundaryId", "Name"))"></select>
                    <label>B2 - Cidades</label>
                    <span asp-validation-for="CityId" class="text-danger"></span>
                </div>
            </div>

// ViewModel文件

public int CityId

public int CountryId

//我的控制器

public JsonResult GetProvinces(int countryId)
{
    var provinces = _geographicBoundaryManager.GetProvincesByCountryId(countryId).ToList();

    provinces.Insert(0, new Province { GeographicBoundaryId = 0, Name = "SELEECIONAR" });

    return Json(provinces);
}

// JS代码

@section ScriptPage
    {
<script src="/lib/jquery/dist/jquery.js"></script>
<script>$("#GeographicBoundaryId").change(function () {
        $.get("/Home/GetProvinces", { GeographicBoundaryId: $("#GeographicBoundaryId").val() }, function (data) {
            $("GeographicBoundaryId").empty();
            $.each(data, function (i, row) {
    < !--$("#GeographicBoundaryId").append("<option value='" + data[i].districtId + "'>" + data[i].name + "</option>")-->
                    $("#GeographicBoundaryId").append("<option value='" + row.geographicboundaryId + "'>" + row.name + "</option>")
            });
        });
    })</script>

}

仅“国家”保管箱有效。 城市保管箱消失了!

0 个答案:

没有答案