2011-08-03 28 views
20

Tôi đã đặt điểm ngắt trong WebMethod sau đây nhưng tôi chưa bao giờ nhấn điểm ngắt.Gọi 'WebMethod' với jQuery trong ASP.NET WebForms

cs:

[WebMethod] 
public static string search() 
{ 
    return "worked"; 
} 

aspx:

function search() { 
    $.ajax({ 
     type: "POST", 
     url: "ProcessAudit/req_brws.aspx/search", 
     data: "{}", 
     contentType: "application/json; charset=utf-8", 
     dataType: "json", 
     success: function (msg) { 
      alert(msg) 
     } 
    }); 
} 
<button id = "btnSearch" onclick = "search()" >Search</button> 

Trả lời

24

Hãy chắc chắn rằng bạn đã kích hoạt các phương pháp trang trong ScriptManager yếu tố của bạn:

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

và bạn đã hủy tác vụ mặc định của nút bằng cách trả về false bên trong trình xử lý onclick, nếu không trang sẽ thực hiện đăng đầy đủ và cuộc gọi AJAX của bạn có thể không bao giờ có thời gian để hoàn thành. Dưới đây là một ví dụ làm việc đầy đủ:

<%@ Page Language="C#" %> 
<script type="text/c#" runat="server"> 
[System.Web.Services.WebMethod] 
public static string search() 
{ 
    return "worked"; 
} 
</script> 

<!DOCTYPE html> 
<html> 
<head id="Head1" runat="server"> 
    <title></title> 
</head> 
<body> 
    <form id="Form1" runat="server"> 
     <asp:ScriptManager ID="scm" runat="server" EnablePageMethods="true" /> 
     <button id="btnSearch" onclick="search(); return false;" >Search</button> 
    </form> 

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> 
    <script type="text/javascript"> 
     function search() { 
      $.ajax({ 
       type: 'POST', 
       url: '<%= ResolveUrl("~/default.aspx/search") %>', 
       data: '{ }', 
       contentType: 'application/json; charset=utf-8', 
       dataType: 'json', 
       success: function (msg) { 
        alert(msg.d) 
       } 
      }); 
     } 
    </script> 
</body> 
</html> 

Một khả năng khác là để đăng ký xử lý nhấp chuột kín đáo:

<button id="btnSearch">Search</button> 

và sau đó bên trong một tập tin javascript riêng biệt:

$('#btnSearch').click(function() { 
    $.ajax({ 
     type: 'POST', 
     url: '<%= ResolveUrl("~/default.aspx/search") %>', 
     data: '{ }', 
     contentType: 'application/json; charset=utf-8', 
     dataType: 'json', 
     success: function (msg) { 
      alert(msg.d) 
     } 
    }); 
    return false; 
}); 

Bạn cũng có thể nhận thấy việc sử dụng thuộc tính msg.d bên trong cuộc gọi lại thành công mà ASP.NET sử dụng để bọc toàn bộ phản hồi cũng như cách sử dụng của ResolveUrl để tạo đúng url cho phương thức trang thay vì mã hóa nó.

+4

hmmm ... darins hơi sai ... không có nhu cầu sử dụng ScriptManager ở tất cả. cũng charset là không cần thiết và như vậy là datatype: json :) – naveen

+0

Cảm ơn url đã sai, sử dụng '<% = ResolveUrl ("~/default.aspx/search")%>' – marknery

+0

Tôi thiết lập theo cách tương tự nhưng phản hồi của tôi là chưa xác định. Bất kỳ ý tưởng tại sao?Tôi nhận được lỗi sau trong bảng điều khiển của mình: 'Không tải được tài nguyên: máy chủ phản hồi với trạng thái 500 (Lỗi Máy chủ Nội bộ) ' – Si8

4

Một cuộc gọi được tối ưu hóa hơn sẽ

function search() { 
    $.ajax({ 
     type: "POST", 
     url: '<%= ResolveUrl("~/ProcessAudit/req_brws.aspx/search") %>', 
     data: "{}", 
     contentType: "application/json", 
     success: function (msg) { 
      msg = msg.hasOwnProperty("d") ? msg.d : msg; 
      alert(msg); 
     } 
    }); 
} 

Không cần phải cung cấp một asp:ScriptManager ở tất cả.

Tài nguyên: http://encosia.com/using-jquery-to-directly-call-aspnet-ajax-page-methods/

+3

Chrome dường như không thích liên kết này vì phần mềm độc hại đáng ngờ, nhưng tôi không muốn xóa kể từ khi tôi không đăng bài này. https://www.virustotal.com/en/url/ba8f2c409307ec010ef80629f518aabb85e846e88881a113ba7c2d4259d62cfe/analysis/1485793115/ – KSib

0

Nút hiện tại của bạn đang gây ra một postback đầy đủ. Chỉ cần thêm một loại = "nút" vào nút của bạn để tránh điều này.

<button id = "btnSearch" type="button" onclick = "search()" >Search</button> 

-Shazzam yo

0

Làm thế nào để thực hiện phương pháp web ASP.Net sử dụng JQuery AJAX?

HTML Page:

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 

    <title></title> 
    <script src="js/jquery.min.js"></script> 
    <script> 
     function SubmitData() { 

      var name = 'Ram'; 
      var gender = 'Male'; 
      var age = '30';   

      $.ajax({ 
       type: "POST", 
       url: "ajaxcall.aspx/SaveData", 
       data: '{"name":"' + name + '", "gender":"' + gender + '", "age":"' + age + '"}', 
       contentType: "application/json; charset=utf-8", 
       dataType: "json", 
       beforeSend: function() { 
        $('#loader').show(); 
       }, 
       success: function (data) { 

        alert(data.d); 
        $('#loader').hide(); 
       }, 
       error: function (msg) { 
        //alert('3'); 
        msg = "There is an error"; 
        alert(msg); 
        $('#loader').hide(); 
       } 
      }); 

     } 
    </script> 
</head> 
<body> 
    <div id="loader" style="display: none;"> 
     <img src="ajax-loader.gif" /> 
    </div> 
    <a href="#" onclick="SubmitData();">Submit</a> 
</body> 
</html> 

Mã đằng sau:

[WebMethod] 
    public static string SaveData(string name, string gender, string age) { 
    try { 
     return "OK"; 
    } catch (Exception ex) { 
     return ex.Message; 
    } finally { } 
} 

Resource: http://www.sharepointcafe.net/2016/10/how-to-call-aspnet-web-method-using-jquery-ajax.html

Các vấn đề liên quan