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

Populating a hidden input with a value from data

本文关键字:填充 隐藏 输入 数据      更新时间:2024-02-29

我在这里有一段代码。我对Javascript还很陌生,我一辈子都搞不清楚这一点。因此,代码的底部会拉入数据并将其放入表中。我想做的是,当我单击最后一列中的按钮时,它会获取项目。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);

您正在循环处理结果。项目,在每次迭代中,您都要创建一个点击侦听器

$("#review")。在("click",函数(){})上

这个监听器被附加到#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>

您可以看到单击事件如何创建4个警报框,最后一个警报框是数组中的最后一个数字。

我认为您想要的是为您的不同列提供一些元素#review_1#review_2等。我认为你需要重新思考你的设计。

在没有真正理解您的代码的情况下,我将尝试根据我所知重写它:

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'));
  });
});