如何使用编辑表单中的剔除数据绑定将动态 ASP.NET DropDownListFor() 与数据库中的存储值绑定

Question

我有一个可以从数据库动态获取数据、更新数据并将其存储在 database.However 中的工作表单，我在将下拉选择列表动态绑定到数据库中存储的当前值时遇到问题正在编辑。

我面临的问题是选择列表下拉字段，当它在编辑表单中加载时，它没有绑定到数据库中该字段的当前值，作为解决方法，我创建了一个具有数据库中当前值的禁用字段，以及选择列表的第二个下拉字段。 ajax post 上的编辑表单选取下拉字段中的值并将其存储到数据库中。现在您可以猜到问题是，当用户甚至没有触摸选择列表中的下拉字段时，默认值得到 posted 并存储在数据库中，因此在用户不注意的情况下对其进行了编辑。

<div class="row" id="editProspectMeasuredStructurFormDiv" data-bind="with:EditModel">


@using (Html.BeginForm("Edit", "ProspectMeasuredStructure", FormMethod.Post, new { @class = "form-group", @id = "editForm" })){
      @Html.TextBoxFor(m => m.MeasuredStructureId, new { @class = "form-control", data_bind = "value: MeasuredStructureText", disabled = "disabled" })
<label>The MeasuredStructureis listed as:</label>

     @Html.DropDownListFor(m => m.MeasuredStructureId, new SelectList(Model.MeasuredStructures, "MeasuredStructureId", "Name"), new { @class = "form-control", @id = "editMeasuredStructureId", placeholder = Html.DisplayNameFor(m => m.MeasuredStructureId) })
     @Html.LabelFor(m => m.MeasuredStructureId)
     <input type="submit" class="btn btn-action" value="Submit" id="submitEditMeasuredStructure" data-bind="click: function(){$root.EditMeasuredStructure();}" />
}
</div>

 var prospectMeasuredStructureModel = function (parent, prospectMeasuredStructureId, prospectId, prospectText, measuredStructureId, measuredStructureText{
 var self = this;
        self.ProspectMeasuredStructureId = ko.observable(prospectMeasuredStructureId);
        self.ProspectId = ko.observable(prospectId);
        self.ProspectText = ko.observable(prospectText);
        self.MeasuredStructureId = ko.observable(measuredStructureId);
        self.MeasuredStructureText = ko.observable(measuredStructureText);
        self.EditModel = ko.observable();
}



var prospectMeasuredStructureViewModel = function () {
        var self = this;
        self.ProspectMeasuredStructureId = ko.observable();
        self.ProspectId = ko.observable();
        self.ProspectText = ko.observable();
        self.MeasuredStructureId = ko.observable();
        self.MeasuredStructureText = ko.observable();
        self.EditModel = ko.observable();

        self.EditMeasuredStructure = function () {
            self.ProspectMeasuredStructureId = $('#editProspectMeasuredStructureId').val();
            self.ProspectId = $('#hfProspectId').val();
            self.MeasuredStructureId = $('#editMeasuredStructureId').val();
            self.Address = $('#editAddress').val();

            $.ajax({
                url: '@Url.Action("Edit", "ProspectMeasuredStructure")',
                type: 'POST',
                data: JSON.stringify(self),
                contentType: 'application/json; charset=utf-8',
                dataType: 'JSON',
                success: function (response) {
                    if (response.success) {
                        self.GetMeasuredStructures();
                        $('#editForm').hide();
                        alert("Edit Worked");
                    } else {
                        alert("Edit did not work");
                    }
                }
            });
        }

  [HttpPost]
        public ContentResult GetMeasuredStructures([FromBody] ProspectMeasuredStructureViewModel measuredStructureVM)
        {
            //Guid ProspectId = Guid.Parse(measuredStructure.ProspectId);
            var prospectMS = repository.Get(c => !c.Delete && c.ProspectId== measuredStructureVM.ProspectId);
            foreach (var item in prospectMS)
            {
                ProspectMeasuredStructureViewModel pVM = new ProspectMeasuredStructureViewModel();
                pVM.ProspectMeasuredStructureId = item.ProspectMeasuredStructureId;
                pVM.ProspectId = item.ProspectId;
                pVM.ProspectText = listManager.GetProspect(item.ProspectId).Name;
                pVM.MeasuredStructureId = item.MeasuredStructureId;
                pVM.MeasuredStructureText = listManager.GetMeasuredStructure(item.MeasuredStructureId).Name;
                prospectMeasuredStructureVModels.Add(pVM);
            }
            return new ContentResult()
            {
                Content = JsonConvert.SerializeObject(prospectMeasuredStructureVModels),
                ContentType = "application/json"
            };
        }

我不确定如何将 @Html.DropDownListFor() 与用户首次添加测量结构时添加的保存值绑定。正如我之前所说，它正确显示了选择列表，它没有做的是 "show the currently saved value as the first value"。因此它会导致将默认值保存到数据库中。

如果有更多代码，如果需要 posted，请告诉我，因为我尝试使用尽可能多的片段来解释我的问题。

Answer 1

我所要做的就是将下拉列表与 ID 绑定，并将其转换为下拉列表的默认值以及我视图中声明 DropDownList 的其他选项列表值。

  @Html.DropDownListFor(m => m.MeasuredStructureId, new SelectList(Model.MeasuredStructures, "MeasuredStructureId", "Name"), new { @class = "form-control", @id = "editMeasuredStructureId", placeholder = Html.DisplayNameFor(m => m.MeasuredStructureId),data_bind = " value: MeasuredStructureId" })
  @Html.LabelFor(m => m.MeasuredStructureId)

如何使用编辑表单中的剔除数据绑定将动态 ASP.NET DropDownListFor() 与数据库中的存储值绑定

How do you bind your dynamic ASP.NET DropDownListFor() with the stored value in the database using knockout data binding in the Edit form

javascript

c#

jquery

asp.net-core

knockout-mvc