Question

在我的网站上，我有两种登录方式。第一个用于然后用户按下登录按钮，这将触发jQuery UI对话框打开。第二个是普通视图，如果用户未授权，则使用该视图，该视图将重定向到正常的登录视图。但我喜欢做的是，如果用户不是Authorized，它会打开Login jquery ui对话框，而不是重定向到用户想要的视图。

这就是我目前正在打开对话框的方式，

 $(".openLoginDialog").on("click", function (e) {
    e.preventDefault();
    $("<div></div>")
      .addClass("dialog")
      .attr("id", $(this).attr("data-dialog-id"))
      .appendTo("body")
      .dialog({
        title: $(this).attr("data-dialog-title"),
        create: function (event, ui) {},
        close: function () { $(this).remove() },
        open: function (event, ui) {},
        modal: true,
        position: ['center', 130],
        minWidth: 510,
        resizable: true,
        zIndex: 20000
      })
      .load(this.href);
  });

因为对话框中的内容是partialView，所以它的调用方式如下：

<div class="items iconlogin highligth-br"><a class="openLoginDialog" data-dialog-id="LoginDialog" data-dialog-title="Login" href="@Url.Action("LogOn", "Authentication", new { returnUrl = Request.Url.ToString() })">Login</a></div>

另外为了帮助我控制未授权，我已经覆盖了这个电话。

public override void OnAuthorization(AuthorizationContext filterContext)
    {
      filterContext.Result = new RedirectToRouteResult(new
            RouteValueDictionary(new { controller = "Authentication", action = "AccessDenied" }));
    }

最后的办法是重定向到访问被拒绝的页面，只有一个白色背景，在加载时打开，一个对话框。

Answer 1

我有一个MVC内部网解决方案，它采用与您描述的功能相似的功能，但它使用的是Windows身份验证而不是表单。

基本上我在索引中有这样的东西......

var userExists = "@ViewBag.User";
// require the user to register if they are not found
if (userExists == "") {
    $.get('Home/Register/', function (data) {
        $("#Register").html(data);
        $("#Register").dialog({
            resizable: false,
            closeOnEscape: false,
            dialogClass: 'no-close',
            typeDelay: 250
        });
    });
}

然后在控制器中我将'ViewBag.User'设置为用户名（如果存在）。

Answer 2

看一下这个例子：

http://jqueryui.com/dialog/#modal-form

注意autoOpen: false

Answer 3

我不熟悉asp.net所以我无法帮助实际实现。一种方法是检查请求的来源以及用户是否未被授权将其重定向回该页面并使用对话框点击它们。

另一种方法是知道用户是否在页面加载上进行了身份验证并覆盖了需要身份验证的链接

$(".authRequired").on("click", function (e) {
e.preventDefault();
      //fancy logic here to load form and dialog
 });

如果用户未经授权，则触发jQuery UI对话框

3 个答案: