根据其他字段填充字段 ASP.NET Razor Pages答案

【问题标题】：Populate fields based on other fields ASP.NET Razor Pages根据其他字段填充字段 ASP.NET Razor Pages
【发布时间】：2021-08-09 17:28:51
【问题描述】：

我知道这个问题可能已经在这个网站上，但是我的方法中有一些不同的东西，因为我使用了@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 *@
    }

【问题讨论】：

标签： javascript asp.net asp.net-core razor

【解决方案1】：

您可以使用ajax从后端获取数据，并将结果数据放在您想要的地方。这是一个简单的演示，从后端获取一个selectListItem并将其放入一个div。如果您想做更复杂的事情，你需要分享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" };
        }

结果：

【讨论】：