---
description: >-
  https://stackoverflow.com/questions/62486411/how-to-display-json-data-in-laravel-blade-view
---

# Display JSON data in laravel blade view (ok)

<figure><img src="https://1592565776-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LVfVRgKBlsVnWvhnDaa%2Fuploads%2Fu3FS6JJUronSKmuadARq%2Fimage.png?alt=media&#x26;token=f14336be-671f-4911-b0c5-e95a7f29d02a" alt=""><figcaption></figcaption></figure>

Ban đầu sử trả về dữ liệu nguyên mẫu của database

<figure><img src="https://1592565776-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LVfVRgKBlsVnWvhnDaa%2Fuploads%2F75RvZUH3qJvIFXENzdnh%2Fimage.png?alt=media&#x26;token=f26fbced-de1a-446a-9004-771074cc20b4" alt=""><figcaption></figcaption></figure>

Sau khi chỉnh sửa&#x20;

<figure><img src="https://1592565776-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LVfVRgKBlsVnWvhnDaa%2Fuploads%2F82mALTTfC2X0YsYChsiL%2Fimage.png?alt=media&#x26;token=39c80ef8-318a-4566-8bad-4249d3a0d5bb" alt=""><figcaption></figcaption></figure>

C:\xampp8\htdocs\lva\routes\web.php

```php
<?php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\SettingController;
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/
Auth::routes();
Route::resource('/', SettingController::class);

```

C:\xampp8\htdocs\lva\resources\views\home.blade.php

```
@extends('layouts.app')
@section('content')
<form action="{{route('store')}}" method="POST">
  @csrf
  <input type="submit" value="Submit">
</form>
@php
  echo '<pre>';
  var_export($settings);
  echo '<pre>';
@endphp
@endsection

```

C:\xampp8\htdocs\lva\app\Http\Controllers\SettingController.php

```php
<?php
namespace App\Http\Controllers;
use App\Models\Setting;
use Illuminate\Http\Request;
use App\Http\Traits\GlobalTrait;
class SettingController extends Controller
{
  use GlobalTrait;
  public $settings;
  public function __construct()
  {
    $this->settings = $this->getAllSettings();
  }
  /**
   * Display a listing of the resource.
   *
   * @return \Illuminate\Http\Response
   */
  public function index()
  {
    $settings = $this->settings->toArray();
    return view('home')->with(compact('settings'));
  }
  public function store(Request $request)
  {
    $input = [
      'title' => 'Demo Title',
      'data' => [
        '1' => 'One',
        '2' => 'Two',
        '3' => 'Three'
      ]
    ];
    $item = Setting::create($input);
  }
}

```

C:\xampp8\htdocs\lva\app\Http\Traits\GlobalTrait.php

```php
<?php
namespace App\Http\Traits;
use App\Models\Setting;
trait GlobalTrait
{
  public function getAllSettings()
  {
    // Fetch all the settings from the 'settings' table.
    $settings = Setting::all();
    return $settings;
  }
}

```

C:\xampp8\htdocs\lva\database\migrations\2022\_12\_28\_063837\_create\_settings\_table.php

```php
<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
return new class extends Migration {
  /**
   * Run the migrations.
   *
   * @return void
   */
  public function up()
  {
    Schema::create('settings', function (Blueprint $table) {
      $table->id();
      $table->string('title');
      $table->json('data')->nullable();
      $table->timestamps();
    });
  }
  /**
   * Reverse the migrations.
   *
   * @return void
   */
  public function down()
  {
    Schema::dropIfExists('settings');
  }
};

```

C:\xampp8\htdocs\lva\app\Models\Setting.php

```php
<?php
namespace App\Models;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;
class Setting extends Model
{
  use HasFactory;
  public $timestamps = false;
  protected $fillable = [
    'title',
    'data'
  ];
  protected $casts = [
    'data' => 'array'
  ];
}

```

<figure><img src="https://1592565776-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LVfVRgKBlsVnWvhnDaa%2Fuploads%2FAl2m6SdFgP00TWJZrXtw%2Fimage.png?alt=media&#x26;token=be2d36e4-ff5a-4374-a5d9-f4dee19aa97b" alt=""><figcaption></figcaption></figure>

C:\xampp8\htdocs\lva\database\factories\SettingFactory.php

```php
<?php
namespace Database\Factories;
use Illuminate\Database\Eloquent\Factories\Factory;
/**
 * @extends \Illuminate\Database\Eloquent\Factories\Factory<\App\Models\Setting>
 */
class SettingFactory extends Factory
{
  /**
   * Define the model's default state.
   *
   * @return array<string, mixed>
   */
  public function definition()
  {
    $datetime = $this->faker->dateTime();
    return [
      'title' => 'Setting',
      'data' => '{"1":"One","2":"Two","3":"Three"}'
    ];
  }
}

```

C:\xampp8\htdocs\lva\database\seeders\DatabaseSeeder.php

```php
<?php
namespace Database\Seeders;
// use Illuminate\Database\Console\Seeds\WithoutModelEvents;
use Illuminate\Database\Seeder;
class DatabaseSeeder extends Seeder
{
    /**
     * Seed the application's database.
     *
     * @return void
     */
    public function run()
    {
        // \App\Models\User::factory(10)->create();
      \App\Models\Setting::factory(10)->create();
    }
}

```
