Hướng dẫn ajax post javascript
AJAX là gì?AJAX là chữ viết tắt của Asynchronous JavaScript and XML, AJAX = Asynchronous JavaScript and XML. Đây là một công nghệ giúp chung ta tạo ra những Web động mà hoàn toàn không reload lại trang nên rất mượt và đẹp. Vậy Asynchronous, JavaScript, XML trong từ AJAX là gì: Show
Cả JavaScript và XML đều hoạt động bất đồng bộ trong AJAX. Kết quả là, nhiều ứng dụng web có thể sử dụng AJAX để gửi và nhận data từ server mà không phải toàn bộ trang. Ví dụ thực tế của AJAXAJAX trước đâyBạn hãy nhớ đến tính năng tự động hoàn thiện của Google. Nó giúp bạn dự đoán và hoàn thiện từ khóa trong quá trình gõ. Từ khóa thay đổi theo thời gian thực nhưng trang web của Google vẫn giữ nguyên như cũ. Trong thập niên 90s, khi internet vẫn chưa phát triển, tính năng này cần Google phải cho tải trang lại mỗi lần có đề nghị mới hiện lên màn hình. AJAX giúp việc trao đổi dữ liệu nội bộ và presentation layer hoạt động đồng thời. Tuy nhiên không ảnh hưởng đến chức năng của nhau. Ajax được ứng dụng phổ biến trong hầu hết các website hiện nay, cụ thể nhất là công cụ tìm kiếm Google.Ý tưởng của AJAX đã thực sự có từ giữ thập kỷ 90. Nhờ Google, nó đã được công nhận rộng rãi hơn khi mà Google triển khai ý tưởng này lên Google Mail và Google Maps năm 2004. Ngày nay, nó đã được dùng khắp các ứng dụng web để tinh giản quá trình giao tiếp với server. AJAX ngày nay
Tóm lại, AJAX hoạt động đa nhiệm. Nếu bạn từng gặp trường hợp 2 tác vụ hoạt động đồng thời, một cái chạy và một cái tĩnh, có thể đó chính là sản phẩm của AJAX. Nếu muốn cải thiện website, đừng quên Google và khách hàng của bạn đang rất xem trọng vấn đề bảo mật. Chứng chỉ SSL là không thể thiếu. AJAX hoạt động như thế nào?Bạn cần lưu ý AJAX không phải dùng một công nghệ duy nhất, cũng không phải ngôn ngữ lập trình. Như đã nói ở trên, AJAX là một bộ kỹ thuật phát triển web. Bộ hệ thống này bao gồm:
Có thể bạn cần có kiến thức kỹ thuật để hiểu về nó hoàn toàn. Tuy nhiên, quy trình cơ bản của AJAX lại rất đơn giản. Bạn chỉ cần nhìn vào sơ đồ sau là thấy. Sơ đồ hoạt độngĐây là sơ đồ miêu tả hoạt động của AJAX.Bảng so sánh
Tại sao nên dùng AJAX?Có 4 lợi ích chính của việc sử dụng Ajax, cụ thể là:
Ajax nên được sử dụng ở đâu?Ajax nên được sử dụng ở bất cứ nơi nào trong một ứng dụng web, nơi một lượng nhỏ thông tin có thể được lưu hoặc lấy ra từ máy chủ mà không cần tải lại toàn bộ trang web. Ví dụ, với một trang web bán hàng, khi người dùng chọn thành phố giao hàng giao hàng một hộp thoại dropdown được tải lại và chỉ chứa giá trị là tên các huyện của thành phố đã được chọn. jQuery Ajax là gì?jQuery Ajax là jQuery cung cấp một số phương thức để thực hiện các chức năng ajax. Chúng ta có thể yêu cầu các text, HTML, XML và JSON từ server sử dụng cả giao thức HTTP GET và HTTP POST, chúng ta cũng có thể lấy dữ liệu từ bên ngoài trực tiếp vào trong phần tử được chọn. Hàm $.ajax() của JQuery được sử dụng để thực hiện các request HTTP bất đồng bộ (async). Nó đã được thêm vào thư viện này từ rất lâu, tồn tại từ phiên bản 1.0. Ba hàm $.get(), $.post() và $.load() có thể coi là một hàm $.ajax() với những thiết lập có sẵn. Sau đây là cú pháp tổng quát của hàm $.ajax(): $.ajax(url[, options]) $.ajax([options]) Tham số url là một chuỗi chứa URL mà bạn muốn sử dụng AJAX để thực hiện request, trong khi đó tham số options là một object thuần chứa các thiết lập cho request AJAX đó. Ở dạng đầu tiên, phương thức này thực hiện một request AJAX sử dụng tham số url và các cài đặt được chỉ định ở options. Ở dạng thứ hai, URL được chỉ định trong tham số options, hoặc có thể được lược bỏ trong trường hợp request này được gửi đến chính đường dẫn của trang hiện tại. Bạn có thể xem document chính thức của $.ajax()để hiểu rõ hơn về các option của AJAX. Các phương thức cơ bản của jQuery AjaxjQuery Ajax có khá nhiều phương thức khác nhau. Tuy nhiên dưới đây Mắt Bão sẽ đề cập 3 phương thức cơ bản nhất gồm:
Hãy cùng tìm hiểu chi tiết về 3 phương thức nói trên! Phương thức jquery load () jQuery Ajax là gì?Phương thức load() lấy dữ liệu từ server và trả dữ liệu cho phần tử được chọn. Cú pháp: $(selector).load(URL,data,callback);
Ví dụ: Ta có file demo_test.txt
Load nội dung của file “demo_test.txt“ vào trong một div với id = div1
Phương thức Post () trong JQuery Ajax là gì?Có tác dụng lấy dữ liệu từ server bằng phương thức HTTP POST REQUEST Cú pháp: $(selector).post(URL,data,function(data,status,xhr),dataType)
Ví dụ : Ta có file “demo_test_post.asp“ <% dim fname,city fname=Request.Form("name") city=Request.Form("city") Response.Write("Dear " & fname & ". ") Response.Write("Hope you live well in " & city & ".") %>
Phương thức Get () trong Jquery Ajax là gì?Là phương pháp lấy dữ liệu từ server bằng phương thức HTTP GET Tương tự như phương thức Post , phương thức get có cú pháp là : $.get(URL,data,function(data,status,xhr),dataType) Ví dụ :
Như vậy bạn có thể thấy được toàn bộ quá trình hoạt động của Ajax. Ajax không làm gián đoạn sự hiển thị hay tương tác của trang web vào trước và trong thời gian trình duyệt gửi Ajax request tới server. Chính tính năng này sẽ giúp tăng trải nghiệm của người dùng và đồng thời tối ưu hóa tài nguyên trên server. Còn đợi gì nữa mà không kết hợp Ajax để tối ưu website của bạn được tốt nhất. |