Question

我的主导航栏上有一个顶部栏。它们都是母版页中标题的一部分。在这个顶部栏中，我有一个注册表和一个登录链接。他们都应该分别触发一个模态。（好吧，注册链接实际上触发了一系列作为注册过程一部分的模态。）

模态显然不是母版页的一部分。它们位于一个名为＆＃34; register.aspx＆＃34;的单独页面中。和＆＃34; login.aspx＆＃34;

我的问题是：我如何称呼这些模态？我尝试了正常的Bootstrap Modal调用，但没有运气。

我不知道这一点我会将默认页面设为静态页面并从母版页运行网站的其余部分，但我宁愿不这样做。

这是代码：

母版页

<div class="top-links">
        <div class="container">
            <div class="row">
                <div class="col-md-6 col-sm-6 col-xs-6 email">
                    <ul class="nav navbar-nav pull-left">
                        <li><a runat="server" href="mailto:brazilvagroup@outlook.com"><i class="fa fa-envelope"></i> brazilvagroup@outlook.com</a></li>
                    </ul>
                </div>
                <div class="col-md-6 col-sm-6 col-xs-6 login">
                    <asp:LoginView runat="server" ViewStateMode="Disabled">
                        <AnonymousTemplate>
                            <ul class="nav navbar-nav navbar-right pull-right">
                                <li><a runat="server" data-toggle="modal" data-target="#getstarted" href="#getstarted"><i class="fa fa-user"></i> Sign up</a></li><%--~/Account/Register--%>
                                <li><a runat="server" href="~/Account/Login">Log in <i class="fa fa-sign-in"></i></a></li>
                            </ul>
                        </AnonymousTemplate>
                        <LoggedInTemplate>
                            <ul class="nav navbar-nav navbar-right pull-right">
                                <li><a runat="server" href="~/Account/Manage" title="Manage your account">Hello, <%: Context.User.Identity.GetUserName()  %>!</a></li>
                                <li>
                                    <asp:LoginStatus runat="server" LogoutAction="Redirect" LogoutText="Log off" LogoutPageUrl="~/" OnLoggingOut="Unnamed_LoggingOut" />
                                </li>
                            </ul>
                        </LoggedInTemplate>
                    </asp:LoginView>
                </div>
            </div>
        </div>
    </div>
    <%-- Main Nav is down here --%>

register.aspx页面

<div class="modal" id="getstarted" 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"><span aria-hidden="true">&times;</span><span class="sr-only">Close</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 btn-default" data-dismiss="modal">Close</button>
            <button type="button" class="btn btn-primary">Save changes</button>
        </div>
    </div>
</div>

Answer 1

不要将它们创建为单独的页面。这可以通过将它们创建为用户控件并将它们导入页面来更容易地完成，其中模式可以由脚本调用。但更好的是，不要将模态标记放在用户控件中，因为它会降低其可移植性和可重用性。从可以在对话框的内容区域中包装引用的页面引用用户控件。

但基本上，这不是一个好方法。如果您希望页面分开，请不要将模态HTML代码放入其中。创建它们作为普通的.aspx页面，没有任何将其指定为引导模式的html标记。然后，将您的模态标记放在.aspx页面或.master中，您可以将iframe放在模态的内容区域中。已经采用的设计方法与使用winforms的方法更相似，其中页面是一个单独的表单，可以是模态对话框。

从母版页远程调用模态

1 个答案: