Question

这是在调整到JQuery之后的工作：

$(.modalLink").click(function () {
     var passedID = $(this).data('id');
     $('#id').val(passedID);
     $(".modal-body .hiddenid").val(passedID);
});

//查看链接

<a href="/Home/Employee/id=@item.Id" data-id="@item.Id" data-toggle="modal" data-target="#myModal">Load me</a>

如何捕捉<a href点击后我传递的ID？

所以我有一个模态弹出窗口，当用户点击时我希望在用户发布数据时获取它的id。

查看：

@using (Html.BeginForm("Employee", "Home", FormMethod.Post))
{

    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel">Record</h4>
                </div>
                <div class="modal-body">
                    <div class="form-group">
                        <label for="FirstName" class="control-label">First Name:</label>
                        @Html.Editor("FirstName", new { htmlAttributes = new { @class = "form-control" } }) 
                    </div>
                    <div class="form-group">
                        <label for="LastName" class="control-label">Last Name:</label>
                        @Html.Editor("LastName", new { htmlAttributes = new { @class = "form-control" } })

                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                    <button type="Submit" class="btn btn-primary">Save changes</button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
    </div><!-- /.modal -->
}

控制器：

[HttpPost]
public ActionResult Employee(string id, string FirstName, string LastName)
{
     //more work here..
     return View("Index");
}

Answer 1

首先，您需要一个类或某些东西来引用这些链接：

<a href="/Home/Employee/id=@item.Id" data-id="@item.Id" data-toggle="modal" data-target="#myModal" class="modalLink">Load me</a>

您需要一个隐藏的表单字段来保存将随表单一起提交的ID。所以把它放在你的模态形式中：

@Html.Hidden("id", "", new { @class = "hiddenid" })

然后，只需使用一些JavaScript。我假设jQuery对你有用吗？

$(document).on("click", ".modalLink", function () {
     var passedID = $(this).data('id');
     $(".modal-body .hiddenid").val(passedID);
});

将Id传递给bootstrap模式弹出窗口

1 个答案: