Getting data by route to javascript in view from controller response

@loomix you don't need to specify root.

just give your url as '/resource-feed'. its as relative path, so your front end will know to request it from your domain.

you may also be best to fetch the data in your controller and pass it into your view to be used by your js, and then you don't need to do the ajax call at all.

let data = '{{ $data }}'

@automica Thanks, could you be a bit more specific about pass it into your view to be used by your js? I am not sure yet how to get the data from the feed to $data.

@loomix yeah.

in a controller method

eg

public function show($id) {



$data = ResourceFeed::someMethod();


return view('show', ['data' => $data]);
}

and in your view

<script>

let data = '{{ $data }}'

// do something with your data

</script>

So you are calling the same class you would be using in your '/resource-feed' call and passing that directly to your blade instead of rendering the view and then calling the data for it.

Depends on how much data you are loading though, as it will be quicker to initially render your page and then make the ajax call (the way you are doing it at the moment).

The benefit of doing it via the controller is that the data will be cached into the blade so will be quicker on subsequent visits.

Wow, that's really something, also performance-wise. Thanks, will try that!

Okay, the controller response with return view('toolplans.index', ['resdata' => $resdata]); is working but there's something not right with the js part: let resdata = '{{ $resdata }}' just puts the string {{ $resdata }} to resdata. The js is in an external file which is refered to by <script src="{{ asset('js/ctm/tpindex.js')}}"></script> -- is that an issue?

@loomix the javacript needs to be inline in the blade for this to work. might be best then to revert back the way you were doing it originally then.

No can do. I guess I have to put it in a hidden field of the view and get it by const resdata = document.querySelector('#mydata'); ? Is there really no way to get the feed by routing?

@loomix you can get it via routing, providing you have a route that responds to /resource-feed. At that point you can use your ajax call.

you probably could still inline

<script>

let resdata = '{{ $data }}'

// do something with your data

</script>

in your blade and reference it from there. That way you wont need a hidden element, just a block of js with a single variable in it.

...and let rdata = resdata; does the trick in the external js to fetch the data from controller, respectively view. Thanks, will do it this way, it's more clear than a hidden field.

@loomix good stuff. glad we've got it working :P

oh dear, there's one issue left: the data feed is the resource for FullCalendar and it does not accept resdata as a resource. To see what the problem is I printed both the response from the ajax request (which is working as a resource) and the contents of resdata (the javascript way):

ajax response (working) printed to view with document.getElementById('out').innerHTML = response;

[object Object],[object Object],...

javascript resdata (not working) printed to view with document.getElementById('out2').innerHTML = resdata;

[{"id":"1110","order":1,"title":"Shemar Zieme (1110) (1)"},{"id":"1114","order":2,"title":"Peyton Moore (1114) (2)"},...

Both data are coming from the same controller function. I guess I have to encode the javascript data somehow to make it work as a resource?

Doing console.log(resdata) gives me loads of quotes, that does not seem right, maybe that's the issue?

[{"id":"1110","order":1,"title":"Shemar Zieme (1110) (1)"},{"id":"1114","order":2,"title":"Peyton Moore (1114) (2)"},...

Use @json()

Docs: https://laravel.com/docs/8.x/blade#displaying-data (look fro Rendering JSON)

@michaloravec Thank you, by using var resdata = @json($resdata); in my view everything is working fine!

However, best answer must go to @automica , because he answered my initial question how to avoid Ajax here.