【发布时间】:2022-08-11 23:59:38
【问题描述】:
如何使用 Ajax 错误处理创建级联下拉菜单
创建下拉国家和地区
1.当我点击国家它显示状态。
2.当我点击状态它显示区。
public class Country
{
public int CountryId { get; set; }
public string CountryName { get; set; }
}
public class District
{
public int DistrictId { get; set; }
public string DistrictName { get; set; }
}
public class State
{
public int StateId { get; set; }
public string StateName { get; set; }
}
控制器
namespace Dropdown.Controllers
{
public class CascadingController : Controller
{
private readonly DropdownContext _context;
public CascadingController(DropdownContext context)
{
_context = context;
}
public IActionResult Index()
{
return View();
}
public IActionResult DropDown()
{
ViewBag.Country = _context.Country.ToList();
ViewBag.District = _context.District.ToList();
ViewBag.State = _context.State.ToList();
return View();
}
}
}
这是我的结合课
public class Combine
{
public int CombineId { get; set; }
public int CountryId { get; set; }
public int StateId { get; set; }
public int DistrictId { get; set; }
public Country Country { get; set; }
public State State { get; set; }
public District District { get; set; }
}
看法
这是查看页面我只添加表单 html 以显示下拉列表我不添加 jQuery 或其他东西
@model Dropdown.Models.Combine
@{
ViewData[\"Title\"] = \"DropDown\";
}
<script type=\"text/javascript\" src=\"https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js\"></script>
<html>
<head>
</head>
<body>
<h1>DropDown</h1>
<hr />
<form>
<div class=\"row\">
<div class=\"col-md-4\">
<div class=\"form-group\" style=\"padding-top: 8px;padding-right:7px;\">
<label asp-for=\"Country\" class=\"control-label\"></label>
<br />
<select asp-for=\"CountryId\" class=\"form-control\" asp-items=\"@(new SelectList(ViewBag.Country,\"CountryId\",\"CountryName\"))\">
</select>
</div>
<br />
<div class=\"form-group\" style=\"padding-top: 8px;padding-right:7px;\">
<label asp-for=\"District\" class=\"control-label\"></label>
<br />
<select asp-for=\"DistrictId\" class=\"form-control\" asp-items=\"@(new MultiSelectList(ViewBag.District,\"DistrictId\",\"DistrictName\"))\">
</select>
</div>
<br />
<div class=\"form-group\" style=\"padding-top: 8px;padding-right:7px;\">
<label asp-for=\"State\" class=\"control-label\"></label>
<br />
<select asp-for=\"StateId\" class=\"form-control\" asp-items=\"@(new SelectList(ViewBag.State,\"StateId\",\"StateName\"))\">
</select>
</div>
<br />
<input type=\"submit\" value=\"Create\" class=\"btn btn-primary form-group\" />
</div>
</div>
</form>
</body>
</html>
<br>
<div>
<a asp-action=\"Index\">Back to List</a>
</div>
@section Scripts {
<script><script type=\"text/javascript\">
</script>
@{await Html.RenderPartialAsync(\"_ValidationScriptsPartial\");}
}
-
你能分享你的控制器并查看代码吗?
-
感谢您的更新,现在可以方便地处理此问题。
-
你的问题不是很清楚。第 1 点和第 2 点是您面临的问题还是您希望达到的结果?
-
你能分享一张目前正在展示的图片吗?
-
我已经添加了有问题的图片链接
标签: c# asp.net-mvc asp.net-core asp.net-core-mvc