Laravel 8 View Render Example

Laravel 8

Nicesnippets

5731

31-05-2021


Hi Guys,

In this example,I will learn you how to view render in laravel 8.you can easy and simply view render in laravel 8.

Sometimes, we use get html view layout from ajax request. At that you have to first render view file and then you need to store view in varibale and then we can return that varibale. In bellow example i render view with pass data you can see how i did:

Step 1 : Create Route


In this step,you can create route file in laravel.

routes/web.php

use App\Http\Controllers\ViewRenderController;

Route::get('view', [ViewRenderController::class, 'view']);

Route::post('view-render', [ViewRenderController::class, 'viewRender'])->name('view.render');

Step 2 : Create Controller

In this step,you can create to ViewRenderController in controller file.

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class ViewRenderController extends Controller

{

public function view()

{

return view('view');

}

public function viewRender(Request $request)

{

$viewRender = view('viewRend')->render();

return response()->json(array('success' => true, 'html'=>$viewRender));

}

}

Step 3: Create Render File

<!DOCTYPE html>

<html>

<head>

<title>Laravel 8 View Render Example - Nicesnippest.com</title>

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">

</head>

<body>

<div class="container">

<div class="row">

<div class="col-md-12">

<h3>Laravel 8 View Render Example - Nicesnippest.com</h3>

</div>

</div>

</div>

</body>

</html>

Step 3: Create Blade File

<!DOCTYPE html>

<html>

<head>

<title>Laravel 8 View Render Example - Nicesnippest.com</title>

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">

</head>

<style type="text/css">

body{

background:#fd56c2 !important;

}

.box{

margin-top:200px;

background:#fff;

padding:100px 50px;

text-align: center;

}

</style>

<body>

<div class="container">

<div class="row">

<div class="col-md-8 offset-md-2 box">

<div class="viewRender">

</div>

</div>

</div>

</div>

</body>

<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>

<script type="text/javascript">

$(document).ready(function(){

$_token = "{{ csrf_token() }}";

$.ajax({

headers: { 'X-CSRF-Token' : $('meta[name=_token]').attr('content') },

url: "{{ route('view.render') }}",

type: 'POST',

cache: false,

data: {'_token': $_token },

datatype: 'html',

beforeSend: function() {

//something before send

},

success: function(data) {

console.log(data);

$('.viewRender').html(data.html);

}

});

});

</script>

</html>

It will help you...