i want to extract data from the database and send as JSON file to the front-end and then try to draw graph. i have three tables notification where the website url is saved, status that has status and speed( google page speed) and a pivot table where all data related to a website is stored as values. i have model, and inside the model, i have a function that makes many to many relations between notifications and status table. i have a controller called chart controller
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class ChartController extends Controller
{
public static function speedHistory(){
$o_status = Status::where('name','speed')->first();
$o_response = $this->statuses()->where('status_id', $o_status->id)
->select('values AS value', 'created_at AS timestamp')->orderBy('created_at','DESC')->get();
if($o_response){
return response()->json($o_response);
}
// return an empty json array instead of false
//return false;
return response()->json(array());
}
}
and a front end page called app.js
document.addEventListener('DOMContentLoaded', function(){
$.getJSON("/json", function (result) {
alert(result)
}
and a route
Route::get('json','ChartController@speedHistory');
i use alert to see,if the data is going to app.js but it doesnt work. i would apperciate nay kind of help and suggestions?
this is the view file
extends('layout')
@section('header')
<a class="logout" href="<?php echo 'login'?>">Logout</a>
<a href="{{ URL::to('/') }}">
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/6/65/Crystal_button_cancel.svg/32px-Crystal_button_cancel.svg.png" alt="Submit" width="48" height="48">
</a>
@stop
@section('content')
<script src="app.js"></script>
<table class="table">
<thead>
<h3>{{ $notification->website_url }}</h3>
<tr>
<th>date</th>
<th>status</th>
</tr>
</thead>
<tbody>
<?php $notificationHealth = $notification->history('health'); ?>
@foreach($notificationHealth as $status)
<tr>
<td>{{ $status['timestamp'] }}</td>
<td> {{ $status['value'] }}</td>.
</tr>
@endforeach
</tbody>
</table>
<canvas id="pageSpeedHistoryChart" width="200" height="50"></canvas>
@stop
@section('footer')
@stop
