Question

我目前正在尝试迭代在屏幕上投放多个产品，我可以根据需要添加更多产品。我有一个Jquery函数调用我的数据库来使用JSON检索该信息。

function FillProductbyupc(elem) {
        var $elem = $(elem),
            upcCode = $elem.data('upc');

        $.ajax({
            url: '/Case/GetData/',
            type: "GET",
            dataType: "JSON",
            data: "upc=" + upcCode,
            success: function (cics) {
                $elem.find(".corpitemcode").empty().append(
                    $elem.find('.corpitemcode').val(cics.CorpItemCode));
                $elem.find(".itemdesc").append(
                    $elem.find('.itemdesc').val(cics.ItemDsc));

            },
            error: function () {
                alert("UPC does not exist");
            }
        });
    }
    $(function () {

        $('.products').on('blur', '[data-upc]', function (e) {
            FillProductbyupc(this);
        });
    });

这是名为

的页面中的代码

  <div class="col-md-12">

              @Html.EditorFor(x => x.Products)

        <p>

            @Html.AddLink("Add More Products", ".products", ".product", "Products", typeof(MSC.Models.Product))
        </p>
    </div>

最后这是我的产品类。

<div class="products">

    <div class="product">

        <p>
            <label>Product</label>
            @Html.TextBoxFor(x => x.UPC, null, new { @class = "form-control", placeholder = Html.DisplayNameFor(x => x.UPC), data_upc = "5440001504" })
            @Html.TextBoxFor(x => x.PLU, null, new { @class = "form-control", placeholder = Html.DisplayNameFor(x => x.PLU) })
            @Html.TextBoxFor(x => x.CorpItemCode, null, new { @class = "form-control corpitemcode", placeholder = Html.DisplayNameFor(x => x.CorpItemCode) })
            @Html.TextBoxFor(x => x.ItemDsc, null, new { @class = "form-control itemdesc", placeholder = Html.DisplayNameFor(x => x.ItemDsc) })
            @Html.TextBoxFor(x => x.LaneNumber, null, new { @class = "form-control", placeholder = Html.DisplayNameFor(x => x.LaneNumber) })

            @Html.HiddenFor(x => x.DeleteProduct, new { @class = "mark-for-delete" })
            @Html.RemoveLink("Remove", "div.product", "input.mark-for-delete")

        </p>
    </div>
</div>

我在成功函数中的行：

 $(".corpitemcode").append(
    $elem.find('.corpitemcode').val(cics.CorpItemCode));
 $(".itemdesc").append(
    $elem.find('.itemdesc').val(cics.ItemDsc));

我也试过

 $elem.find('.corpitemcode').val(cics.CorpItemCode);
  $elem.find('.itemdesc').val(cics.ItemDsc);

我遇到的问题是，对我的控制器的调用，然后是我的业务层，它始终传递来自第一个产品的upc或corpitemcode。我假设因为#upc id总是第一个。但是，由于这个循环投掷，是否有一个我可以使用的元素而不是ID来让它以正确的产品为目标？

非常感谢任何帮助。

谢谢，亚当

Answer 1

听起来你需要使用可以有多个实例的东西，而这不是元素的ID。通常，对于这类事情，您可以使用类或数据属性。你可以一石二鸟。在视图中使用corpitemattribute值分配data-corpitemcode属性，您可以使用$（'[data-corpitemcode]'）使用jquery选择它，然后在通过AJAX将其传递给您的操作时使用该数据属性的值。

试图弄清楚如何使用正确的元素

1 个答案: