Laravel - Ajax
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 ().
cú pháp hàm json ()
json(string|array $data = array(), int $status = 200, array $headers = array(), int $options)Thí dụ
Step 1 - Tạo một tệp xem được gọi là resources/views/message.php và sao chép 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>Step 2 - Tạo một bộ điều khiển được gọi là AjaxController bằng cách thực hiện lệnh sau.
php artisan make:controller AjaxController --plainStep 3 - Sau khi thực hiện thành công, bạn sẽ nhận được kết quả sau:
Step 4 - Sao chép mã sau vào
app/Http/Controllers/AjaxController.php tập tin.
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);
}
}Step 5 - Thêm các dòng sau vào app/Http/routes.php.
app/Http/routes.php
Route::get('ajax',function() {
return view('message');
});
Route::post('/getmsg','AjaxController@index');Step 6 - Truy cập URL sau để kiểm tra chức năng Ajax.
http://localhost:8000/ajaxStep 7 - Bạn sẽ được chuyển đến một trang mà bạn sẽ thấy một thông báo như trong hình sau.
Step 8 - Đầu ra sẽ xuất hiện như trong hình sau khi nhấp vào nút.
