0

我正在使用 ASP.net 制作一个网站，我想用 JQuery ModalDialog 制作一个漂亮的登录弹出窗口（或 ajax ......我对 ajax 不太了解）。我有一个包含每个允许用户的数据库，如果用户成功登录，我想关闭弹出窗口（如果没有，我希望弹出窗口保留，并显示错误消息）。问题是我的验证是在服务器端完成的，而 JQuery 在客户端运行。

4

4 回答 4

2

最简单的方法是从你的对话框中调用一个jQuery ajax，然后在后面的代码中使用一个webmethod来监听这个ajax，这个webmethod将返回成功的登录，或者不成功并且你处理删除对话框客户端

我会给你一些示例代码

        function fnValidateLogIn() {         
        $('#<%= lblLoginMessage.ClientID %>').text("");
        var email = $('#<%= txtEmail.ClientID %>').val();
        var pass = $('#<%= txtPass.ClientID %>').val();
        if (pass == "") {
            $('#<%= lblLoginMessage.ClientID %>').text("Please Enter A Password");
            return false;
        }
        else {
            $.ajax({
                type: "POST",
                url: "Login.aspx/LoginUser",
                data: "{'email':'" + email + "', 'pass' : '" + pass + "'}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (msg) {
                    var obj = $.parseJSON(msg.d);
                    if (obj.login == "failed") $('#<%= lblLoginMessage.ClientID %>').text("Login Failed");
                    if (obj.login == "success") {
                        location.reload(true);   //you can hide popup instead of refreshing
                        window.location = $('.hidden_url').text();  //you can hid popup instead of redirect 
                    }
                }
           });
            return false;
        }
    }

代码背后：

       <System.Web.Services.WebMethod(EnableSession:=True)> _
       Public Shared Function LoginUser(email As String, pass As String) As String

        'code to validate user

       return "{ ""login "" : ""success"" }"  'example

那是在 VB.Net 中，但你可以明白

于 2012-09-01T18:30:46.377 回答
0

这取决于您用于弹出窗口的 jquery 插件。

基本上你需要得到弹出的句柄。该插件应具有关闭功能，您需要在从服务器获得成功响应后调用它。他的大多数插件通常都有类似的东西$("#pop_up_id").close();

于 2012-09-01T18:40:02.523 回答
0

在服务器端创建一个返回字符串的 Web 方法

If successful login it will return 'success'
or if invalid login it willl return 'fail'

现在在客户端使用 jQuery ajax 函数像这样对你的方法进行 ajax 调用

$.ajax(
url:your.asmx/webmethod
data:{username:$('#usernametextboxid').val(),password:$('#passwordtextbox').val()
type:'POST'
dataType:'json'
success:function(data){
//logic to hide popup

if(data.d=='success'){$('#modalpopupid').close()}
else if(data.d=='fail'){$('#modalpopupid').html('Invalid login')}
else{alert('some error occured.Please try again')}

}
)
于 2012-09-01T18:43:06.907 回答
0

Scott Selby，在您的代码中，您正在刷新页面，这正在扼杀 ajax 的含义。模态窗口只需调用插件的close()函数即可关闭，无需刷新页面。

于 2012-09-01T18:43:13.007 回答