Question

我的ASP.NET MVC3网站中有一个部分，用户可以单击按钮将条目添加到其帐户中的“已保存的项目”部分。这是通过一个JQuery Ajax请求完成的，如果他们已经登录就可以正常工作。如果他们没有登录，我希望他们被重定向到登录页面，然后自动将条目添加到他们的Saved项目部分。

我将所有部件单独工作 - 即单击按钮时，如果未登录，则会显示登录框。登录弹出窗口也可以成功运行。问题是试图一次性无缝地完成所有事情。这是我到目前为止的代码：

单击“保存”按钮的事件 - 检查用户是否一直登录：

    var loggedIn = false;

    $(document).ready(function () {
        $('a#saveSearch').live('click', function (event) {
            $.get('@Url.Action("IsLoggedIn", "Account", null)', function (response) {
                if (response == "True")
                    loggedIn = true;
                else
                    loggedIn = false;
            });
            if (loggedIn){
                SaveSearch();
            }
            else{                        
                $('#dialog').dialog('open');
                SaveSearch(); //don't think this is correct because it hits this line before login is complete
            }
        });

保存到数据库的功能：

        function SaveSearch(){                    
            var url = '@Url.Action("SaveSearch", "User")';
            $.ajax({
                url: url,
                type: 'POST',
                contentType: "application/json; charset=utf-8",
                data: JSON.stringify({
                    json: "@Html.Raw(Session["MyFormString"].ToString())"
                }),
                success: function (data) {
                    $('a#saveSearch').attr('disabled', "disabled");
                    $('div#savedResponse').html('<p>Search saved to user account</p>');
                },
                error: function () {
                }
            });
        }
    });

JQuery UI对话框弹出：

$(function () {
    $('#dialog').dialog({
        autoOpen: false,
        width: 400,
        resizable: false,
        title: 'Login',
        modal: true,
        open: function(event, ui) {
            $(this).load("@Url.Action("Logon", "Account", null)");
        },
        buttons: {
            "Close": function () {
                $(this).dialog("close");
            }
        }
    });

我认为我的代码存在一些基本错误，因为这样，登录弹出窗口只会显示一秒钟然后立即消失。看起来我需要让它停止推进代码直到登录完成。

任何有关此事的建议或帮助都将不胜感激。

Answer 1

我想你的问题可能与：

有关

$.get('@Url.Action("IsLoggedIn", "Account", null)', function (response) {
  if (response == "True")
    loggedIn = true;
  else
    loggedIn = false;
});
if (loggedIn){
  SaveSearch();
}
else{                        
  $('#dialog').dialog('open');
  SaveSearch(); //don't think this is correct because it hits this line before login is complete
}

$.get调用是异步的，这意味着后一个代码：

if (loggedIn){

在服务器响应之前执行。您需要将该代码放在响应回调中：

$.get('@Url.Action("IsLoggedIn", "Account", null)', function (response) {
  if (response == "True")
    loggedIn = true;
  else
    loggedIn = false;

  if (loggedIn){
    SaveSearch();
  }
  else{                        
    $('#dialog').dialog('open');
    SaveSearch(); //don't think this is correct because it hits this line before login is complete
  }
});

Answer 2

尝试为你的模态添加一个关闭回调函数，然后只有在模态关闭并且所有登录都成功完成后才能完成代码。查看代码中的注释

$(document).ready(function () { 
    $('a#saveSearch').live('click', function (event) { 
        $.get('@Url.Action("IsLoggedIn", "Account", null)', function (response) { 
            if (response == "True") 
                loggedIn = true; 
            else 
                loggedIn = false; 
        }); 
        if (loggedIn){ 
            SaveSearch(); 
        } 
        else{  
            //in this dialog, add a close handler,then add the SaveSearch(); function in that handler
            $('#dialog').dialog('open'); 

           } 
    });

通过登录屏幕使用JQuery将数据发布到控制器

2 个答案: