当前位置 : 主页 > 网络编程 > ASP >

asp.net-mvc – 从MVC剃刀模型调用Bootstrap 3 Modal?

来源:互联网 收集:自由互联 发布时间:2021-06-24
目前我正在使用一个模型,在从表单发回后我查看模型属性以显示警报.但是我现在需要显示一个模态.我知道我需要在页面底部显示一个模态div,但我无法弄清楚如何从Razor模型调用它. 所
目前我正在使用一个模型,在从表单发回后我查看模型属性以显示警报.但是我现在需要显示一个模态.我知道我需要在页面底部显示一个模态div,但我无法弄清楚如何从Razor模型调用它.

所有我发现的研究想法是按钮点击或点击事件会调用一些JS并显示模态.我找不到任何关于如何从View中打开它的内容.

这个概念是最终用户会点击一个按钮,基本上像时间戳一样进入数据库.在控制器中我设置了一个MessageType属性,然后根据我会显示一个Bootstrap错误警报,如果有错误或成功警报,如果一切正常.现在,我不需要调用成功警报,而是需要打开模态.

这是我现在用警报做的方式.这是我的MVC视图.有没有办法做同样的,而不是警报打开模态?

@if (Model.MessageType == "PUNCH")
{
    <div class="alert alert-success">
        <h3>Punch accepted at <strong>@Model.CurrentTime.</strong></h3>
    </div>
}
与您的操作类似,您可以执行显示模态对话框的javascript代码.

假设您已将所需的引导文件加载到您的页面,

<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" 
                                                       aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" 
                    aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">Modal title</h4>
            </div>
            <div class="modal-body">
                ...
            </div>
            <div class="modal-footer">
                <button type="button" class="btn" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary">Save changes</button>
            </div>
        </div>
    </div>
</div>

@section Scripts
{
 @if (Model.MessageType == "PUNCH")
 {
    <script>
        $('#myModal').modal();
    </script>
 }
}
网友评论