jquery - 引导模型弹出窗口内的 DropDownList 在 asp.net core mvc 的编辑模式下不起作用

Question

我正在使用 asp.net core mvc 中的引导模型弹出窗口执行列表、创建、更新操作。我可以使用局部视图执行所有操作。

CreateOrUpdate 部分视图：

@model HRMS.Model.Employees.EmployeeAddressModel

@{
    ViewData["Title"] = "Create";
    Layout = null;
}


<form id="createUpdateAddressForm" class="form-horizontal" method="post" asp-controller="EmployeeHelper" asp-action="CreateOrUpdateEmployeeAddress" asp-route-id="@Model.Id" onsubmit="return jQueryAjaxPost(this);">
    @*<div asp-validation-summary="ModelOnly" class="text-danger"></div>*@
    <input type="hidden" asp-for="EmployeeId" class="form-control" />
    <input type="hidden" asp-for="Id" class="form-control" />
    <div class="modal-body">
        <div class="position-relative form-group">
            <label asp-for="Address" class="control-label"></label>
            <input asp-for="Address" class="form-control" />
            <span asp-validation-for="Address" class="text-danger"></span>
        </div>
        <div class="row">
            <div class="col-md-6">
                <div class="position-relative form-group">
                    <label asp-for="CountryId" class="control-label"></label>
                    <select asp-for="CountryId" name="CountryId" id="CountryId" class="form-control"
                            asp-items="@ViewBag.CountyList">
                        <option value="">Select Country</option>
                    </select>
                    <span asp-validation-for="CountryId" class="text-danger"></span>
                </div>
            </div>
            <div class="col-md-6">
                <div class="position-relative form-group">
                    <label asp-for="StateId" class="control-label"></label>
                    <select asp-for="StateId" name="StateId" id="StateId" class="form-control"
                            asp-items="@(new SelectList(ViewBag.StateList,"Id", "Name"))">
                        <option value="">Select State</option>
                    </select>
                    <span asp-validation-for="StateId" class="text-danger"></span>
                </div>
            </div>

        </div>
    </div>
    <div class="modal-footer">
        <a asp-controller="Employee" asp-action="Index" class="mr-2 btn btn-link btn-sm">Cancel</a>
        <button type="submit" class="btn-wide btn-shadow btn btn-primary">Submit</button>
    </div>
</form>

<script>
    $("#CountryId").change(function () {
        var id = $(this).val();
        $.get('@Url.Action("GetStateList", "Common")', { "countryId": id }, function (data) {
            $("#StateId").empty();
            $("#StateId").append("<option value='0'>Select State</option>")
            $.each(data, function (index, state) {
                $("#StateId").append("<option value=" + state.id + ">" + state.name + "</option>");
            })
        })
    })
</script>

主视图：

<a data-toggle="modal" onclick="showInPopup('@Url.Action("CreateOrUpdateEmployeeAddress","EmployeeHelper",null, Context.Request.Scheme)','New Address')" class="btn btn-success text-white"><i class="fas fa-random"></i> New Address</a>
@*placeholder for address model popup*@
<div class="modal" tabindex="-1" role="dialog" id="form-modal">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title"></h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">

            </div>
        </div>
    </div>
</div>

下面的问题是：

1. 当我第一次打开创建表单并尝试选择县下拉列表时它工作正常但是当我尝试再次选择县下拉列表时在这种情况下发生服务器端验证或异常时它没有触发（不工作)
2. 当我打开编辑表单并尝试选择县下拉列表时，它没有触发（不起作用）。

我也试过把县选javascript代码放上，但没用。

请帮助我，如果需要更多信息，我可以为您提供。

标签： jquerytwitter-bootstrapasp.net-core