在 SweetAlert2 弹出窗口中显示 aspx 页面？

Question

我想在弹出窗口中显示自定义 aspx 页面。我正在使用 Sweetalert2.js 并尝试使用 iframe 加载 aspx 页面。

问题是：我有母版页，当我尝试下载页面的未渲染代码时正在加载。加载弹出窗口时会导致错误。

因为代码以 <% .. on top of the aspx page.

开头

如何打开要呈现 html (aspx) 的 aspx 页面，而不会在 Sweetalert2 弹出窗口中出现错误。

我希望我可以使用 Sweetalert2.js 作为模式弹出窗口。我想在 Sweetalert 弹出页面中打开 aspx 页面。

例如：我有一个名为login.aspx的登录页面

当用户点击登录按钮时；我想在 Sweetalert2.js 弹出窗口中显示 login.aspx 页面。

Answer 1

您可以显示一个带有 iframe 的 div，然后使用 sweetalert 显示其他页面。当然，“其他”页面不应该有母版页，否则您会在弹出窗口内部以及现有页面的顶部看到菜单栏。

我建议 jQuery.UI 对话框更适合。

但是，假设我有这个标记：

        <script src="//cdn.jsdelivr.net/npm/sweetalert2@10"></script>

        <input id="Button1" type="button" value="button"
            onclick="mypopdiv();return false;"
            />
     

        <script>

            function mypopdiv() {
                Swal.fire({
                    title: 'My div area',
                    width: '1000px',
                    html: `<div>
                        <iframe
                          src="../Grids/Fighters.aspx" style="width:900px;height:750px" >
                        </iframe>
                    </div>`
                })

            }

        </script>

所以，你可以看到我如何将 iframe 放置到另一个页面。

结果是这样的：

挑战将是让其他页面内的代码关闭对话框。

因此，您必须创建一个没有母版页的登录页面。并且您需要该弹出页面中的某些按钮才能关闭该页面，或者他们可以登录，然后单击“确定”关闭对话框。