MVC ActionLink使用bootstrap来阻止默认()

时间:2014-03-31 09:45:00

标签: javascript jquery html asp.net-mvc twitter-bootstrap

我有一个链接,我想获取它的href属性并将其设置为表单。

表单位于使用bootstrap 3制作的模态窗口内。

这是我的模态窗口:

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        @using (Html.BeginForm())
        {
            <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">Confirmation required</h4>
                </div>
                <div class="modal-body">
                        @Html.HiddenFor(model => Model.Id)
                        @Html.Hidden("Decision", "declined")
                        @Html.TextArea("Reason", new { @class = "form-control" })
                </div>
                <div class="modal-footer">
                    <input type="button" class="btn btn-default" data-dismiss="modal" value="Close" />
                    <input type="submit" class="btn btn-primary" value="Decline" />
                </div>
            </div>
        }
    </div>
</div>

这是我的ActionLink:

@Html.ActionLink("Decline", "ChiefAnswer", null, new { @Id = Model.Id, @Decision = "declined" }, new { @class = "btn btn-sm btn-default confirmLink", @data_toggle="modal", @data_target="#myModal" });

以下是剧本:

$(document).ready(function () {

    $("#dialog").dialog({
        modal: true,
        bgiframe: true,
        width: 500,
        height: 200,
        autoOpen: false
    });

    $(".confirmLink").click(function (e) {
        e.preventDefault();

        var hrefAttribute = $(this).attr("href");
        var form = $('input[type=submit]').closest("form");
        form.attr("href", hrefAttribute);
    });

});

问题是当我单击我的ActionLink时,不会阻止默认操作,因此它会执行该操作。结果不是我的模态,而是新窗口的结果。

换句话说,操作链接仍将从href属性转到页面。

为什么会这样?我在点击事件中指定了preventDefault函数。

1 个答案:

答案 0 :(得分:0)

试试这个,它会对你有用:

$(".confirmLink").click(function (e) {


        var hrefAttribute = $(this).attr("href");
        var form = $('input[type=submit]').closest("form");
        form.attr("href", hrefAttribute);

        return false;
    });