12 ajax

Page 1

ThS. Nguyễn Nghiệm 0913.745.789 nghiemn@fpt.edu.vn songlong2k@gmail.com


 Giới thiệu Ajax  jQuery Ajax

$.ajax(options) $.post(), $.get(), $.getSON(), $.getScript() $(selector).load()  Ứng dụng

autocomplete Ajax tab Remote validation  Microsoft jQuery Ajax Pluggin


 AJAX = Asynchronous JavaScript And XML

Truyền thông bất đồng bộ với server (http url) Dữ liệu truyền thông là XML Lập trình phía client là JavaScript  Dữ liệu truyền thông không chỉ XML mà còn

HTML Text JSON JavaScript





ThS. Nguyễn Nghiệm 0913.745.789 nghiemn@fpt.edu.vn songlong2k@gmail.com


Url: action xử lý Data: tham số truyền đến action Success: hàm xử lý kết quả trả về từ server. Tham số response chứa dữ liệu trả về.  DataType: qui định kiểu trả về từ server ([text], xml, json, javascript)  Method: phương thức truyền (post hoặc [get])   



PartialView() Content() Json() JavaScript()


$().html() $().prepend() $().append()


 $.post(url, data, function (response) { },

dataType) Giống $.ajax() với type:”post”  $.get(url, data, function (response) { }, dataType)

Giống $.ajax() với type :”get”  $.getJSON(url, data, function (response) { })

Giống $.ajax() với type :”get” và dataType:”json”  $.getScript(url, data, function (response) { })

Giống $.ajax() với type :”get” và dataType:”javascript”




 $("selector").load(function(){})

Tài tài nguyên cho selector


 Quick Search  Autocomplete  Ajax Tabs  Remote Validate

 Slideshow  Tooltip


ThS. Nguyễn Nghiệm 0913.745.789 nghiemn@fpt.edu.vn songlong2k@gmail.com


 @Ajax.ActionLink()  @Ajax.BeginForm()


UpdateTargetId: id của thẻ chứa kết quả  InsertionMode: hình thức thay thế  LoadingElementId: id của thẻ chứa trạng thái tải 




 Qui trình:

Nhấp chọn mua Gửi hàng lên server để bỏ vào giỏ Nhận kết quả và cập nhật giỏ hàng Thực hiện hiệu ứng transfer Thực hiện hiệu ứng bounce  Thực hiện

$(“.add-to-cart”).click() $.getJSON() function(response) $(“#cart-image”).effect() $(#cart-image).show(“bounce”)


 Qui trình

Nhấp liên kết xóa Gửi mã id cần xóa đến server để xóa Nhận phản hồi xóa từ server Cập nhật thông tin giỏ hàng Hiệu ứng xóa hàng khỏ bảng

 Thực hiện

$(“a.remove”).click() $.getJSON() function(response) (“tr.remove”).show(“puff”)


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.