2008-10-04 19 views
12

Tôi muốn tạo lại bảng điều khiển cập nhật mà không cần sử dụng bảng cập nhật để thực hiện đăng lại. Phương pháp chung để thực hiện điều này là gì?Làm cách nào để tạo lại bài đăng trên onclientclick bằng jQuery với asp.net

Ví dụ, trên Stackoverflow, khi bạn bỏ phiếu lên hoặc xuống trên một câu hỏi nó postback để cập nhật cơ sở dữ liệu và tôi đặt cược rằng họ không sử dụng bảng cập nhật.

Tôi có gì?

Tôi có bảng có dữ liệu bảng. Khi tôi nhấp vào mục td làm toàn bộ cột, tôi muốn cập nhật cơ sở dữ liệu và cũng cập nhật chế độ xem lưới trên chính trang đó. GridView hiển thị tất cả các mục hiện đang được nhấp trong bảng bởi vì nó được cập nhật thông qua "phương thức của chúng tôi".

Tìm phương pháp chung chung tốt mà tôi có thể sử dụng cho rất nhiều bài đăng không đồng bộ mà không cần cập nhật bảng điều khiển.

Trả lời

17

Cách mà Stack Overflow hoạt động khác nhau theo hai cách quan trọng từ bài viết CodeProject đó.

  • Ngăn xếp ngăn xếp đang thực hiện yêu cầu AJAX dựa trên hành động điều khiển ASP.NET MVC, không phải trang ASPX độc lập. Bạn có thể coi đây là tương tự MVC của một phương thức trang ASP.NET AJAX. Trong cả hai trường hợp, phương pháp ASPX sẽ tụt hậu về hiệu suất.

  • Yêu cầu AJAX của Stack Overflow trả về kết quả được tuần tự hóa JSON, không phải là văn bản thuần tuý hoặc HTML tùy ý. Điều này làm cho việc xử lý nó ở phía khách hàng được tiêu chuẩn hóa hơn và nói chung là sạch hơn.

Ví dụ: khi tôi bỏ phiếu câu hỏi này, yêu cầu XmlHttpRequest được gửi đến/questions/171000/vote, với "voteTypeId" là 2 trong dữ liệu POST.

Bộ điều khiển mà xử lý yêu cầu thêm phiếu bầu của tôi vào một bảng ở đâu đó và sau đó đáp lại bằng JSON này:

{"Success":true,"NewScore":1,"Message":"","LastVoteTypeId":2} 

Sử dụng thông tin đó, JavaScript này sẽ chăm sóc của việc cập nhật màn hình hiển thị client-side:

var voteResult = function(jClicked, postId, data) { 
    if (data.Success) { 
    jClicked.parent().find("span.vote-count-post").text(data.NewScore); 
    if (data.Message) 
     showFadingNotification(jClicked, data.Message); 
    } 
    else { 
    showNotification(jClicked, data.Message); 
    reset(jClicked, jClicked); 

    if (data.LastVoteTypeId) { 
     selectPreviousVote(jClicked, data.LastVoteTypeId); 
    } 
    } 
}; 

Nếu bạn đang sử dụng WebForms, ví dụ về các phương pháp gọi trang mà bạn tìm thấy trên blog của tôi chắc chắn là ở sân chơi bóng bên phải.

Tuy nhiên, tôi khuyên bạn nên xem xét dịch vụ web cho bất kỳ chức năng tập trung nào (ví dụ như ví dụ bỏ phiếu này), thay vì phương pháp trang. Phương pháp trang dường như dễ viết hơn một chút, nhưng chúng cũng có một số nhược điểm sử dụng lại và có xu hướng cung cấp một ảo giác về bảo mật bổ sung không thực sự ở đó.

Đây là một ví dụ về làm điều tương tự bạn tìm thấy, nhưng với các dịch vụ web (các ý kiến ​​về bài đăng này thực sự dẫn đến việc bài bạn tìm thấy):

http://encosia.com/2008/03/27/using-jquery-to-consume-aspnet-json-web-services/

+0

cảm ơn bạn vì điều này ... Tôi cũng đánh giá cao blog của bạn. –

+0

Không sao cả. Hy vọng nó giúp. –

+0

Tôi muốn thể hiện một điều nữa về câu trả lời này. sử dụng phương pháp trang NẾU giải pháp không dành cho hệ thống tập trung. –

2

Bạn chỉ có thể sử dụng cuộc gọi AJAX chuẩn để thực hiện việc này. Tạo một trang .aspx cập nhật cơ sở dữ liệu trong phương thức Page_Load của nó và hiển thị bất kỳ thông tin nào mong muốn (như giá trị DB hiện tại sau khi cập nhật) dưới dạng XML. Sau đó thực hiện cuộc gọi AJAX đến trang đó bằng jQuery.

Bạn cũng có thể trả lại một đoạn HTML (ví dụ: GridView được cập nhật) và sử dụng jQuery để chèn HTML được cập nhật vào trang hiện tại.

Edit: Mẫu 2 trên trang này nên rất gần với những gì bạn muốn:
http://www.codeproject.com/KB/ajax/AjaxJQuerySample.aspx

+0

Vì vậy, là cách này Stackoverflow lẽ Phải không? –

+1

Câu trả lời của Dave Ward mô tả cách thức hoạt động của SO. – AaronSieb

2

link Đây là những gì tôi thấy được những điều tốt nhất để làm và cho phép tôi sử dụng javascript và phương pháp web .

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