根据其他字段填充字段 ASP.NET Razor Pages
Populate fields based on other fields ASP.NET Razor Pages
我知道这个问题可能已经在这个网站上了,但是我的方法有一些不同,因为我使用了@Html.EditFor 和@Html.DropDownList。
所以我有一个下拉列表,当我在那里选择 ID 时,我想从数据库中检索一些信息,然后填充当前表单中的一些字段。我知道我应该使用 JS 但我不知道如何。
查看:
@model TestApp.Dtos.InsertDto
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="col-md-9">
@Html.DropDownListFor(model => model.Category, new SelectList(Model.ListOfCategory, "Text", "Text"), "-- Please select --", htmlAttributes: new { @class = "form-control"});
</div>
<div class="col-md-9">
@Html.EditFor(model => model.Car, new{htmlAttributes = new { @class = "form-control" }});
</div>
@*And then the form continues with other fields and after that the submit button *@
}
您可以使用 ajax 从后端获取数据,并将结果数据放入您的某个地方 want.Here 是一个简单的演示,用于从后端获取 selectListItem 并将其放入 div.If 你想做一些更复杂的事情,你需要共享 InsertDto
的结构,并解释清楚你将从 db 获得什么样的数据,并解释 populate some fields in the current form
是什么意思?
查看:
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="col-md-9">
@Html.DropDownListFor(model => model.Category, new SelectList(Model.ListOfCategory, "Text", "Text"), "-- Please select --", htmlAttributes: new { @class = "form-control" ,@onchange = "getData()" })
</div>
<div id="dbdata">
</div>
}
js:
<script>
function getData() {
$.ajax({
type: "POST",
data: { Category: $("#Category").val() },
url: '/B/GetData',
}).done(function (result) {
$("#dbdata").html("the selected value is " + result.text);
});
}
</script>
型号:
public class InsertDto
{
public string Category { get; set; }
public List<SelectListItem> ListOfCategory { get; set; }
}
控制器:
public IActionResult Index(string id)
{
InsertDto i = new InsertDto { ListOfCategory = new List<SelectListItem> { new SelectListItem { Text = "t1" }, new SelectListItem { Text = "t2" }, new SelectListItem { Text = "t3" } } };
return View(i);
}
public SelectListItem GetData(string Category)
{
return new SelectListItem { Text = Category, Value = Category + "value" };
}
结果:
我知道这个问题可能已经在这个网站上了,但是我的方法有一些不同,因为我使用了@Html.EditFor 和@Html.DropDownList。 所以我有一个下拉列表,当我在那里选择 ID 时,我想从数据库中检索一些信息,然后填充当前表单中的一些字段。我知道我应该使用 JS 但我不知道如何。
查看:
@model TestApp.Dtos.InsertDto
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="col-md-9">
@Html.DropDownListFor(model => model.Category, new SelectList(Model.ListOfCategory, "Text", "Text"), "-- Please select --", htmlAttributes: new { @class = "form-control"});
</div>
<div class="col-md-9">
@Html.EditFor(model => model.Car, new{htmlAttributes = new { @class = "form-control" }});
</div>
@*And then the form continues with other fields and after that the submit button *@
}
您可以使用 ajax 从后端获取数据,并将结果数据放入您的某个地方 want.Here 是一个简单的演示,用于从后端获取 selectListItem 并将其放入 div.If 你想做一些更复杂的事情,你需要共享 InsertDto
的结构,并解释清楚你将从 db 获得什么样的数据,并解释 populate some fields in the current form
是什么意思?
查看:
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="col-md-9">
@Html.DropDownListFor(model => model.Category, new SelectList(Model.ListOfCategory, "Text", "Text"), "-- Please select --", htmlAttributes: new { @class = "form-control" ,@onchange = "getData()" })
</div>
<div id="dbdata">
</div>
}
js:
<script>
function getData() {
$.ajax({
type: "POST",
data: { Category: $("#Category").val() },
url: '/B/GetData',
}).done(function (result) {
$("#dbdata").html("the selected value is " + result.text);
});
}
</script>
型号:
public class InsertDto
{
public string Category { get; set; }
public List<SelectListItem> ListOfCategory { get; set; }
}
控制器:
public IActionResult Index(string id)
{
InsertDto i = new InsertDto { ListOfCategory = new List<SelectListItem> { new SelectListItem { Text = "t1" }, new SelectListItem { Text = "t2" }, new SelectListItem { Text = "t3" } } };
return View(i);
}
public SelectListItem GetData(string Category)
{
return new SelectListItem { Text = Category, Value = Category + "value" };
}
结果: