Cascading Dropdown .NET CORE - ajax

Question

I have a problem when Edit form with cascade dropdown but, on Create form don't have issue, data can get from database,
I'm new on .NET Core, please explain the problem.
Here My view Create Form
Create form
When I want to edit the data cant not retrieve from Database.
Here My View On Edit Form
Edit Form
Here my Ajax
public IActionResult AjaxMethod([FromBody] AutoDetails auto)
{
List<SelectListItem> items = new List<SelectListItem>();
switch (auto.type)
{
default:
foreach (var status in this._context.EmployeeStatus)
{
items.Add(new SelectListItem { Text = status.Name, Value = status.Id.ToString() });
}
break;
case "Status":
var employee = (from employees in this._context.Employees
where employees.employeeStatus.Id == auto.value
select employees).ToList();
foreach (var data in employee)
{
items.Add(new SelectListItem { Text = data.Name, Value = data.Name.ToString() });
}
break;
}
return Json(items);
}
Controller :
public async Task<IActionResult> Edit(int? id)
{
ViewData["team"] = _context.Teams.OrderBy(e => e.Name).ToList();
var result = await _context.ActionItems.FindAsync(id);
return View(result);
}
Here Js on Edit view:
<script type="text/javascript">
$(function () {
AjaxCall({ "type": '' }, 'Status');
$('#ddlstatus').on('change', function () {
var myData = {
"type": 'Status',
"value": $(this).find('option:selected').val()
};
AjaxCall(myData, 'Employee');
});
});
function AjaxCall(myData, element) {
$.ajax({
url: "/ActionItems/AjaxMethod/",
data: JSON.stringify(myData),
dataType: "json",
type: "POST",
contentType: "application/json; charset=utf-8",
success: function (data) {
switch (element) {
case "Status":
$('#ddlstatus').append($("<option></option>").val("0").html("--Select Status--"));
$.each(data, function () {
$('#ddlstatus').append($("<option></option>").val(this.value).html(this.text));
});
$('#ddlEmp').attr("disabled", "disabled");
break;
case "Employee":
if (data.length > 0) {
$('#ddlEmp').empty();
$('#ddlEmp').append($("<option></option>").val("0").html("--Select Name--"));
$.each(data, function () {
$('#ddlEmp').append($("<option></option>").val(this.value).html(this.text));
});
$('#ddlEmp').prop("disabled", false);;
break;
} else {
$('#ddlEmp').empty();
$('#ddlEmp').append($("<option></option>").val("0").html("--Select Name--"));
$('#ddlEmp').attr("disabled", "disabled");
}
}
},
});
}</script>
Here My Edit View Code :
<div class="row my-3">
<div class="form-group col-5">
<label>PIC Status</label>
<select class="form-control" id="ddlstatus" asp-for="EmployeeStatus">
</select>
</div>
<div class="form-group col-5">
<label>PIC Name</label>
<select class="form-control" id="ddlEmp" asp-for="Employee">
</select>
</div>
</div>
My model :
public int ActionId { get; set; }
public string ActionName { get; set; }
public string ActionTask { get; set; }
public string? ActionTaskUpdate { get; set; }
public string? Employee { get; set; }
public string? EmployeeStatus { get; set; }
public string? Team { get; set; }
public string ActionStatus { get; set; }
public string ActionCategory { get; set; }
public string CreateBy { get; set; }
public DateTime StartDate { get; set; }
public DateTime EndDate { get; set; }
public string? CreateDate { get; set; }
public string? UpdateDate { get; set; }
When I want to Edit Form, the value cant retrieve data.
Thanks a lot.