How to pass data from Laravel View to Ajax or Javascript code without html div (id or class) - Laravel 5.3

Question

So, currently I am passing values stored in Database MySQL to View (using Controller). I do simple querying ModelName::where()->first();.

I have my data right now in View. I want to use that data in Ajax or Javascript code that I am writing.

I can have 46 values and one way to do this is to have <div id="field1"></div> for 46 times set div style to display:none in css and in Javascript use document.getElementById('field1'); to access the values and finally, do whatever I want to do with it.

But I find this quite long and un-necessary to do as there is no point of printing all the values in html first and then accessing it. How can I directly get {{$data}} in Javascript?

myCode

public function index(Request $request){

        $cattfs = Cattf::all();
        $cattts = Cattt::all();
        $cattos = Catto::all();

        return view('/index',compact('cattfs'));
}

View

Nothing in the view. and I prefer it to be none.

Javascript and Ajax

$(document).ready(function()
{
    init(); 
});

function init(){
    my_Date = new Date();
    var feedback = $.ajax({
        url:url,
        dataType: "JSON",
        type: "GET",
    }).success(function(data){
   console.log(data);
  //I have some data called data from url
  //I want some data from controller like: cattf,cattt,catto
  //I will combine url data and cattf and do simple arithmetic to it
  //finally output to the view.
  }).responseText;
}

Do you want to append elements after an ajax call or in the initial view setup? You may need to use a for loop in javascript. Get all the elements with classes and for loop them. While looping, set each one to `.show()` — senty, Apr 08 '17 at 22:21
@senty I don't seem to understand your question, can you rephrase it? If you mean appending html elements then no. — Murlidhar Fichadia, Apr 08 '17 at 22:24
@senty Can you show what you mean? I get the part of using while loop so no repetition but then I dont want any {{$fields}} in html as there is no role those values in html View. — Murlidhar Fichadia, Apr 08 '17 at 22:26
`@foreach ($data) your html @endfoeach` is what you need to do in the blade html. Assign them classes. Then depending on how you want to show them, you can do it in javascript — senty, Apr 08 '17 at 22:26
@senty I get this error when I follow the link: Uncaught SyntaxError: Unexpected token { in JSON at position 1 at JSON.parse () at Object. (ajax.js:16) at n (jquery.js:768) at Object.fireWith [as resolveWith] (jquery.js:832) at w (jquery.js:3799) at XMLHttpRequest.d (jquery.js:4083) — Murlidhar Fichadia, Apr 08 '17 at 22:50

score 2 · Accepted Answer · answered Apr 08 '17 at 23:21

2

One good way would be to actually make a small API to get your data. Let's say you wanted to retrieve users.

In the api.php file in your route folder:

Route::get('/posts', function () {
    return Post::all();
});

and then you just need to use http://yourUrl.dev/api/posts as your URL sent in your .ajax() call to work with what you need.

answered Apr 08 '17 at 23:21

Jean-Philippe Murray

1,208
2
12
34

Thanks will try this. – Murlidhar Fichadia Apr 08 '17 at 23:54

score 0 · Answer 2 · answered Apr 08 '17 at 23:02

0

I found best solution use this: https://github.com/laracasts/PHP-Vars-To-Js-Transformer

It takes values from controller directly to Javascript.

answered Apr 08 '17 at 23:02

Murlidhar Fichadia

2,589
6
43
93

How to pass data from Laravel View to Ajax or Javascript code without html div (id or class) - Laravel 5.3

2 Answers2