使用JQuery登录页面

本文关键字:登录 JQuery 使用 | 更新日期: 2023-09-27 18:29:32

3天前,代码运行良好。但现在不是了。请指出我的错误,因为我是JQuery的新手。

我调试了它,发现调试器并没有进入ajax的成功方法。甚至不去CS文件。

Jquery代码-

 <script type="text/javascript">
    $(document).ready(function () {
        $('#btnSubmit').click(function () {
            alert('b');
            $.ajax({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: "admin.aspx/LogIn",
                dataType: "json",
                data: "{'name':'" + $('#txtfn').val() + "','password':'"     +$('#txtln').val() + "'}",
                success: function (data) {
                    alert(data);
                    var obj = data.d;
                    alert(obj);
                    alert(data.d);
                    if (obj == 'true') {
                        $('#txtfn').val('');
                        $('#txtln').val('');
                        alert("dasdsad");
                        window.location = "home.aspx";
                        alert("success");
                    }
                    else if (obj == 'false')
                    { alert("errorrrrrrrrrrrrrrrrrrrrrrrrrrrrrrr"); }
                },
                error: function (result) {
                    alert(data);
                    alert("aaaaaaafgdgfdfgsfgfhffghgfhgfhfghfghfhfghfhfghgfhgfhgfhgfhfghfghgfhgfhgf");
                    alert(result);
                }
            });
           });
    });
</script>
</head>
<body>
&nbsp;<div id="login">
    <div id="triangle"></div>
    <h1>Log in</h1>
    <form id="f1" runat="server">
        <input type="text" id="txtfn" placeholder="name" />
        <input type="text" id="txtln" placeholder="Password" />
        <input type="submit" id="btnSubmit" value="Log in" />
    </form>
   </div>
</body>

代码-

[WebMethod]
public static string LogIn(string name, string password)
{
    string retMessage = string.Empty;
    string constr = ConfigurationManager.ConnectionStrings["oltest_conString"].ConnectionString;
    using (SqlConnection con = new SqlConnection(constr))
    {
        string Query = "select * from profile where name=@pname and password=@pwd";
        using (SqlCommand cmd = new SqlCommand(Query, con))
        {
            cmd.Parameters.AddWithValue("@pname", name);
            cmd.Parameters.AddWithValue("@pwd", password);
            con.Open();
            SqlDataReader dr = cmd.ExecuteReader();
            if (dr.Read())
            {
                //retMessage = "home.aspx";
                retMessage = "true";
            }
            else
            {
                retMessage = "false";
            }
        }
        return retMessage;
    }
}

使用JQuery登录页面

您只需要删除

alert('b');``

在您的jquery代码上

尝试添加

return false

在ajax调用的末尾

Hi将提交按钮更改为按钮。

  <input type="button" id="btnSubmit" value="Log in" />

 data: {name: $('#txtfn').val() ,password: $('#txtln').val()},

我更新了答案:由于表单已提交,您的ajax调用未执行,此代码将阻止提交

$("#f1").submit(function (e) {e.preventDefault();})

将其放在$('#btnSubmit').click(function () {之前

更好的方法是将您的代码放入

$("#f1").submit(function (e) {
   e.preventDefault();
   // here place content of $('#btnSubmit').click(function () {( )}
})

请确保您的web方法接受JSON数据/参数,并且返回正确的true/false,没有任何异常/错误。您可以在firebug和Visual Studio中进行调试。