Question

我的模态boostrap有问题似乎没有将参数传递给模态。这是我的代码：

我的观点：

@foreach (var item in Model)
{
    <tr>
        <td>@Html.DisplayFor(modelItem => item.EmployeeId)</td>
        <td>@Html.DisplayFor(modelItem => item.Fname)  @Html.DisplayFor(modelItem => item.Lname)</td>
        <td>@Html.DisplayFor(modelItem => item.PhoneNumber)</td>
        <td>@Html.DisplayFor(modelItem => item.Position)</td>
        <td>
            <a asp-action="Edit" asp-route-id="@item.EmployeeId">Edit</a> |
            <button type="button" class="btn btn-danger btn-xs" data-toggle="modal" data-target="#myModal" data-emp-id="@item.EmployeeId"><span class="glyphicon glyphicon-trash" style="vertical-align:middle;margin-top: -5px"></span> Delete</button>
        </td>
    </tr>

}

我的模态：

<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <h4 class="modal-title">Confirm Delete</h4>
        </div>
        <div class="modal-body">
            <p>Are you sure you want to delete invoice number:</p>
            <input type="text" name="empID" value=""/>
        </div>
        <div class="modal-footer">
            <form asp-controller="Employee" asp-action="Delete" method="post" class="form-inline" role="form">
                <input type="hidden" id="Id">
                <button type="submit" class="btn btn-danger"><span class="glyphicon glyphicon-trash" style="vertical-align:middle;margin-top: -5px"></span> Delete</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </form>
        </div>
    </div>
</div>

我的JavaScript：我认为问题出现在这段代码中，但我不知道为什么。

<script src="./javascript.js" type="text/javascript">
$("button[type='button']").click(function () {
    $("#myModal").find("input[type='text']").val($(this).attr("EmpID")); 
});

我的工作出了什么问题？有谁知道为什么没有将参数传递给模型？

我只是一个初学者，我不知道我的代码中有什么。

任何帮助都将不胜感激。

Answer 1

您的按钮没有名为EmpId的属性。但是它确实有一个名为data-emp-id的属性，我假设它包含你想要的值。

jQuery有一个data method可以轻松访问数据属性;简而言之，您可以使用$(this).data("emp-id")

来获取它

JavaScript将参数传递给模态ASP.NET Core

1 个答案: