Laravel – Ajax

0
32

Ajax  (Asynchronous JavaScript and XML)  là một tập hợp các kỹ thuật phát triển web sử dụng nhiều công nghệ web được sử dụng ở phía máy khách để tạo các ứng dụng Web không đồng bộ. Nhập thư viện jquery trong tệp dạng xem của bạn để sử dụng các hàm ajax của jquery sẽ được sử dụng để gửi và nhận dữ liệu bằng ajax từ máy chủ. Ở phía máy chủ, bạn có thể sử dụng hàm response () để gửi phản hồi đến máy khách và để gửi phản hồi ở định dạng JSON, bạn có thể xâu chuỗi hàm phản hồi với hàm json ().

json() function syntax

json(string|array $data = array(), int $status = 200, array $headers = array(), int $options)

Vi du

Bước 1 – Tạo một view có tên là resources / views / message.php và sao chép đoạn mã sau vào tệp đó.

<html>
   <head>
      <title>Ajax Example</title>
      
      <script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
      </script>
      
      <script>
         function getMessage() {
            $.ajax({
               type:'POST',
               url:'/getmsg',
               data:'_token = <?php echo csrf_token() ?>',
               success:function(data) {
                  $("#msg").html(data.msg);
               }
            });
         }
      </script>
   </head>
   
   <body>
      <div id = 'msg'>This message will be replaced using Ajax. 
         Click the button to replace the message.</div>
      <?php
         echo Form::button('Replace Message',['onClick'=>'getMessage()']);
      ?>
   </body>

</html>

Bước 2 – Tạo một controller có tên AjaxController bằng cách thực hiện lệnh sau.

php artisan make:controller AjaxController --plain

Bước 3 – Sao chép mã sau vào tệp app / Http / Controllers / AjaxController.php.

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Http\Requests;
use App\Http\Controllers\Controller;

class AjaxController extends Controller {
   public function index() {
      $msg = "This is a simple message.";
      return response()->json(array('msg'=> $msg), 200);
   }
}

Bước 4 – Thêm các dòng sau vào app / Http / route.php.

Route::get('ajax',function() {
   return view('message');
});
Route::post('/getmsg',[AjaxController::class,'index']);

Bước 5 – Truy cập URL sau để kiểm tra chức năng Ajax.

http://localhost:8000/ajax

BÌNH LUẬN

Vui lòng nhập bình luận của bạn
Vui lòng nhập tên của bạn ở đây