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

Passing Id to bootstrap modal popup

这里是调整到 JQuery 后的工作:

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

//查看Link

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

如何在 <a href 单击时捕获我传递的 ID?

所以我有一个模式弹出窗口,当用户单击时我想在用户 post 数据时获取它的 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");
}

首先你需要一个 class 或者你可以用来引用链接的东西:

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