Question

我的代码片段在这里。我是Javascript的新手，而我对我的生活无法解决这个问题。所以会发生什么是代码的底部部分拉入数据并将其放入表中。我想要做的是当我点击最后一列中的按钮时它接受item.ReviewId并自动填充模态中的隐藏输入以匹配该人正在查看的项目。任何帮助，将不胜感激。单击它时，它会自动填充列表中的最后一个数字。例如，如果有3个项目，20,21,22和我点击第一个，它填充22。

var success = function (result) {          

        $.each(result.Items, function (index, item) {            

            $('#reviewresults').dataTable().fnAddData([razorHelpers.formatDate(item.DateVisited), item.clientProfile.CompanyName, razorHelpers.formatCurrency(item.AmountSpent), item.ReviewId, '<button class="btn btn-blue" data-toggle="modal" data-target="#myModal" title="View" id="review">Review This Transaction <i class="fa fa-thumbs-up"></i></button>']);

            console.log(item.ReviewId)

            $("#review").on("click", function () {
                test(item.ReviewId)
            });

            function test(number) {
                $("#reviewinput").val(number);
            }

        });

    };     

    ClientOpenReviewService.ListReviewsByConsumer(razorStorage.ExtractSessionData('userId'), 0, 0).done(success);

Answer 1

如果没有真正了解您的代码，我会尝试根据我的知识重写它：

function test(number) {
  $("#reviewinput").val(number);
}

var success = function (result) {
  $.each(result.Items, function(index, item) {
    $('#reviewresults').dataTable().fnAddData(
      [razorHelpers.formatDate(item.DateVisited),
      item.clientProfile.CompanyName,
      razorHelpers.formatCurrency(item.AmountSpent),
      item.ReviewId,
      '<button data-review="'+item.ReviewId+'" class="btn btn-blue review" data-toggle="modal" data-target="#myModal" title="View" id="review-'+item.ReviewId+'">Review This Transaction <i class="fa fa-thumbs-up"></i></button>'
      ]
    );

    console.log(item.ReviewId)
  });
};

$(document).ready(function() {
  ClientOpenReviewService.ListReviewsByConsumer(razorStorage.ExtractSessionData('userId'), 0, 0).done(success);

  $(".review").on("click", function() {
    test($(this).data('review'));
  });
});

Answer 2

您正在遍历result.Items并在每次迭代中创建一个单击侦听器

$（“＃review”）。on（“click”，function（）{}）

此侦听器被附加到 #review （可能是按钮或div）。所以你最终会得到一个#review元素，它附加了许多监听器。

可能只显示 LAST 元素，因为所有侦听器在单击#review元素后按顺序执行。

为了说明我写了这个。

<html lang="en">
<head>
    <meta charset="UTF-8">
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
</head>
<body>

<div id="review">
OK

</div>

<script>

    result = {};
    result.Items = [
        {
            ReviewId:1
        },
        {
            ReviewId:2
        },
        {
            ReviewId:3
        },
        {
            ReviewId:4
        }];


    $.each(result.Items, function (index, item) {

        $("div").on("click", function () {

            test(item.ReviewId)
        });

        function test(number) {

            alert(number)

            $("#reviewinput").val(number);
        }
    });

</script>

</body>
</html>

您可以看到click事件如何创建4个警告框，最后一个警告框是数组中的最后一个数字。

我认为您想要的是针对不同列的许多元素＃review_1＃review_2等。你需要重新考虑你的设计。

使用数据中的值填充隐藏的输入

2 个答案: