将数据传递给 jQuery 模态然后打开它

Question

我有一个项目列表，每个项目都包含添加新评论的选项。所以我有这个按钮，我可以在其中显示模式以输入特定项目的新评论。每个项目的唯一标识符是它的 commissionNumber:

    @foreach (var item in listofentities) 
    {
    
        <div class="pull-right">
            <a href="javascript:void(0);" id="commentDialogOpener_@item.CommissionNumber" onclick="OpenCommentModal(e)" data-id="@item.CommissionNumber"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></a>
        </div>
    }

    
    <div id="newCommentDialog" title="New Comment">
        <form id="commentForm" asp-action="AddComment">
           <input type="hidden" id="commissionNumber" name="commissionNumber"/>
           <textarea id="comment" name="comment" rows="4" style="width: 100%; height: 95%;"></textarea>
           <label id="EmptyTextAreaWarningLabel" hidden style="color: red;">Please enter a comment</label>
        </form>
    </div>

要打开 DIV 以输入新评论，我使用 onclick 方法和为每个项目提供的 link。我尝试将 link 的 data-id 字段移交给新评论模式中的隐藏变量。这是 JS 部分：

$(document).ready(function () {           

        $(function () {
            $("#newCommentDialog").dialog({
                autoOpen: false,
                modal: true,
                buttons: {
                    "OK": function () {
                        if ($("#comment").val() == null || $("#comment").val().trim() == '') {
                            // textarea is empty
                            $("#EmptyTextAreaWarningLabel").show();
                        }
                        else {
                            document.getElementById("commentForm").submit();
                        }


                    },
                    Cancel: function () {
                        $(this).dialog("close");
                    }
                }
            });

        });
    });

    function OpenCommentModal(e)
    {
        alert(e.Value);
        $('#commissionNumber').val() = ??
        $("#newCommentDialog").dialog("open");
    }

这就是我被困的地方。我不知道如何将事件数据传递给 OpenCommentModal 函数。我需要读取点击来自的元素的 ID，以将 @item.commissonNumber 后面的值传递给模态中的隐藏变量。我不知何故迷失在这里，因为我不知道在哪里完成。 Intellisense 没有为我提供有关 JS 事件元素的任何帮助...

我收到的唯一错误消息是

Uncaught ReferenceError: e is not defined

指的是我用onclick-routine

传递的参数e

Answer 1

您可以将 id 传递到您的点击函数中：

<a href="javascript:void(0);" id="commentDialogOpener_@item.CommissionNumber" onclick="OpenCommentModal(this.id)" data-id="@item.CommissionNumber"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></a>

在您的点击功能中，您可以使用您的 ID 并将其存储在数据属性中，例如名称为“id”。

 function OpenCommentModal(id)
 {
     $("#newCommentDialog").data("id", id).dialog("open");
 }

在您的对话代码中，您现在可以这样读出来：

 $('#newCommentDialog').data("id");

将数据传递给 jQuery 模态然后打开它

Pass data to jQuery modal and open it then

javascript

jquery

jquery-events

.net-core

asp.net-core