WebメソッドによるAJAXログイン画面？

Question

私はこれで新しく、WebメソッドへのAJAX呼び出しを介して返されるはずのものの周りに私の脳をラップするのに苦労しています。私は単純なログイン画面を作成しようとしています。

は、ここで私が持っているものです。

HTML：

  <asp:ScriptManager ID="ScriptManager2" runat="server" EnablePageMethods="true"></asp:ScriptManager> 

      <input type="text" placeholder="username" id="username" /> 
      <input type="password" placeholder="password" id="password" /> 
      <button id="loginbutton" onclick="UserLogin()" type="submit">login</button> 

ではJavaScript：

function UserLogin() { 

     var postData = JSON.stringify({ 
      "username": $("#username").val(), 
      "password": $("#password").val() 
     }); 
     alert(postData); 
     $.ajax({ 
      type: "POST", 
      url: "login.aspx/AuthenticateUser", 
      data: postData, 
      contentType: "application/json; charset=utf-8", 
      success: callbackfunction, 
      error: function (msg) { alert(msg); } 
     }); 


    } 

    function callbackfunction(result) { 
     alert('callback'); 
     if (result.d) { 
      alert('success'); 
     } 
    } 

Webメソッド：

 <WebMethod()> 
Public Shared Function AuthenticateUser(sID As String, sPassword As String) As Boolean 


    Dim db As New ProjectDatabase 
    Dim ed As New EncryptDecrypt 

    Dim sSQL As String = "SELECT [USER_ID] FROM [USERS] WHERE [USER_ID] = '" & sID & "' AND [PASSWORD] = '" & ed.Encrypt(sPassword) & "'" 

    'will return the result of the query, either a user id or nothing 
    Dim sRtn As String = db.GetSQLData(sSQL, db._cnnSQL) 

    If sRtn = "" Then 
     Return False 
    Else 
     Return True 
    End If 

End Function 

だから私は右のそれを理解していれば、 Webメソッドから真または偽のいずれかを返すことができるはずですが、何らかの理由でそこに着くことができません（ブレークポイントに当たっていない）、AJAXの両端がメッセージボックスをスローする必要があります。しかし、それも起こりません。

私はこの質問が尋ねられていることを知っています。私は複数の記事を読んだことがありますが、それでも正しいように見えることはできません。

ありがとうございました。

Answer 1

ログインボタンにはtype="submit"があり、完全なポストバックが開始されるため、この動作によってajaxリクエストが発生することはほとんどありません。

type="button"

Answer 2

に変更し、それはこれを試してみてください -

HTML -

<asp:ScriptManager ID="ScriptManager2" runat="server" EnablePageMethods="true"></asp:ScriptManager> 

     <input type="text" placeholder="username" id="username" /> 
     <input type="password" placeholder="password" id="password" /> 
     <button id="loginbutton" onclick="UserLogin()" type="submit">login</button> 

JAVASCRIPT -

function UserLogin() { 

    var postData = JSON.stringify({ 
     "username": $("#username").val(), 
     "password": $("#password").val() 
    }); 
    alert(postData); 
    $.ajax({ 
     type: "POST", 
     url: "login.aspx/AuthenticateUser", 
     data: "{'data': '" + postData+ "'}", 
     contentType: "application/json; charset=utf-8", 
     dataType: "json", 
     success: callbackfunction(result), 
     error: function (msg) { debugger;alert(msg); } 
    }); 


} 

function callbackfunction(result) { 
    debugger; 
    alert('callback'); 
    if (result.d) { 
     alert('success'); 
    } 
} 

Webメソッド -

using NewtonSoft.Json; 

<WebMethod()> 
Public Shared Function AuthenticateUser(data As String) As Boolean 


Dim db As New ProjectDatabase 
Dim ed As New EncryptDecrypt 
Dim dt As New Datatable = JsonConvert.DeserializeObject<DataTable>(data); 

Dim sSQL As String = "SELECT [USER_ID] FROM [USERS] WHERE [USER_ID] = '" & dt.Rows(0).Item("username") & "' AND [PASSWORD] = '" & ed.Encrypt(dt.Rows(0).Item("password")) & "'" 

'will return the result of the query, either a user id or nothing 
Dim sRtn As String = db.GetSQLData(sSQL, db._cnnSQL) 

If sRtn = "" Then 
    Return False 
Else 
    Return True 
End If 

End Function 

これはデータを取得し、ブラウザでデバッグできるようにします