Question

我有一个维护事件，其中可能有0或n个产品。在“创建维护”事件中，我有一个按钮，该按钮使用EditorForMany扩展名添加产品。对于每种产品，都有一个选择列表来选择产品。我想为所选产品提供一个名为Units的只读字段。数据库中每种产品的单位均定义为“ mt”或“ mm”，“ number”。

每次选择产品时，它应该更新数据库BUT中读取的单位，而是尝试更新第一个产品的单位。

我在选择器上做错了（我想）。但是我真的不能把手放在上面。

在我看来

@model Models.Maintanance.AddMaintananceVM
<form asp-action="BakimIsle" autocomplete="off">
<label asp-for="Date" class="control-label"></label>
            <div class="input-group">
                <input asp-for="Date" type="text" class="form-control" >
                <div class="input-group-append">
                    <span class="input-group-text"><i class="ion-calendar"></i></span>
                </div>
            </div>
 <div id="parts-list">
    @Html.EditorForMany(x => x.Parts, x => x.Index, false)
</div>
<input type="button" id="add-part" class="btn btn-outline-primary waves-effect waves-light btn-sm" value="Add" />
<button type="submit" class="btn btn-primary">Kaydet</button>

<script>
    $(document).ready(function () {

        $('#add-part').on('click', function () {
            jQuery.get('@Url.Action("AddPart")').done(function (html) {
                $('#parts-list').append(html);

            });
        });

        $("#parts-list").on('change',"#Product", function () {
            LoadProductsData($("#Product option:selected").val());
        });

        $(document).on('click', '.delete', function () {
            $(this).closest('.partRow').remove();
        });

    });
</script>

我相信我的问题在这里 ...称为LoadProductsData的函数正在运行，并且正在从控制器获取正确的数据，但它仅尝试更新第一个输入的产品的单位。

<script>
    function LoadProductsData(id) {
        $('#Unit').val('');
        $.ajax({
            type: "GET",
            url: "@Url.Action("LoadProductById")",
            datatype: "Json",
            data: { productId: id },
            success: function (data) {
                $.each(data, function (index, value) {
                    $("#Unit").val(value.units);

                });

            }
        });
    }
</script>

查看ForEditorForMany

@model Models.Maintanance.PartVM

<div class="partRow">
<div class="card-box">
    <div class="row">
        <div class="col-md-2">
            <label asp-for="PartId" class="control-label"></label>
            <select asp-for="PartId" asp-items="Model.AllParts" id="Product" 
class="form-control">
                <option value="">Parça seç</option>
            </select>
        </div>
        <div class="col-md-2">
            <label asp-for="AmountOfPart" class="control-label"></label>
            <input asp-for="AmountOfPart" class="form-control" />
        </div>
        <div class="col-md-2">
            <label asp-for="Units" class="control-label"></label>
            <input asp-for="Units" class="form-control" id="Unit" readonly 
/>
        </div>
        <div class="col-md-2">
            <input type="button" class="btn btn-outline-primary waves-effect 
waves-light btn-sm delete" value="Sil" style="align-items:baseline" />
        </div>
    </div>
</div>
</div>

我的ViewModels

public class AddMaintananceVM
{
    public AddMaintananceVM()
    {
        Parts = new List<PartDetailsVM>();
    }

    [DataType(DataType.Date)]
    public DateTime Date { get; set; }
    public List<PartDetailsVM> Parts { get; set; }
}
 public class PartDetailsVM
{
    public int PartId { get; set; }
    public int AmountOfPart { get; set; }
    public string Units { get;  }
    public string Index { get; set; }
    public IEnumerable<SelectListItem> AllParts { get; set; }
}

我的控制器

    public IActionResult BakimIsle()
    {
        var model = new AddMaintananceVM();
        model.Date = DateTime.Now;
        model.MonthOfMaintanance = DateTime.Now.Month;
        var elevators = _maintananceService.GetAllOnMaintanance();
        var employees = _employeeService.GetAllForMaintanance();
        var products = _productService.GetAllForMaintanance();

        model.Elevators = new SelectList(elevators, "Id", "PublicName");
        model.Employees = new SelectList(employees, "Id", "FullName");

        model.Parts = new List<PartDetailsVM>()
        { new PartDetailsVM() { AllParts= new SelectList(products , "Id", "Name")} };

        return View(model);
    }

    [Route("bakim/bakimisle")]
    [HttpPost]
    public IActionResult BakimIsle(AddMaintananceVM model)
    {
        var maintanance = new Maintanance()
        {
            Date = model.Date,
        };
        _maintananceService.AddMaintanance(maintanance);

        _maintananceService.Complete();
        return RedirectToAction("Index");
    }


    public IActionResult AddPart()
    {
        var products = _productService.GetAllForMaintanance();

        var model = new AddMaintananceVM();
        model.Parts = new List<PartDetailsVM>()
        { new PartDetailsVM() { AllParts= new SelectList(products, "Id", "Name")} };

        return View(model);
    }
    public JsonResult LoadProductById(int productId)
    {
        var product= _productService.GetAllForMaintanance().Where(x=> x.Id == productId);

        return Json(product);
    }

如果您能帮助我修复代码，那就太好了。

编辑

在评论部分感谢Taplar。尝试修复代码。

这些是我更改的代码。基本上是将ID归类。

 $("#parts-list").on('change',".partRow .product", function () {
            LoadProductsData($(".product option:selected").val());
        });

和

function LoadProductsData(id) {
        $(this).closest('.partRow').find('.unit').val('');
        $.ajax({
            type: "GET",
            url: "@Url.Action("LoadProductById")",
            datatype: "Json",
            data: { productId: id },
            success: function (data) {
                $.each(data, function (index, value) {
                    $(this).closest('.partRow').find('.unit').val(value.units);
                });
            }
        });
    }

这些是我所做的更改。仍然有一些错误，我真的不知道是什么。 $（this）.closest（'。partRow'）。find（'。unit'）。val（value.units）找不到任何东西。

更改事件上的jQuery未更新预期输入

0 个答案: